Protect images directory on host

Tutorials

Protect images directory on host

How to protect resources directories from direct access via browser view?

Well, there are multiple ways to do it but fastest and easiest way is by adding an index file inside this directory.

The What, Why and How questions.

What is a resource directory on a host?

A resource directory is a folder (or folders) on your host which hold some files.

Recommended backend environment for a website /web page is based on a structure.

A web page  (or entire website) uses resources like images, scripts, css  style sheets and other file types.

A good practice is to have all resources grouped in different  directories like a directory for images, a directory (folder) to hold all the css style-sheet files, one for js scripts… so on.

But with an organized backend and management come some risks too and two of them are hacking and hotlinking.

Hacking, well.. everyone knows what hacking is, the general definition but hotlinking is defined much more simple.

Someone can access the root of your website by deleting a few characters from a URL.

Unprotected directory. Root path exposure.

You have an image uploaded on your host, open the full URL of  the image in a new tab and delete from the very end all characters until the first / from end to beginning (right to left)

Example:

https://yourwebsite.com/images/dummy-image.jpg

Now, if I delete the image name and extension I can access the images directory.

https://yourwebsite.com/images/

If it is not protected in any way, I can download or use any of the files available on this directory and here’s what I can define as hotlinking.

Quick fix.

Create an index.html or index.php file and upload it to this directory.

File can be empty, can have a redirect or it can have some simple content with info and  a link to main page. Read more on forum

Because  contextual situation of this material is missing, I need to mention that this material is useful for users who are not running a CMS (content management system like WordPress platform for example) on their host. Usually CMSs come with folders/directories protected.

Ways to protect a source directory

Here’s the basic .htaccess code to protect resources from hotlinking

view rule

How to create an index file?

Simply create a new file in Notepad or Notepad++ and save it as index.html . It can be empty or have some sort of content. An automatic redirect (thus I don’t recommend for big sites) or a text to inform visitor they are not allowed to visit that section of your website.

For your inspiration, here are a few 404 free HTML templates you can use

Want to know more about .htaccess? Read the post

About Dan N

Self-taught web designer and entrepreneur. I do like writing articles even if English is not my native language so, if you find gramma errors or misspelled words feel free to point them out / let me know. Or I'll simply write in Romanian and you'll need to learn my language to read articles. Kidding. Anyway, my hobby is web and graphic design, I'm not a programmer so bare with me :) @Dan_CGC

Related posts