Is there a way to get a dynamically generated QR to print on a badge card?

105 Views Asked by At

I had to change the QR code generator that we had been using for years since Google discontinued the chart API that was being used. I found a new one here https://goqr.me/api/doc/create-qr-code/. The way that I had it programmed worked for a month or so, but has now stopped.

enter image description here

I tested the generator separately to make sure that it was working correctly by copying the link into a browser, and it worked as it should. The issue as I believe it to be is between the generator being invoked and the QR code being added to the badge card so that it can be printed; so in the <cfif> block. I have tried using an <img> tag putting it in different places to see what would happen. When I put it under the <cfhttp> tag the QR code generated but showed above and separate from the badge card, but when I put that image tag inside the if block the QR code no longer showed up anywhere.

enter image description here

Any help would be greatly appreciated and I thank you in advance.

This is the output part that makes the badge cards.

<!DOCTYPE html>
<cfparam name="downloadedBinary" default="">
<html>
<head>
    <meta charset="utf-8">
    <title>Camera Output</title>
</head>
<body>

<cfif Not IsDefined('Form.LicenseType')>
    <cfset Form.LicenseType='1,1'>
</cfif>
<cfif IsDefined("Form.Track")>
    <cfif Form.Track eq 'Fair Meadows Tulsa'>
        <cfset TrackCode='FMT'> 
    </cfif>
    <cfif Form.Track eq 'Remington Park'>
        <cfset TrackCode='RP'>
    </cfif>
    <cfif Form.Track eq 'Will Rogers Downs'>
        <cfset TrackCode='WRD'>
    </cfif>
    <cfif Form.Track eq 'OHRC'>
        <cfset TrackCode='OC'>
    </cfif>
</cfif>
<cfif IsDefined("Form.BadgeNumber")>
    <cfset Session.BadgeNumber=Form.BadgeNumber>
    <cfelse>
        <cfset Session.BadgeNumber='rlp'>
