Description of "showthumb.cfm"

This script is short but important. It is called for each thumbnail image and it receives a URL parameter called "JpegName" which tells it which image to display.

<cfcache action="flush">
<cfobject action="create" name="image" class="csImageFile.Manage">
<cfset CurrentDir=ExpandPath("./")>
<cfset image.ReadFile(currentdir & "images\" & url.JpegName & ".jpg")>
<cfset image.Scale(15)>
<cfset tempfile=currentdir & CreateUUID() & ".jpg">
<cfset image.WriteFile(#tempfile#)>
<cfcontent type="image/jpeg" deletefile="yes" file=#tempfile# >

The first line prevents the page from caching. This is recommended when creating images dynamically.

Then we create an instance of the csImageFile object. If you are using the trial component you must replace "csImageFile" with "csImageFileTrial" ("csImageFile64" or "csImageFile64Trial" for the 64 bit versions).

Next we find the physical path to the directory containing the script. It uses the ExpandPath function. This path could be hard coded instead.

The image is read into csImageFile using the ReadFile method. The parameter is the physical path and file name of the full size jpg image. The images are in a sub directory called "Images". The file name is the name provided in the URL variable with ".jpg" appended.

Then we resize the image. This is a scaling to 15% of the original size.

We are using CFCONTENT to stream the file to the browser so we save it in a temporary file first. To ensure the file name is unique we use the CreateUUID() function to produce a name. For more on streaming a file, including the PageContext method which does not require a temporary file - Click Here.

Finally, we stream the image to the browser in JPG format. The cfcontent tag is used with deletefile="yes". This takes care of removing the temporary file. It is also important to set the content type to "image/jpeg".

The permissions on the directory containing the script must give the Windows account that runs Cold Fusion must be at least "Modify". If it only has "Write" permission the cfcontent tag will not delete the file.

Creating thumbnails in this way is a very common way to use csImageFile and there are a lot of variations of how it can be done. This example is relatively simple with only 4 images, all in the same directory, and the file names are hard coded into the <img> tags. It would be possible to list files from a directory and restrict the number on each page. It would also be possible to do something to each image, such as adding some text like a copyright notice.