Cache SLAS callback using request processor (#884)

* cache callback in request processor

* fix import path

* cache callback for a year

* use native URLSearchParams

* revert use native URLSearchParams

packages/template-retail-react-app/app/request-processor.js

@@ -10,7 +10,7 @@
 // it processes requests in whatever way your project requires.
 
 // Uncomment the following line for the example code to work.
-// import {QueryParameters} from 'pwa-kit-react-sdk/utils/ssr-request-processing'
+import {QueryParameters} from 'pwa-kit-runtime/utils/ssr-request-processing'
 
 /**
  * The processRequest function is called for *every* non-proxy, non-bundle
@@ -62,25 +62,29 @@ export const processRequest = ({
     path,
     querystring
 }) => {
-    // Uncomment the snippet below for the example code to work.
-    /***************************************************************************
-    // Example code for filtering query parameters and detecting bots user.
-
-    console.assert(parameters, 'Missing parameters')
-
     // This is an EXAMPLE processRequest implementation. You should
     // replace it with code that processes your requests as needed.
 
     // This example code will remove any of the parameters whose keys appear
     // in the 'exclusions' array.
     const exclusions = [
-        'gclid',
-        'utm_campaign',
-        'utm_content',
-        'utm_medium',
-        'utm_source'
+        // 'gclid',
+        // 'utm_campaign',
+        // 'utm_content',
+        // 'utm_medium',
+        // 'utm_source'
     ]
 
+    // This is a performance optimization for SLAS.
+    // On client side, browser always follow the redirect
+    // to /callback but the response is always the same.
+    // We strip out the unique query parameters so this
+    // endpoint is cached at the CDN level
+    if (path === '/callback') {
+        exclusions.push('usid')
+        exclusions.push('code')
+    }
+
     // Build a first QueryParameters object from the given querystring
     const incomingParameters = new QueryParameters(querystring)
 
@@ -96,6 +100,7 @@ export const processRequest = ({
     // Re-generate the querystring
     querystring = filteredParameters.toString()
 
+    /***************************************************************************
     // This example code will detect bots by examining the user-agent,
     // and will set the request class to 'bot' for all such requests.
     const ua = headers.getHeader('user-agent')

packages/template-retail-react-app/app/request-processor.test.js

@@ -13,4 +13,11 @@ describe('processRequest', () => {
         expect(result.path).toEqual(expect.any(String))
         expect(result.querystring).toEqual(expect.any(String))
     })
+
+    test('SLAS callback parameters are removed', () => {
+        const result = processRequest({path: '/callback', querystring: 'usid=1&code=2&test=3'})
+
+        expect(result.path).toEqual('/callback')
+        expect(result.querystring).toEqual('test=3')
+    })
 })

packages/template-retail-react-app/app/ssr.js

@@ -53,6 +53,9 @@ const {handler} = runtime.createHandler(options, (app) => {
 
     // Handle the redirect from SLAS as to avoid error
     app.get('/callback?*', (req, res) => {
+        // This endpoint does nothing and is not expected to change
+        // Thus we cache it for a year to maximize performance
+        res.set('Cache-Control', `max-age=31536000`)
         res.send()
     })
     app.get('/robots.txt', runtime.serveStaticFile('static/robots.txt'))