</cfif>
<!---<cfdump var="#form#"><cfset x=yyyyy>--->
<cfif Form.CardFormat gt ''>
    <cfset newSSN=ToString(RandRange(2,999999))>
    <cfset BadgPhotoName=Replace(Form.ExpYear&"-"&TrackCode&"-"&newSSN&Form.CardFormat&ListGetAt(Form.LicenseType,1)&'-1.jpg',' ','','All')>
     
    <cfset myImage = ImageReadBase64("#form.xBase64PhotoString#")>
    <cfif val(form.croppedWidth) gt 0>
        <cfset ImageCrop(myImage,Val(form.xOffset),Val(form.yOffset),Val(form.croppedWidth),Val(form.croppedHeight))>
    </cfif>
    <cfquery name="photoList" datasource="binkleyRestore">
        Select id
        From BCBadgeCards
        Where filename='#BadgPhotoName#'
    </cfquery>
    <cfif photoList.RecordCount>
        <cfset newNumber=ToString(RandRange(2,9999))>
        <cfset BadgPhotoName=Replace(Form.ExpYear&"-"&TrackCode&"-"&NewSSN&Form.CardFormat&ListGetAt(Form.LicenseType,1)&'-'&newNumber&'.jpg',' ','','All')>
        <cfquery name="photoList" datasource="binkleyRestore" >
            Select id
            From BCBadgeCards
            Where filename='#BadgPhotoName#'
        </cfquery>
        <cfif photoList.RecordCount>
            <cfset newNumber=ToString(RandRange(2,9999))>
            <cfset BadgPhotoName=Replace(Form.ExpYear&"-"&TrackCode&"-"&NewSSN&Form.CardFormat&ListGetAt(Form.LicenseType,1)&'-'&newNumber&'.jpg','.png ','All')>
        </cfif>
    </cfif>
    
    <!---<script>
    <cfoutput>
    var #toScript(form, "jsvar")#;
    </cfoutput>
    console.log(jsvar);
    </script>--->
    
    <cfimage source="#myImage#" 
        destination="c:/workgroups/webdata/badgecards/#BadgPhotoName#" 
        action="write" 
        overwrite="Yes">
    
    <cfhttp method="get" url="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=https://www.ohrc.org/binkley/badgeCard/PDFs/#Replace(badgPhotoName, '.jpg', '.pdf', 'All')#" getasbinary="yes" charset="utf-8"/>
    
    <cfif isImageFile("#cfhttp.fileContent#")>
        <cfset myImage=imageNew("#cfhttp.fileContent#")>
        <cfset isImage ("#cfhttp.fileContent#")>
        <cfoutput>
            <img src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=https://www.ohrc.org/binkley/badgeCard/PDFs/#Replace(badgPhotoName, '.jpg', '.pdf', 'All')#" alt="" title=""/>
        </cfoutput>
        <cfimage action="write" source="#cfhttp.fileContent#" destination="c:/workgroups/webdata/badgecards/qr/#Replace(BadgPhotoName,'.jpg','.png','All')#" overwrite="yes">
    </cfif>     

    <cftransaction>
        <cfquery datasource="binkleyRestore" name="updateBadge">
            Insert Into 
                BCBadgeCards (ssn,
                [Year],
                Track,
                LUpdate,
                UserID,
                [FileName],
                BadgeType,
                LicenseType,
                pdfFileName)
        Values ('#Form.SSN#',
                '#Right(Year(Now())&Form.ExpYear,4)#',
                '#TrackCode#',
                '#DateFormat(Now(),'mm/dd/yyyy')#',                                                                                                     <!---<cfqueryparam cfsqltype="cf_sql_date" value="#DateFormat(Now(),'mm/dd/yyyy')#">--->
                '#Session.Auth.UserLogin#',
                '#BadgPhotoName#',
                '#Form.CardFormat#',
                '#ListGetAt(Form.LicenseType,1)#',
                '#Replace(BadgPhotoName,'.jpg','.pdf','All')#')
        </cfquery>
        <cfquery name="getID" datasource="binkleyRestore">
            Select Max(ID) as NewID
            From BCBadgeCards
        </cfquery>
        <cfset BadgeID=getID.NewID>
    </cftransaction>
    <!---<cfhttp url="http://chart.apis.google.com/chart?chs=160x160&cht=qr&chl=#urlencodedformat('http://www.ohrc.org/BadgeCardSearch/BadgeDisplay.cfm?id=#BadgeID#')#&chld=H|0" result="qrcode" getasbinary="yes">--->
    <!---<cfimage action="write" destination="c:/workgroups/webdata/badgecards/qr/#Replace(BadgPhotoName,'.jpg','.png','All')#"  source="#qrcode.filecontent#" overwrite="yes" />--->
    <cfquery datasource="binkleyRestore" name="results">
        Update BCBadgeCards
        Set qrCode='#Replace(BadgPhotoName,'.jpg','.png','All')#'
        Where id=#BadgeID#
    </cfquery>
 </cfif>
 <cfif Form.CardFormat gt ''>
    <cfquery name="BadgeCards" datasource="binkleyRestore">
        Select *
        From BCBadgeCards
        Where id=#BadgeID#
    </cfquery>
    <cfset Session.BADGPHOTONAME='#BADGPHOTONAME#'>
    <cfset Session.EXPYEAR='#Form.EXPYEAR#'>
    <cfset Session.LICENSEENAMEPOINTSIZE='#Form.LICENSEENAMEPOINTSIZE#'>
    <cfset Session.FULLNAME='#Form.FULLNAME#'>
    <cfset Session.LicenseType='#Form.LicenseType#'>
    <cfset Session.EMPLOYER='#Form.EMPLOYER#'>
    <cfset Session.RESTRICTIONS='#Form.RESTRICTIONS#'>
    <cfset Session.DOB='#Form.DOB#'>
    <cfset Session.FPDATE='#Form.FPDATE#'>
    <cfset Session.RestrictedFromBackside='#Form.RestrictedFromBackside#'>
    <cfset Session.BadgeID=#BadgeID#>
    <cfif IsDefined("Form.SpouseName")>
        <cfset Session.SpouseName="#Form.SpouseName#">
        <cfset Session.SPOUSENAMEPOINTSIZE='#Form.SPOUSENAMEPOINTSIZE#'>
    </cfif>
    <cfoutput>
        <script>
            var rowObject=window.opener.document.getElementById('BadgeCardRow');
            var newCell = rowObject.insertCell(0);
            newCell.align='center';
            newCell.valign='center';
            newCell.innerHTML =
                '<span class="DataLabel" style="text-align: center;">'+
                    '<a class="special" href="/binkleyphotos/BadgeCards/#BadgeCards.filename#" target="_blank">'+
                        '<img src="/binkleyphotos/BadgeCards/#BadgeCards.filename#" border="0" height="100" alt="#BadgeCards.filename#" ><br>'+
                        '#BadgeCards.Year#-#BadgeCards.Track#'+
                    '</a>'+
                '</span>'+
                '<cfif session.trackdatadeletepicsuserlist Contains SESSION.Auth.UserLogin>'+
                    '<a href="tstDeleteBadgeCard.cfm?Photo=#BadgeCards.filename#&id=#BadgeCards.id#&tdLicenseID=#Form.tdLicenseID#">'+
                        ' <img src="../delete.gif" border="0" alt="x" height="8" width="8" name="Delete" title="Delete This Photo">'+
                    '</a>'+
                '</cfif>'+
                '<span class="DataLabel" style="font-size: 10px;">'+
                    '<br />#BadgeCards.id#'+
                    '<cfif Trim(badgeCards.LicenseType) gt "">'+
                        '<br />'+
                        '<cfif Trim(badgeCards.pdfFileName) gt "">'+
                            '<a href="/Binkley/BadgeCard/PDFs/#BadgeCards.pdfFileName#" class="Special" target="_blank">'+
                                '#BadgeCards.LicenseType#-#BadgeCards.BadgeType#'+
                            '</a>'+
                        '<cfelse>'+
                            '#BadgeCards.LicenseType#-#BadgeCards.BadgeType#'+
                        '</cfif>'+
                        '<br />#DateFormat(BadgeCards.LUpDate,"mm/dd/yyyy")#'+
                    '</cfif>'+
                '</span>';
        </script>
    </cfoutput>
    <div style="color: Red; font-family: Calibri; font-weight: bold; font-size: 24px; text-align: center;">
        <br />
        <br />
        Please close this window after printing your badge card
    </div>
