Shortening A Url And Getting A QR Code With

Author: Steven Neiland

Warning: This blog entry was written two or more years ago. Therefore, it may contain broken links, out-dated or misleading content, or information that is just plain wrong. Please read on with caution.

As a follow up on last weeks post about an incompatibility between Railo and Adobe when reading a remote file. Today I am going to demonstrate how I use to generate the QR Code on my article print view.

As it turns out ColdFusion and bitly make it very easy to generate and output a QR Code. I have broken it down into four steps.

Step 1: Create A Account And Create A Component Named Bitly.cfc

Before we can get started we first need to create an account with bitly. Once the account is created you will get a username and api key.

With these now create a component named bitly.cfc and create the following initialization function in it. The use of the third argument will become clear later on.

<cffunction name="init" output="false">
      <cfargument name="username" required="true" type="string">
      <cfargument name="apikey" required="true" type="string">
      <cfargument name="isRailo" required="false" type="boolean" default="0" hint="Set to 1 if running on railo">
      <cfset variables.username = arguments.username>
      <cfset variables.apikey = arguments.apikey>
      <cfset variables.isRailo = arguments.isRailo>
      <cfreturn this>

Step 2: Shorten The Url

With the component setup we must now create another function in the bitly component that can take the original long url and shorten it using the api.

<cffunction name="getShortUrl" access="public" output="false" returnType="string" 
            hint="Take a long url to a webpage and compress using the service">

      <cfargument name="longURL" required="true" type="string" hint="The full url that must be shortened">

      <cfset var requestUrl = "">
      <cfset var cfhttpResult = "">
      <cfset var xmlObject = "">
      <cfset var shortUrl = "">

      <!--- Build the request string to send to the service --->
      <cfset requestUrl = "">

      <!--- Call the service --->
      <cfhttp url="#requestUrl#" method="get" result="cfhttpResult" />
      <!--- If a good response --->
      <cfif cfhttpResult.StatusCode EQ '200 OK'>
            <!--- Parse the filecontent string into an xml object --->
            <cfset xmlObject=xmlParse(cfhttpResult.filecontent)>

            <!--- Extract the shortened url --->            
            <cfset shortUrl = xmlObject[1]>

      <cfreturn shortUrl>

Step 3: Get The QR Code Binary For The Shortened Url

When creates a shortened url it also creates a QR Code for it automatically. All we need to do now is read it using cfhttp. The QR Code is accessed using this address pattern:{shorturlcode}.qrcode

Plugging this into a function in our bitly component we get this. Note how the isRailo flag is used to deal with the previously discussed incompatibility between ACF and Railo.

<cffunction name="getQRCodeFromShort" access="public" output="false" returnType="any">
      <cfargument name="shortUrl" required="true" type="string" hint="The shortened url">
      <cfset var cfhttpResult = "">
      <cfset var returnImage = "">
      <!--- Call the service --->
      <cfhttp url="#shortURL#.qrcode" result="cfhttpResult"/>
      <!--- If a good response --->
      <cfif cfhttpResult.StatusCode EQ '200 OK'>
            <cfif variables.isRailo>
                  <!--- Omit the toByteArray() call if running on Railo --->
                  <cfset returnImage = cfhttpResult.fileContent/>
                  <!--- Call toByteArray if running on Adobe ColdFusion --->
                  <cfset returnImage = cfhttpResult.fileContent.toByteArray() />

      <cfreturn returnImage>

Step 4: Output The QR Code To The Browser

Finally with the byte array of the qr code image returned we need to output it to the screen. This is done with a simple call to cfimage.

You will notice that I am doing a check to see that the qrcode bytearray is not empty (i.e. The service request succeeded). I am using toString() to convert the bytearray value into a simple string that CF can compare against an empty string.

<!--- Test that a non empty string is returned for the qr code binary --->
<cfif toString(qrcodeBinary) NEQ "">
      <!--- Use cfimage to output the qr code to the browser --->
      <cfimage action="writeToBrowser" source="#qrcodeBinary#" />

Putting It All Together

Finally we can test our completed bitly component and output method.

<cfset longUrl = "">

<cfset urlshortner = createObject("component","bitly").init(
      username = {your bitly username}
      ,apikey = {your api key}
      ,isRailo = 0 {set to 1 if running on railo}

<!--- Get the short url --->
<cfset shortUrl = urlshortner.getShortUrl(longUrl)>

<!--- Get the qr code binary data --->
<cfset qrcodeBinary = urlshortner.getQRCodeFromShort(shortUrl)>

      Long Url: #longUrl #<br/>
      Shortened Url: #shortUrl#<br/>
      QR Code:<br/>

<!--- Test that a non empty string is returned for the qr code binary --->
<cfif toString(qrcodeBinary) NEQ "">
      <!--- Use cfimage to output the qr code to the browser --->
      <cfimage action="writeToBrowser" source="#qrcodeBinary#" />

Reader Comments

  • Please keep comments on-topic.
  • Please do not post unrelated questions or large chunks of code.
  • Please do not engage in flaming/abusive behaviour.
  • Comments that contain advertisments or appear to be created for the purpose of link building, will not be published.

Archives Blog Listing