How I learned to protect image

Image protection

In this article I want to outline the hard way that I was "protecting" images on the web. Before we begin this exciting journey, I want to mention two approaches in the protection of the images:

the
1. limitation/prohibition of posting direct links to originals images
the
2. you are paranoid and are trying to limit the anti - copies images

UPDATE
Universal protection certainly does not exist. Article about how not to expose directly to GET the data from SQL queries. Only in the context of protecting the image.

▌Limited copies of my children's Bicycle

In the beginning of my journey was traditionally a Bicycle. Many years ago I worked on a wonderful project. There were many wonderful photos of animals and nature. It was these photos (and more specifically full-size version) needed to protect with all my strength. The client wanted not just ban direct links to image files, and void the user's chance to download these same images. To apply watermarks did not want to.

We have already read about what the programmers lie all the time. So I had to do something like customer. The decision turned out to be quite nice. When you request a page with a photo, we generate a $secretKey and stored in session under this key in the path to a full-size copy of an image:

the

public function actionView()
{
// ...
$_SESSION['protected-photos'][$secretKey]['file'] = $photoPath;
// ...
}

In a view also points the way to the pictures in the following form:

the

<img src="/photo/source/{secretKey}" />

Now in the actionSource we get from the session path to a full-sized copy of the photo, send it with the correct headers and clear the path to the full size of the file:

the

public function actionSource()
{
$secretKey= $_GET['key'];
$session = &$_SESSION['protected-photos'];
$file = $session[$secretKey]['file'];
if (is_file($file)) {
header('Content-type: image/jpeg');
echo file_get_contents($file);
}
$session[$secretKey]['file'] = ";
}

As a result, if the user tries to download / open in a new tab / to share a picture, he will return her little copy.

Important: the Weak point of this approach is quite obvious: if the photo page request from the browser, like wget. In this case, the img will make a request to /photo/source/{secretKey}. Thus it will contain a full-size copy of the photo.

▌, Limited direct links: .htaccess

Later I learned that the easiest and most common way to protect images is to adjust accordingly .htaccess. It is possible not only to ban direct links to images, but to specify the cover that will appear on third-party resources instead of the original images from your website. Here is an example of such a configuration:

the

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^http://(.+\.)?mysite\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^$
RewriteRule .*\.(jpe?g|gif|png)$ http://i.imgur.com/qX4w7.gif [L]

The first line contains a Directive which includes this change. Here everything is simple. The second line we block any sites, besides our own mysite.com. Code [NC] means "without variants", in other words, case-insensitive according to the URL. The third row we allow empty referrals. And finally, the last line machito all files with the extension JPEG, JPG, PNG, GIF, and replaces them with qX4w7.gif on server imgur.com.

Optionally, you postupci otherwise: deny direct links to image for specific domains.

the

RewriteEngine On
RewriteCond %{HTTP_REFERER} ^http://(.+\.)?myspace\.com/ [NC,OR]
RewriteCond %{HTTP_REFERER} ^http://(.+\.)?blogspot\.com/ [NC,OR]
RewriteCond %{HTTP_REFERER} ^http://(.+\.)?livejournal\.com/ [NC]
RewriteRule .*\.(jpe?g|gif|png)$ http://i.imgur.com/qX4w7.gif [L]

Every RewriteCond except the last, must contain the code [NC, OR]. OR means "or next", i.e. coincidence with the current domain or the following.
Also, instead of the image of the stub is possible to return HTTP error code 403:

the

RewriteRule .*\.(jpe?g|gif|png)$ - [F]

Important: do not attempt to return images instead of HTML page. You can return either another image, libotr error.

▌, Limited direct links: nginx

For nginx all the same:

the

location ~* \.(jpe?g|gif|png)$ {
set $bad_ref "N";
if ($http_referer !~ ^(http://(.+\.)?myspace\.com/http://(.+\.)?blogspot\.com/http://(.+\.)?livejournal\.com)) {
set $bad_ref "Y";
}
if ($bad_ref = "Y") {
return 444;
}
}

Update: VBart suggested in your comments that is much better to use ngx_http_referer_module.

▌, Limited direct links: Amazon CloudFront Signed URLs

Amazon CloudFront is one of the best options for delivery of content to users. In addition to their duties the ordinary CDN'but, it also gives you the ability to generate signed links. Such links provide the opportunity to restrict access to file on time, as well as over IP. Thus, for example, you can specify that the image will be available within 10 minutes. Or 7 days starting tomorrow.

On average, link to the following file:

1d111111abcdef8.cloudfront.net/image.jpg?2color=red&size=medium3&Policy=eyANCiAgICEXAMPLEW1lbnQiOiBbeyANciagicagicjszxnvdxjjzsi6imh0dha 6Ly9kemJlc3FtN3VuMW0wLmNsb3VkZnJvbnqubmv0l2rlbw8ucghwiiwgdqogicagicaiq 29uZGl0aW9uIjp7IA0KICAgICAgICAgIklwqwrkcmvzcyi6eyjbv1m6u291cmnlsxaioii yMDcuMTcxLjE4MC4xMDEvMzIifSwNCiAgicagicagicjeyxrlr3jlyxrlclroyw4ionsiq VdTOkVwb2NoVGltZSI6MTI5Njg2MDE3Nn0sdqogicagicagicairgf0zuxlc3nuagfuijp 7IkFXUzpFcG9jaFRpbWUiOjEyOTY4NjAymjz9dqogicagicb9ia0kicagfv0gdqp9dqo4&Signature=nitfHRCrtziwO2HwPfWw~yYDhUF5EwRunQA-j19DzZrvDh6hQ73lDx~ -ar3UocvvRQVw6EkC~GdpGQyyOSKQim-TxAnW7d8F5Kkai9HVx0FIu-5jcQb0UEmat EXAMPLE3ReXySpLSMj0yCd3ZAB4UcBCAqeijkytl6f3fvyngqi65&Key-Pair-Id=APKA9ONS7QCOWEXAMPLE

Now the points:

the
1. basic link to your image. This is the link you used to access the image prior signed references.
the
2. an Arbitrary query parameters that are typically used for logging access to images. CloudFront allows peredavat to cache and log these options. Important: name parameters is reserved by CloudFront: Expires, Key-Pair-Id, Policy, Signature. It is best to add to your settings the prefix x. This will be especially useful if your image are stored on Amazon S3.
the
3. Rules for access to izobrazhenij in JSON format and with no spaces (detali).
the
4. Keshirovaniya and signed version of the access rules from the previous item (detali).
the
5. Key signatures (detali).

Important: CloudFront doesn't support CNAMEs with HTTPS. Ie you can't replace d111111abcdef8.cloudfront.net images.example.com. There are two possible solutions to the problem:

the
1. to Return use the domain https://*.cloudfront.com images.
the
2. Leave the domain images.example.com, but to use it via the HTTP Protocol.

Choosing one of two options in fact it is a matter of taste. Fundamentally they are not different.

▌epilogue

I hope the approaches described above will help you faster to navigate in the difficult task of protecting images on the web. And some useful links on the subject:

the
1. Hotlinking: Generator .htaccess
the
2. Hotlinking Configuration .htaccess
the
3. Hotlinking: Example nginx configuration
the
4. Hotlinking: Checking

Article based on information from habrahabr.ru