Merge pull request #245 from PerimeterX/release/v3.4.1

oren-yaar-px · web-flow · commit e19d41d1392f · 2022-05-18T15:37:11.000+03:00
SDKNEW-1881 Release/v3.4.1
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
+## [3.4.1] - 2022-05-18
+
+### Added
+
+- Update block page to support error handling for mobile.
 
 ## [3.4.0] - 2022-05-1
 
diff --git a/README.md b/README.md
@@ -6,7 +6,7 @@
 [PerimeterX](http://www.perimeterx.com) Shared base for NodeJS enforcers
 =============================================================
 
-> Latest stable version: [v3.4.0](https://www.npmjs.com/package/perimeterx-node-core)
+> Latest stable version: [v3.4.1](https://www.npmjs.com/package/perimeterx-node-core)
 
 This is a shared base implementation for PerimeterX Express enforcer and future NodeJS enforcers. For a fully functioning implementation example, see the [Node-Express enforcer](https://github.com/PerimeterX/perimeterx-node-express/) implementation.
 
diff --git a/lib/pxenforcer.js b/lib/pxenforcer.js
@@ -550,6 +550,7 @@ class PxEnforcer {
             hostUrl: hostUrl,
             jsClientSrc: jsClientSrc,
             firstPartyEnabled: this._config.FIRST_PARTY_ENABLED,
+            isMobile: ctx.isMobile(),
             blockScript: captchaSrc,
             altBlockScript: `${this._config.BACKUP_CAPTCHA_HOST}/${this._config.PX_APP_ID}${captchaParams}`
         };
diff --git a/lib/templates/block_template.mustache b/lib/templates/block_template.mustache
@@ -11,34 +11,43 @@
 </head>
 <body>
 <script>
-        window._pxVid = '{{vid}}';
-        window._pxUuid = '{{uuid}}';
-        window._pxAppId = '{{appId}}';
-        window._pxHostUrl = '{{{hostUrl}}}';
-        window._pxCustomLogo = '{{{customLogo}}}';
-        window._pxJsClientSrc = '{{{jsClientSrc}}}';
-        window._pxFirstPartyEnabled = {{firstPartyEnabled}};
-        var script = document.createElement('script');
-        script.src = '{{{blockScript}}}';
+    /* PerimeterX assignments */
+    window._pxVid = '{{vid}}';
+    window._pxUuid = '{{uuid}}';
+    window._pxAppId = '{{appId}}';
+    window._pxMobile = {{isMobile}};
+    window._pxHostUrl = '{{{hostUrl}}}';
+    window._pxCustomLogo = '{{{customLogo}}}';
+    window._pxJsClientSrc = '{{{jsClientSrc}}}';
+    window._pxFirstPartyEnabled = {{firstPartyEnabled}};
+    var pxCaptchaSrc = '{{{blockScript}}}';
+
+    var script = document.createElement('script');
+    script.src = pxCaptchaSrc;
+    script.onerror = function () {
+        script = document.createElement('script');
+        script.src = '{{altBlockScript}}';
+        script.onerror = window._pxOnError;
         document.head.appendChild(script);
-        script.onerror = function () {
-            script = document.createElement('script');
-            script.src = '{{{altBlockScript}}}';
-            script.onerror = window._pxDisplayErrorMessage;
-            document.head.appendChild(script);
-        };
-        window._pxDisplayErrorMessage = function () {
-            var style = document.createElement('style');
-            style.innerText = '@import url(https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap);body{background-color:#fafbfc}.px-captcha-error-container{position:fixed;height:340px;background-color:#fff;font-family:Roboto,sans-serif}.px-captcha-error-header{color:#f0f1f2;font-size:29px;margin:67px 0 33px;font-weight:500;line-height:.83;text-align:center}.px-captcha-error-message{color:#f0f1f2;font-size:18px;margin:0 0 29px;line-height:1.33;text-align:center}.px-captcha-error-button{text-align:center;line-height:48px;width:253px;margin:auto;border-radius:50px;border:solid 1px #f0f1f2;font-size:20px;color:#f0f1f2}.px-captcha-error-wrapper{margin:18px 0 0}div.px-captcha-error{margin:auto;text-align:center;width:400px;height:30px;font-size:12px;background-color:#fcf0f2;color:#ce0e2d}img.px-captcha-error{margin:6px 8px -2px 0}.px-captcha-error-refid{border-top:solid 1px #f0eeee;height:27px;margin:13px 0 0;border-radius:0 0 3px 3px;background-color:#fafbfc;font-size:10px;line-height:2.5;text-align:center;color:#b1b5b8}@media (min-width:620px){.px-captcha-error-container{width:530px;top:50%;left:50%;margin-top:-170px;margin-left:-265px;border-radius:3px;box-shadow:0 2px 9px -1px rgba(0,0,0,.13)}}@media (min-width:481px) and (max-width:620px){.px-captcha-error-container{width:85%;top:50%;left:50%;margin-top:-170px;margin-left:-42.5%;border-radius:3px;box-shadow:0 2px 9px -1px rgba(0,0,0,.13)}}@media (max-width:480px){body{background-color:#fff}.px-captcha-error-header{color:#f0f1f2;font-size:29px;margin:55px 0 33px}.px-captcha-error-container{width:530px;top:50%;left:50%;margin-top:-170px;margin-left:-265px}.px-captcha-error-refid{position:fixed;width:100%;left:0;bottom:0;border-radius:0;font-size:14px;line-height:2}}@media (max-width:390px){div.px-captcha-error{font-size:10px}.px-captcha-error-refid{font-size:11px;line-height:2.5}}';
-            document.head.appendChild(style);
-            var div = document.createElement('div');
-            div.className = 'px-captcha-error-container';
-            div.innerHTML = '<div class="px-captcha-error-header">Before we continue...</div><div class="px-captcha-error-message">Press & Hold to confirm you are<br>a human (and not a bot).</div><div class="px-captcha-error-button">Press & Hold</div><div class="px-captcha-error-wrapper"><div class="px-captcha-error"><img class="px-captcha-error" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAQCAMAAADDGrRQAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABFUExURUdwTNYELOEGONQILd0AONwALtwEL+AAL9MFLfkJSNQGLdMJLdQJLdQGLdQKLtYFLNcELdUGLdcBL9gFL88OLdUFLNEOLglBhT4AAAAXdFJOUwC8CqgNIRgRoAS1dWWuR4RTjzgryZpYblfkcAAAAI9JREFUGNNdj+sWhCAIhAdvqGVa1r7/oy6RZ7eaH3D4ZACBIed9wlOOMtUnSrEmZ6cHa9YAIfsbCkWrdpi/c50Bk2CO9mNLdMAu03wJA3HpEnfpxbyOg6ruyx8JJi6KNstnslp1dbPd9GnqmuYq7mmcv1zjnbQw8cV0xzkqo+fX1zkjUOO7wnrInUTxJiruC3vtBNRoQQn2AAAAAElFTkSuQmCC">Please check your internet connection or disable your ad-blocker.</div></div><div class="px-captcha-error-refid">Reference ID ' + window._pxUuid + '</div>';
-            document.body.appendChild(div);
-        };
-    </script>
+    };
+    window._pxOnError = function () {
+        var style = document.createElement('style');
+        style.innerText = '@import url(https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap);body{background-color:#fafbfc}.px-captcha-error-container{position:fixed;height:340px;background-color:#fff;font-family:Roboto,sans-serif}.px-captcha-error-header{color:#f0f1f2;font-size:29px;margin:67px 0 33px;font-weight:500;line-height:.83;text-align:center}.px-captcha-error-message{color:#f0f1f2;font-size:18px;margin:0 0 29px;line-height:1.33;text-align:center}.px-captcha-error-button{text-align:center;line-height:48px;width:253px;margin:auto;border-radius:50px;border:solid 1px #f0f1f2;font-size:20px;color:#f0f1f2}.px-captcha-error-wrapper{margin:18px 0 0}div.px-captcha-error{margin:auto;text-align:center;width:400px;height:30px;font-size:12px;background-color:#fcf0f2;color:#ce0e2d}img.px-captcha-error{margin:6px 8px -2px 0}.px-captcha-error-refid{border-top:solid 1px #f0eeee;height:27px;margin:13px 0 0;border-radius:0 0 3px 3px;background-color:#fafbfc;font-size:10px;line-height:2.5;text-align:center;color:#b1b5b8}@media (min-width:620px){.px-captcha-error-container{width:530px;top:50%;left:50%;margin-top:-170px;margin-left:-265px;border-radius:3px;box-shadow:0 2px 9px -1px rgba(0,0,0,.13)}}@media (min-width:481px) and (max-width:620px){.px-captcha-error-container{width:85%;top:50%;left:50%;margin-top:-170px;margin-left:-42.5%;border-radius:3px;box-shadow:0 2px 9px -1px rgba(0,0,0,.13)}}@media (max-width:480px){body{background-color:#fff}.px-captcha-error-header{color:#f0f1f2;font-size:29px;margin:55px 0 33px}.px-captcha-error-container{width:530px;top:50%;left:50%;margin-top:-170px;margin-left:-265px}.px-captcha-error-refid{position:fixed;width:100%;left:0;bottom:0;border-radius:0;font-size:14px;line-height:2}}@media (max-width:390px){div.px-captcha-error{font-size:10px}.px-captcha-error-refid{font-size:11px;line-height:2.5}}';
+        document.head.appendChild(style);
+        var div = document.createElement('div');
+        div.className = 'px-captcha-error-container';
+        div.innerHTML = '<div class="px-captcha-error-header">Before we continue...</div><div class="px-captcha-error-message">Press & Hold to confirm you are<br>a human (and not a bot).</div><div class="px-captcha-error-button">Press & Hold</div><div class="px-captcha-error-wrapper"><div class="px-captcha-error"><img class="px-captcha-error" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAQCAMAAADDGrRQAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABFUExURUdwTNYELOEGONQILd0AONwALtwEL+AAL9MFLfkJSNQGLdMJLdQJLdQGLdQKLtYFLNcELdUGLdcBL9gFL88OLdUFLNEOLglBhT4AAAAXdFJOUwC8CqgNIRgRoAS1dWWuR4RTjzgryZpYblfkcAAAAI9JREFUGNNdj+sWhCAIhAdvqGVa1r7/oy6RZ7eaH3D4ZACBIed9wlOOMtUnSrEmZ6cHa9YAIfsbCkWrdpi/c50Bk2CO9mNLdMAu03wJA3HpEnfpxbyOg6ruyx8JJi6KNstnslp1dbPd9GnqmuYq7mmcv1zjnbQw8cV0xzkqo+fX1zkjUOO7wnrInUTxJiruC3vtBNRoQQn2AAAAAElFTkSuQmCC">Please check your internet connection' + (window._pxMobile ? '' : ' or disable your ad-blocker') + '.</div></div><div class="px-captcha-error-refid">Reference ID ' + window._pxUuid + '</div>';
+        document.body.appendChild(div);
+        if (window._pxMobile) {
+            setTimeout(function() {
+                location.href = '/px/captcha_close?status=-1';
+            }, 5000);
+        }
+    };
+    document.head.appendChild(script);
+</script>
 {{#jsRef}}
     <script src="{{{jsRef}}}"></script>
 {{/jsRef}}
 </body>
-</html>
+</html>
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "perimeterx-node-core",
-    "version": "3.4.0",
+    "version": "3.4.1",
     "description": "PerimeterX NodeJS shared core for various applications to monitor and block traffic according to PerimeterX risk score",
     "main": "index.js",
     "scripts": {

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "perimeterx-node-core",`
`3`		`- "version": "3.4.0",`
	`3`	`+ "version": "3.4.1",`
`4`	`4`	`"description": "PerimeterX NodeJS shared core for various applications to monitor and block traffic according to PerimeterX risk score",`
`5`	`5`	`"main": "index.js",`
`6`	`6`	`"scripts": {`