@sitecore-jss/sitecore-jss-nextjs 22.1.0-canary.37 → 22.1.0-canary.39

package/dist/cjs/editing/constants.js

@@ -1,9 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.EDITING_ALLOWED_ORIGINS = exports.QUERY_PARAM_PROTECTION_BYPASS_VERCEL = exports.QUERY_PARAM_PROTECTION_BYPASS_SITECORE = exports.QUERY_PARAM_EDITING_SECRET = void 0;
+exports.EDITING_ALLOWED_ORIGINS = exports.EDITING_PASS_THROUGH_HEADERS = exports.QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE = exports.QUERY_PARAM_VERCEL_PROTECTION_BYPASS = exports.QUERY_PARAM_EDITING_SECRET = void 0;
 exports.QUERY_PARAM_EDITING_SECRET = 'secret';
-exports.QUERY_PARAM_PROTECTION_BYPASS_SITECORE = 'x-sitecore-protection-bypass';
-exports.QUERY_PARAM_PROTECTION_BYPASS_VERCEL = 'x-vercel-protection-bypass';
+exports.QUERY_PARAM_VERCEL_PROTECTION_BYPASS = 'x-vercel-protection-bypass';
+exports.QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE = 'x-vercel-set-bypass-cookie';
+/**
+ * Headers that should be passed along to (Editing Chromes handler) SSR request.
+ * Note these are in lowercase format to match expected `IncomingHttpHeaders`.
+ */
+exports.EDITING_PASS_THROUGH_HEADERS = ['authorization', 'cookie'];
 /**
  * Default allowed origins for editing requests. This is used to enforce CORS, CSP headers.
  */

package/dist/cjs/editing/editing-render-middleware.js

