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:
src="//embed.gettyimages.com/embed/488344275?et=-AesBiwMQb5LLh6krfjSJw&sig=nxsiL6uBhQNOeWxMs0-04_TmimSD3-PcKaqmf-Y_xTs="
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.
src="//embed.mydomain.com/embed/embed-image.php?path/to-the-photo"
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?
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
or /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 \images\image.jpg
)
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.
- Use
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.
Just using 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.
Editors note: This code is highly insecure because it exposes every
file PHP has access to to the public.
i would use a domain like this:
src="//embed.mydomain.com/embed/embed-image.php?path=path/to-the-photo"
Note the extra path kexword in the domain
Now all it takes, is to use the path from the domain and return the image from the path.
<?php
$path = $_GET["path"]; // takes the path from the domain
header("Content-Type: image/png"); // change this when it is a gif or jpeg (Note: jpeg = jpg here)
header("Content-Length: " . filesize($path)); // sets the size of the returned object
readfile($path); // returns the file from the path
?>