I have many photos already stored on my website and I want to allow other people to publish any of these photos on their own websites. What I'm trying to do is create embed code for each photo to allow third parties to publish a photo within an iframe (I'm using PHP). It's just like what Getty Images have done here - allowing others to embed their photos.
Getty's embed code uses an iframe with the source to the image/webpage being something like this:
My problem is that I don't know the best way to create/reference the image/page. Getty has created a new page to host each individual image, which allows them to add captions etc. My images are not in a database, they are just contained in certain folders and I display them on my website with a foreach/glob script.
To display the iframe's target source page, I could have a PHP template which is given the unique image file name by the embed code.
The PHP template then displays the correct image and any appropriate image meta data. I'm sure this comes with lots of security implications - is there a better way to do this?
Best How To :
I'm pretty sure that Getty doesny create a new page for every single image. They probably just use
htaccess to redirect the image request to a script that handles the request. Perhaps something like:
//this will allow alphanumeric id's with _ and -. You could alter to only allow numeric by only using [0-9] instead of [a-zA-Z0-9_-]
RewriteRule ^embed/([a-zA-Z0-9_-]+)$ embed.php?id=$1
RewriteRule ^embed/([a-zA-Z0-9_-]+)/$ embed.php?id=$1
Now a request like
/embed/hash6834hfds/ will be redirected to
embed.php?id=hash6834hfds. Now you can use the
embed.php file to show the correct image.
How secure this is, depends completly on your implementation of
embed.php, but as this work like any request, you should apply the same caution and messures. Some things to keep in mind, but not limiting to:
- Check if the ID/hash is what you expect (numeric/aplhanumeric/etc)
- If you use it in a query to get meta data. Always make sure its not used for mysql injection
- If you are concerned with people stealing images, dont use sequential numbers
Even if you want to go with your own solution, it's not a problem to supply a PATH as a parameter to your script. Just make sure you dont use the full path to the location on the server (EG: dont use
c:\inetpub\wwwroot\images\image.jpg on windows but use
Also if you do receive a full path, make sure it is what you expect it to be. People could be using
\images\..\index.php to move to your root folder. Or even worst all the way to a system folder. First and most important check is that it is just an image they are requesting. If they do use some exotic way to bypass your folder check, if they can only access images you are still relatively safe.
Whatever way you go, if you use
PHP to actually show the image, you are using more resources then needed. So if you expect a lot of visitors or care about performance, dont use
PHP to read the file and output it with the correct headers.
My personal vote would be to use the following procedure
- Index all images you have in your folder and save the path to the database.
- Store a unique key with each image in the database and the meta data you want users to see.
htaccess to link the unique key to a PHP file
- In the
PHP file check if the hash links to an image in the database
- Show the meta data with php a long with an
<img src=""> tag to the actual image on a public path of your website
On a side note: Not sure if you understand what the "//:" part of the
URL is, but it means "use the same protocol as this website is using". Meaning that if somebody embeds your image/iframe on a webpage using
HTTPS, it will request your site also as
HTTPS, so make sure your server can handle it.
HTTP:// or not having a valid
HTTPS server, would mean that anybody that embeds your image on a secure webpage, is now marked as being unsecure. Obviously that would be an unwise choice.