This article provides updated scripts for custom PDF generator in report DataPages that do not display correctly in browsers blocking third-party cookies.

Note:

• No action is necessary for DataPages using Caspio’s native PDF report feature.
• Responsive option should be disabled in the DataPage.

Follow the steps below to resolve the issue.

1. Locate the custom PDF generator code in your DataPage. In the link, add an id attribute with pdfLink as its value.

   <a id="pdfLink" href="PDF_GEN_LINK">PDF</a>

   Where PDF_GEN_LINK is:

   https://ACCOUNT_ID.caspio.com/PDFGen.aspx?AppKey=APP_KEY&RenderByUrl=True&PageOrientation=Portrait&PageBreak=TRUE&AvoidTextBreak=TRUE&FileName=Test.pdf&PageSize=Letter&LeftMargin=30&RightMargin=30&TopMargin=30&BottomMargin=0&format=inline&DPParameters=

2. Under the PDF generator link paste the following script:
   

   <script>
   document.addEventListener('DataPageReady', function (event) {
   	if (event.detail.appKey == 'APP_KEY') {
   		var v_cookieRequest = new XMLHttpRequest();
   		var v_cookieRequestData = new FormData();
   		v_cookieRequestData.append('AjaxActionHostName', window.location.protocol + '//' + window.location.hostname + (window.location.port !== '' ? ':' + window.location.port : ''));
   		v_cookieRequestData.append('cbAjaxReferrer', window.location.toString());
   		v_cookieRequest.withCredentials = true;
   		v_cookieRequest.open('POST', 'https://ACCOUNT_ID.caspio.com/dp/checkcookieaccepted');
   		v_cookieRequest.onreadystatechange = function () {
   			if (this.readyState === 4 && this.status === 200) {
   				var v_result = JSON.parse(v_cookieRequest.responseText);
   				if (!v_result.status) {
   					var v_link = document.getElementById('pdfLink');
   					var v_pdfUrl = v_link.href;
   					v_link.href = 'javascript:void(0)';
   					v_link.onclick = function () {
   						var v_pdfRequest = new XMLHttpRequest();
   						v_pdfRequest.responseType = 'blob';
   						var v_pdfRequestData = new FormData();
   						v_pdfRequestData.append('AjaxActionHostName', window.location.protocol + '//' + window.location.hostname + (window.location.port !== '' ? ':' + window.location.port : ''));
   						v_pdfRequestData.append('cbAjaxReferrer', window.location.toString());
   						v_pdfRequest.open('GET', v_pdfUrl);
   						var v_dpFolderKey = window.dataPageManagerObj.getDpFolderKey();
   						if (v_dpFolderKey) {
   							v_pdfRequest.setRequestHeader('Authorization', 'Bearer ' + v_dpFolderKey);
   						}
   						v_pdfRequest.onreadystatechange = function () {
   							if (this.readyState === 4 && this.status === 200) {
   								var v_URL = window.URL || window.webkitURL;
   								var v_downloadUrl = v_URL.createObjectURL(v_pdfRequest.response);
   								
   								window.location = v_downloadUrl;
   								setTimeout(function () { v_URL.revokeObjectURL(v_downloadUrl); }, 100);
   							}
   						}
   						v_pdfRequest.send(v_pdfRequestData.valueOf());
   					}
   				}
   			}
   		}
   		v_cookieRequest.send(v_cookieRequestData.valueOf());
   	}
   });
   </script>
   

3. In the script:
   • Replace APP_KEY with the AppKey of the DataPage.
   • Replace ACCOUNT_ID.caspio.com with your Integration URL.
4. Test your DataPage.