</cfif>
<cfswitch expression="#Form.CardFormat#">
    <cfcase value="White">
        <iframe src="WhiteOccupationalLicense.cfm" frameborder="no" height="800" width="800" ></iframe>     <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="Green"> 
        <iframe src="GreenOccupationalLicense.cfm" frameborder="no" height="800" width="800" ></iframe>     <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="Red RP">
        <iframe src="RPGamingBadge.cfm"  frameborder="no" height="800" width="800" ></iframe>                   <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="Red WRD">
        <iframe src="WRDGamingBadge.cfm"  frameborder="no" height="800" width="800" ></iframe>                <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="Red All Tracks">
        <iframe src="AllTracksGamingBadge.cfm"  frameborder="no" height="800" width="800" ></iframe>            <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="Under 16">
        <iframe src="Under16.cfm"  frameborder="no" height="800" width="800" ></iframe>                                     <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="Under 18">
        <iframe src="Under18.cfm"  frameborder="no" height="800" width="800" ></iframe>                                     <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="Green Under 18">
        <iframe src="GreenUnder18.cfm"  frameborder="no" height="800" width="800" ></iframe>                            <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="Spouse">
        <iframe src="SpousePass.cfm"  frameborder="no" height="800" width="800" ></iframe>                              <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="FMT Green">
        <iframe src="FairMeetOnlyGreen.cfm"  frameborder="no" height="800" width="800" ></iframe>                   <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="FMT White">
        <iframe src="FairMeetOnlyWhite.cfm"  frameborder="no" height="800" width="800" ></iframe>                   <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="Blue Staff">
        <iframe src="OHRCStaffBadge.cfm"  frameborder="no" height="800" width="800" ></iframe>                      <!--- onload="top.window.close();" --->
    </cfcase>
    <cfcase value="Law Enforcement Officer">
        <iframe src="LawEnforcementCommission.cfm"  frameborder="no" height="800" width="800" ></iframe>    <!--- onload="top.window.close();" --->
    </cfcase>
    <cfdefaultcase>
        <div style="color: Blue; font-family: Calibri; font-weight: bold; font-size: 24px; text-align: center;">
            <br /> <br />
            You didn't choose a card type<br />
            Please choose a Card Template and try your print job agian
             <br /> <br />
             <div style="color: red; font-family: Calibri; font-weight: bold; font-size: 24px; text-align: center;">
                You may close this window
             </div>
        </div>
    </cfdefaultcase> 
</cfswitch>
</body>
</html>
1

There are 1 best solutions below

2
John Whish On

There is nothing wrong with your ColdFusion code. It gets the QR code just fine.

<cfset qrCodeURL = "https://www.ohrc.org/binkley/badgeCard/PDFs/">
<cfset apiURL = "https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=">
<cfhttp method="get" url="#apiURL##qrCodeURL#" getasbinary="yes">
<cfoutput>
<img
    src="data:#cfhttp.mimetype#;base64,#toBase64( cfhttp.fileContent )#"
    height="150" width="150"
    >
</cfoutput>

if you are simply showing the QR code image on screen then you don't even need to use cfhttp to get the image.

<cfoutput>
<img
    src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=https://www.ohrc.org/binkley/badgeCard/PDFs/#Replace(badgPhotoName, '.jpg', '.pdf', 'All')#"
    height="150" width="150"
    >
</cfoutput>

Runable code: https://cffiddle.org/app/file?filepath=d7e9b6f1-31e6-4256-9410-1b776a724588/43e40a67-d103-4644-a826-f6287cd32acc/39c595f2-e4e5-4f00-a912-acedf37e2706.cfm

You say that "The way that I had it programmed worked for a month or so, but has now stopped." did it really stop working with no code changes at all?

You have posted a lot of code including things which are not relevant (such as database queries) so it is very hard to work out what the problem is, but I suspect it is that you have ColdFusion code in your JavaScript. For example these lines:

'</span>'+
'<cfif session.trackdatadeletepicsuserlist Contains SESSION.Auth.UserLogin>'+
  '<a href="tstDeleteBadgeCard.cfm?Photo=#BadgeCards.filename#&id=#BadgeCards.id#&tdLicenseID=#Form.tdLicenseID#">'+
    ' <img src="../delete.gif" border="0" alt="x" height="8" width="8" name="Delete" title="Delete This Photo">'+
  '</a>'+
'</cfif>'+

ColdFusion code is run and evaluated on the server. HTML is then returned to the browser where the JavaScript code runs. If you view the source of your page you may see what the issue is. The console in your browser may also give you some clues.