Getting The URL Of ColdFusion 8's Temporary Images
Posted November 9, 2007 at 3:56 PM by Ben Nadel
ColdFusion 8 has some awesome image functionality, one piece of which is the ability to write temporary images to the browser. This can be done with the ColdFusion 8 CFImage tag and the action WriteToBrowser. When you do this, ColdFusion writes the image as a temporary file to a directory which acts as a mini file servlet (or something - not sure on the details). This temporary image is available for a few minutes and then ColdFusion automatically deletes it.
This is really cool, but unfortunately, the action itself writes the IMG tag directly into the response output buffer. This can cause problems if you want to do anything else with the image other than simply displaying it. For example, if you wanted to add a CSS class or even load it into a Javascript image object you would be out of luck.
To get around this, I created a tiny little ColdFusion function that encapsulates the Write-To-Browser action and instead of writing the IMG tag, all it does is return the URL of the image that was generated. Like my post on styling the WriteToImage tag action, this function also works by writing the IMG tag output to a variable buffer rather than the page output buffer.
- <cffunction
- name="ImageGetUrl"
- access="public"
- returntype="string"
- output="false"
- hint="Returns the URL of the temporary image generated from the passed in ColdFusion image object.">
-
- <!--- Define arguments. --->
- <cfargument
- name="Source"
- type="any"
- required="true"
- hint="The ColdFusion image object who's URL we want to get."
- />
-
- <cfargument
- name="Format"
- type="string"
- required="false"
- default="png"
- hint="The file type of the image we want to use."
- />
-
- <!--- Define the local scope. --->
- <cfset var LOCAL = {} />
-
-
- <!--- Store the output of the image. --->
- <cfsavecontent variable="LOCAL.Output">
-
- <!--- Write the image the output buffer. --->
- <cfimage
- action="writetobrowser"
- source="#ARGUMENTS.Source#"
- format="#ARGUMENTS.Format#"
- />
-
- </cfsavecontent>
-
-
- <!---
- Extract the URL of the temporary image. This will give
- us an array of the matches, which should only be one.
- --->
- <cfset LOCAL.URL = REMatch(
- "(?i)src\s*=\s*""[^""]+",
- LOCAL.Output
- ) />
-
- <!---
- Clean up the SRC that we extracted. We can think of the
- value a double-quote delimited list in which our true
- SRC value is the last item.
- --->
- <cfset LOCAL.URL = ListLast( LOCAL.URL[ 1 ], """" ) />
-
- <!--- Return the URL. --->
- <cfreturn LOCAL.URL />
- </cffunction>
The function takes the same arguments that the CFImage / WriteToBrowser action tag (minus the Base64 encoding) and then just returns the URL of the temporary file that ColdFusion 8 writes to the server. I figured it could be used in this kind of a manor:
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html>
- <head>
- <title>ColdFusion 8 Temporary Image URL</title>
- </head>
- <body>
-
- <cfoutput>
-
- <h1>
- Getting The Source of a Temporary ColdFusion Image
- </h1>
-
- <!--- Read the image into a ColdFusion image object. --->
- <cfimage
- action="read"
- source="./cute_blonde.jpg"
- name="imgGirl"
- />
-
- <!---
- Get the source of the temporary image. This action
- will write the image to a temporary file which will
- exist for only a few minutes.
- --->
- <cfset strImageURL = ImageGetUrl( imgGirl, "png" ) />
-
- <p>
- URL: #strImageURL#
- </p>
-
- <p>
- <img
- src="#strImageURL#"
- width="#imgGirl.GetWidth()#"
- height="#imgGirl.GetHeight()#"
- alt="Cute blonde girl"
- title="This is a temporary photo generated by ColdFusion 8"
- border="0"
- />
- </p>
-
- </cfoutput>
-
- </body>
- </html>
Not a lot going on here; it just solved a problem that I was working on and I thought I would share the solution. The only thing you have to be careful of here is that the image itself might be deleted on the server shortly after the referencing page has rendered. This can cause problems if your page Javascript is expecting the image to persist.
Now, you might say, if you need the URL, why not write the image to the file system yourself and use that URL. The benefit of my method is that you don't have to worry about any file management and you don't have to worry about the relative web path - ColdFusion takes care of that for you.