@@ -57,7 +57,7 @@ class ChromesHandler extends render_middleware_1.RenderMiddlewareBase {
     }
     render(req, res) {
         return __awaiter(this, void 0, void 0, function* () {
-            const { query } = req;
+            const { query, headers: incomingHeaders } = req;
             const startTimestamp = Date.now();
             try {
                 // Extract data from EE payload
@@ -66,6 +66,8 @@ class ChromesHandler extends render_middleware_1.RenderMiddlewareBase {
                 const serverUrl = this.resolveServerUrl(req);
                 // Get query string parameters to propagate on subsequent requests (e.g. for deployment protection bypass)
                 const params = this.getQueryParamsForPropagation(query);
+                // Get headers to propagate on subsequent requests
+                const headers = this.getHeadersForPropagation(incomingHeaders);
                 // Stash for use later on (i.e. within getStatic/ServerSideProps).
                 // Note we can't set this directly in setPreviewData since it's stored as a cookie (2KB limit)
                 // https://nextjs.org/docs/advanced-features/preview-mode#previewdata-size-limits)
@@ -74,6 +76,7 @@ class ChromesHandler extends render_middleware_1.RenderMiddlewareBase {
                 res.setPreviewData(previewData);
                 // Grab the Next.js preview cookies to send on to the render request
                 const cookies = res.getHeader('Set-Cookie');
+                headers.cookie = `${headers.cookie ? headers.cookie + ';' : ''}${cookies.join(';')}`;
                 // Make actual render request for page route, passing on preview cookies as well as any approved query string parameters.
                 // Note timestamp effectively disables caching the request in Axios (no amount of cache headers seemed to do it)
                 sitecore_jss_1.debug.editing('fetching page route for %s', editingData.path);
@@ -86,9 +89,7 @@ class ChromesHandler extends render_middleware_1.RenderMiddlewareBase {
                 requestUrl.searchParams.append('timestamp', Date.now().toString());
                 const pageRes = yield this.dataFetcher
                     .get(requestUrl.toString(), {
-                    headers: {
-                        Cookie: cookies.join(';'),
-                    },
+                    headers,
                 })
                     .catch((err) => {
                     // We need to handle not found error provided by Vercel

package/dist/cjs/editing/render-middleware.js

@@ -14,14 +14,28 @@ class RenderMiddlewareBase {
          */
         this.getQueryParamsForPropagation = (query) => {
             const params = {};
-            if (query[constants_1.QUERY_PARAM_PROTECTION_BYPASS_SITECORE]) {
-                params[constants_1.QUERY_PARAM_PROTECTION_BYPASS_SITECORE] = query[constants_1.QUERY_PARAM_PROTECTION_BYPASS_SITECORE];
+            if (query[constants_1.QUERY_PARAM_VERCEL_PROTECTION_BYPASS]) {
+                params[constants_1.QUERY_PARAM_VERCEL_PROTECTION_BYPASS] = query[constants_1.QUERY_PARAM_VERCEL_PROTECTION_BYPASS];
             }
-            if (query[constants_1.QUERY_PARAM_PROTECTION_BYPASS_VERCEL]) {
-                params[constants_1.QUERY_PARAM_PROTECTION_BYPASS_VERCEL] = query[constants_1.QUERY_PARAM_PROTECTION_BYPASS_VERCEL];
+            if (query[constants_1.QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE]) {
+                params[constants_1.QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE] = query[constants_1.QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE];
             }
             return params;
         };
+        /**
+         * Get headers that should be passed along to subsequent requests
+         * @param {IncomingHttpHeaders} headers Incoming HTTP Headers
+         * @returns Object of approved headers
+         */
+        this.getHeadersForPropagation = (headers) => {
+            const result = {};
+            constants_1.EDITING_PASS_THROUGH_HEADERS.forEach((header) => {
+                if (headers[header]) {
+                    result[header] = headers[header];
+                }
+            });
+            return result;
+        };
     }
 }
 exports.RenderMiddlewareBase = RenderMiddlewareBase;

package/dist/esm/editing/constants.js

@@ -1,6 +1,11 @@
 export const QUERY_PARAM_EDITING_SECRET = 'secret';
-export const QUERY_PARAM_PROTECTION_BYPASS_SITECORE = 'x-sitecore-protection-bypass';
-export const QUERY_PARAM_PROTECTION_BYPASS_VERCEL = 'x-vercel-protection-bypass';
+export const QUERY_PARAM_VERCEL_PROTECTION_BYPASS = 'x-vercel-protection-bypass';
+export const QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE = 'x-vercel-set-bypass-cookie';
+/**
+ * Headers that should be passed along to (Editing Chromes handler) SSR request.
+ * Note these are in lowercase format to match expected `IncomingHttpHeaders`.
+ */
+export const EDITING_PASS_THROUGH_HEADERS = ['authorization', 'cookie'];
 /**
  * Default allowed origins for editing requests. This is used to enforce CORS, CSP headers.
  */

package/dist/esm/editing/editing-render-middleware.js

@@ -54,7 +54,7 @@ export class ChromesHandler extends RenderMiddlewareBase {
     }
     render(req, res) {
         return __awaiter(this, void 0, void 0, function* () {
-            const { query } = req;
+            const { query, headers: incomingHeaders } = req;
             const startTimestamp = Date.now();
             try {
                 // Extract data from EE payload
@@ -63,6 +63,8 @@ export class ChromesHandler extends RenderMiddlewareBase {
                 const serverUrl = this.resolveServerUrl(req);
                 // Get query string parameters to propagate on subsequent requests (e.g. for deployment protection bypass)
                 const params = this.getQueryParamsForPropagation(query);
+                // Get headers to propagate on subsequent requests
+                const headers = this.getHeadersForPropagation(incomingHeaders);
                 // Stash for use later on (i.e. within getStatic/ServerSideProps).
                 // Note we can't set this directly in setPreviewData since it's stored as a cookie (2KB limit)
                 // https://nextjs.org/docs/advanced-features/preview-mode#previewdata-size-limits)
@@ -71,6 +73,7 @@ export class ChromesHandler extends RenderMiddlewareBase {
                 res.setPreviewData(previewData);
                 // Grab the Next.js preview cookies to send on to the render request
                 const cookies = res.getHeader('Set-Cookie');
+                headers.cookie = `${headers.cookie ? headers.cookie + ';' : ''}${cookies.join(';')}`;
                 // Make actual render request for page route, passing on preview cookies as well as any approved query string parameters.
                 // Note timestamp effectively disables caching the request in Axios (no amount of cache headers seemed to do it)
                 debug.editing('fetching page route for %s', editingData.path);
@@ -83,9 +86,7 @@ export class ChromesHandler extends RenderMiddlewareBase {
                 requestUrl.searchParams.append('timestamp', Date.now().toString());
                 const pageRes = yield this.dataFetcher
                     .get(requestUrl.toString(), {
-                    headers: {
-                        Cookie: cookies.join(';'),
-                    },
+                    headers,
                 })
                     .catch((err) => {
                     // We need to handle not found error provided by Vercel

package/dist/esm/editing/render-middleware.js

@@ -1,4 +1,4 @@
-import { QUERY_PARAM_PROTECTION_BYPASS_SITECORE, QUERY_PARAM_PROTECTION_BYPASS_VERCEL, } from './constants';
+import { QUERY_PARAM_VERCEL_PROTECTION_BYPASS, QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE, EDITING_PASS_THROUGH_HEADERS, } from './constants';
 /**
  * Base class for middleware that handles pages and components rendering in Sitecore Editors.
  */
@@ -11,13 +11,27 @@ export class RenderMiddlewareBase {
          */
         this.getQueryParamsForPropagation = (query) => {
             const params = {};
-            if (query[QUERY_PARAM_PROTECTION_BYPASS_SITECORE]) {
-                params[QUERY_PARAM_PROTECTION_BYPASS_SITECORE] = query[QUERY_PARAM_PROTECTION_BYPASS_SITECORE];
+            if (query[QUERY_PARAM_VERCEL_PROTECTION_BYPASS]) {
+                params[QUERY_PARAM_VERCEL_PROTECTION_BYPASS] = query[QUERY_PARAM_VERCEL_PROTECTION_BYPASS];
             }
-            if (query[QUERY_PARAM_PROTECTION_BYPASS_VERCEL]) {
-                params[QUERY_PARAM_PROTECTION_BYPASS_VERCEL] = query[QUERY_PARAM_PROTECTION_BYPASS_VERCEL];
+            if (query[QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE]) {
+                params[QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE] = query[QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE];
             }
             return params;
         };
+        /**
+         * Get headers that should be passed along to subsequent requests
+         * @param {IncomingHttpHeaders} headers Incoming HTTP Headers
+         * @returns Object of approved headers
+         */
+        this.getHeadersForPropagation = (headers) => {
+            const result = {};
+            EDITING_PASS_THROUGH_HEADERS.forEach((header) => {
+                if (headers[header]) {
+                    result[header] = headers[header];
+                }
+            });
+            return result;
+        };
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sitecore-jss/sitecore-jss-nextjs",
-  "version": "22.1.0-canary.37",
+  "version": "22.1.0-canary.39",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "sideEffects": false,
@@ -72,9 +72,9 @@
     "react-dom": "^18.2.0"
   },
   "dependencies": {
-    "@sitecore-jss/sitecore-jss": "^22.1.0-canary.37",
-    "@sitecore-jss/sitecore-jss-dev-tools": "^22.1.0-canary.37",
-    "@sitecore-jss/sitecore-jss-react": "^22.1.0-canary.37",
+    "@sitecore-jss/sitecore-jss": "^22.1.0-canary.39",
+    "@sitecore-jss/sitecore-jss-dev-tools": "^22.1.0-canary.39",
+    "@sitecore-jss/sitecore-jss-react": "^22.1.0-canary.39",
     "@vercel/kv": "^0.2.1",
     "prop-types": "^15.8.1",
     "regex-parser": "^2.2.11",
@@ -82,7 +82,7 @@
   },
   "description": "",
   "types": "types/index.d.ts",
-  "gitHead": "596b64348c701c79e40a71de711fc6d7feafc854",
+  "gitHead": "4a047aa201182c8a0b678f949f8fb9f72c6a7783",
   "files": [
     "dist",
     "types",

package/types/editing/constants.d.ts

@@ -1,6 +1,11 @@
 export declare const QUERY_PARAM_EDITING_SECRET = "secret";
-export declare const QUERY_PARAM_PROTECTION_BYPASS_SITECORE = "x-sitecore-protection-bypass";
-export declare const QUERY_PARAM_PROTECTION_BYPASS_VERCEL = "x-vercel-protection-bypass";
+export declare const QUERY_PARAM_VERCEL_PROTECTION_BYPASS = "x-vercel-protection-bypass";
+export declare const QUERY_PARAM_VERCEL_SET_BYPASS_COOKIE = "x-vercel-set-bypass-cookie";
+/**
+ * Headers that should be passed along to (Editing Chromes handler) SSR request.
+ * Note these are in lowercase format to match expected `IncomingHttpHeaders`.
+ */
+export declare const EDITING_PASS_THROUGH_HEADERS: string[];
 /**
  * Default allowed origins for editing requests. This is used to enforce CORS, CSP headers.
  */

package/types/editing/render-middleware.d.ts

@@ -1,3 +1,4 @@
+import { IncomingHttpHeaders } from 'http';
 /**
  * Base class for middleware that handles pages and components rendering in Sitecore Editors.
  */
@@ -12,4 +13,12 @@ export declare abstract class RenderMiddlewareBase {
     }>) => {
         [key: string]: string;
     };
+    /**
+     * Get headers that should be passed along to subsequent requests
+     * @param {IncomingHttpHeaders} headers Incoming HTTP Headers
+     * @returns Object of approved headers
+     */
+    protected getHeadersForPropagation: (headers: IncomingHttpHeaders) => {
+        [key: string]: string | string[];
+    };
 }