@sitecore-content-sdk/nextjs 0.1.0-beta.1

package/dist/cjs/middleware/index.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MultisiteMiddleware = exports.PersonalizeMiddleware = exports.RedirectsMiddleware = exports.MiddlewareBase = exports.debug = void 0;
+var core_1 = require("@sitecore-content-sdk/core");
+Object.defineProperty(exports, "debug", { enumerable: true, get: function () { return core_1.debug; } });
+var middleware_1 = require("./middleware");
+Object.defineProperty(exports, "MiddlewareBase", { enumerable: true, get: function () { return middleware_1.MiddlewareBase; } });
+var redirects_middleware_1 = require("./redirects-middleware");
+Object.defineProperty(exports, "RedirectsMiddleware", { enumerable: true, get: function () { return redirects_middleware_1.RedirectsMiddleware; } });
+var personalize_middleware_1 = require("./personalize-middleware");
+Object.defineProperty(exports, "PersonalizeMiddleware", { enumerable: true, get: function () { return personalize_middleware_1.PersonalizeMiddleware; } });
+var multisite_middleware_1 = require("./multisite-middleware");
+Object.defineProperty(exports, "MultisiteMiddleware", { enumerable: true, get: function () { return multisite_middleware_1.MultisiteMiddleware; } });

package/dist/cjs/middleware/middleware.js

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MiddlewareBase = void 0;
+const server_1 = require("next/server");
+class MiddlewareBase {
+    constructor(config) {
+        this.config = config;
+        this.SITE_SYMBOL = 'sc_site';
+        this.REWRITE_HEADER_NAME = 'x-sc-rewrite';
+        this.defaultHostname = config.defaultHostname || 'localhost';
+    }
+    /**
+     * Determines if mode is preview
+     * @param {NextRequest} req request
+     * @returns {boolean} is preview
+     */
+    isPreview(req) {
+        var _a, _b;
+        return !!(((_a = req.cookies.get('__prerender_bypass')) === null || _a === void 0 ? void 0 : _a.value) || ((_b = req.cookies.get('__next_preview_data')) === null || _b === void 0 ? void 0 : _b.value));
+    }
+    /**
+     * Determines if the request is a Next.js (next/link) prefetch request
+     * @param {NextRequest} req request
+     * @returns {boolean} is prefetch
+     */
+    isPrefetch(req) {
+        return (
+        // eslint-disable-next-line prettier/prettier
+        req.headers.get('purpose') === 'prefetch' || req.headers.get('Next-Router-Prefetch') === '1' // Pages Router // App Router
+        );
+    }
+    excludeRoute(pathname) {
+        var _a, _b;
+        return (pathname.startsWith('/api/') || // Ignore Next.js API calls
+            pathname.startsWith('/sitecore/') || // Ignore Sitecore API calls
+            pathname.startsWith('/_next') || // Ignore next service calls
+            (((_a = this.config) === null || _a === void 0 ? void 0 : _a.excludeRoute) && ((_b = this.config) === null || _b === void 0 ? void 0 : _b.excludeRoute(pathname))));
+    }
+    /**
+     * Safely extract all headers for debug logging
+     * Necessary to avoid middleware issue https://github.com/vercel/next.js/issues/39765
+     * @param {Headers} incomingHeaders Incoming headers
+     * @returns Object with headers as key/value pairs
+     */
+    extractDebugHeaders(incomingHeaders) {
+        const headers = {};
+        incomingHeaders.forEach((value, key) => (headers[key] = value));
+        return headers;
+    }
+    /**
+     * Provides used language
+     * @param {NextRequest} req request
+     * @returns {string} language
+     */
+    getLanguage(req) {
+        return req.nextUrl.locale || req.nextUrl.defaultLocale || 'en';
+    }
+    /**
+     * Extract 'host' header
+     * @param {NextRequest} req request
+     */
+    getHostHeader(req) {
+        var _a;
+        return (_a = req.headers.get('host')) === null || _a === void 0 ? void 0 : _a.split(':')[0];
+    }
+    /**
+     * Get site information.
+     * Can not be used in **Preview** mode, since site will not be resolved
+     * @param {NextRequest} req request
+     * @param {NextResponse} [res] response
+     * @returns {SiteInfo} site information
+     */
+    getSite(req, res) {
+        var _a;
+        const siteNameCookie = (_a = res === null || res === void 0 ? void 0 : res.cookies.get(this.SITE_SYMBOL)) === null || _a === void 0 ? void 0 : _a.value;
+        if (siteNameCookie)
+            return this.config.siteResolver.getByName(siteNameCookie);
+        const hostname = this.getHostHeader(req) || this.defaultHostname;
+        return this.config.siteResolver.getByHost(hostname);
+    }
+    /**
+     * Create a rewrite response
+     * @param {string} rewritePath the destionation path
+     * @param {NextRequest} req the current request
+     * @param {NextResponse} res the current response
+     */
+    rewrite(rewritePath, req, res) {
+        // Note an absolute URL is required: https://nextjs.org/docs/messages/middleware-relative-urls
+        const rewriteUrl = req.nextUrl.clone();
+        rewriteUrl.pathname = rewritePath;
+        const response = server_1.NextResponse.rewrite(rewriteUrl, res);
+        // Share rewrite path with following executed middlewares
+        response.headers.set(this.REWRITE_HEADER_NAME, rewritePath);
+        return response;
+    }
+}
+exports.MiddlewareBase = MiddlewareBase;

package/dist/cjs/middleware/multisite-middleware.js

@@ -0,0 +1,93 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MultisiteMiddleware = void 0;
+const server_1 = require("next/server");
+const site_1 = require("@sitecore-content-sdk/core/site");
+const core_1 = require("@sitecore-content-sdk/core");
+const middleware_1 = require("./middleware");
+/**
+ * Middleware / handler for multisite support
+ */
+class MultisiteMiddleware extends middleware_1.MiddlewareBase {
+    /**
+     * @param {MultisiteMiddlewareConfig} [config] Multisite middleware config
+     */
+    constructor(config) {
+        super(config);
+        this.config = config;
+        this.handler = (req, res) => __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            const pathname = req.nextUrl.pathname;
+            const language = this.getLanguage(req);
+            const hostname = this.getHostHeader(req) || this.defaultHostname;
+            const startTimestamp = Date.now();
+            core_1.debug.multisite('multisite middleware start: %o', {
+                pathname,
+                language,
+                hostname,
+            });
+            // Response will be provided if other middleware is run before us
+            let response = res || server_1.NextResponse.next();
+            if (this.isPreview(req) || this.excludeRoute(pathname)) {
+                core_1.debug.multisite('skipped (%s)', this.isPreview(req) ? 'preview' : 'route excluded');
+                return response;
+            }
+            // Site name can be forced by query string parameter or cookie
+            const siteName = req.nextUrl.searchParams.get(this.SITE_SYMBOL) ||
+                (this.config.useCookieResolution &&
+                    this.config.useCookieResolution(req) &&
+                    ((_a = req.cookies.get(this.SITE_SYMBOL)) === null || _a === void 0 ? void 0 : _a.value)) ||
+                this.config.siteResolver.getByHost(hostname).name;
+            // Rewrite to site specific path
+            const rewritePath = (0, site_1.getSiteRewrite)(pathname, {
+                siteName,
+            });
+            response = this.rewrite(rewritePath, req, response);
+            // default site cookie attributes
+            const defaultCookieAttributes = {
+                secure: true,
+                httpOnly: true,
+                sameSite: 'none',
+            };
+            // Share site name with the following executed middlewares
+            response.cookies.set(this.SITE_SYMBOL, siteName, defaultCookieAttributes);
+            core_1.debug.multisite('multisite middleware end in %dms: %o', Date.now() - startTimestamp, {
+                rewritePath,
+                siteName,
+                headers: this.extractDebugHeaders(response.headers),
+                cookies: response.cookies,
+            });
+            return response;
+        });
+    }
+    /**
+     * Gets the Next.js middleware handler with error handling
+     * @returns middleware handler
+     */
+    getHandler() {
+        return (req, res) => __awaiter(this, void 0, void 0, function* () {
+            try {
+                return yield this.handler(req, res);
+            }
+            catch (error) {
+                console.log('Multisite middleware failed:');
+                console.log(error);
+                return res || server_1.NextResponse.next();
+            }
+        });
+    }
+    excludeRoute(pathname) {
+        // ignore files
+        return pathname.includes('.') || super.excludeRoute(pathname);
+    }
+}
+exports.MultisiteMiddleware = MultisiteMiddleware;

package/dist/cjs/middleware/personalize-middleware.js

@@ -0,0 +1,231 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PersonalizeMiddleware = void 0;
+const server_1 = require("next/server");
+const personalize_1 = require("@sitecore-content-sdk/core/personalize");
+const core_1 = require("@sitecore-content-sdk/core");
+const middleware_1 = require("./middleware");
+const server_2 = require("@sitecore-cloudsdk/core/server");
+const server_3 = require("@sitecore-cloudsdk/personalize/server");
+/**
+ * Middleware / handler to support Sitecore Personalize
+ */
+class PersonalizeMiddleware extends middleware_1.MiddlewareBase {
+    /**
+     * @param {PersonalizeMiddlewareConfig} [config] Personalize middleware config
+     */
+    constructor(config) {
+        super(config);
+        this.config = config;
+        this.handler = (req, res) => __awaiter(this, void 0, void 0, function* () {
+            const pathname = req.nextUrl.pathname;
+            const language = this.getLanguage(req);
+            const hostname = this.getHostHeader(req) || this.defaultHostname;
+            const startTimestamp = Date.now();
+            const timeout = this.config.cdpConfig.timeout;
+            // Response will be provided if other middleware is run before us (e.g. redirects)
+            let response = res || server_1.NextResponse.next();
+            core_1.debug.personalize('personalize middleware start: %o', {
+                pathname,
+                language,
+                hostname,
+                headers: this.extractDebugHeaders(req.headers),
+            });
+            if (this.config.disabled && this.config.disabled(req, response)) {
+                core_1.debug.personalize('skipped (personalize middleware is disabled)');
+                return response;
+            }
+            if (response.redirected || // Don't attempt to personalize a redirect
+                this.isPreview(req) || // No need to personalize for preview (layout data is already prepared for preview)
+                this.excludeRoute(pathname)) {
+                core_1.debug.personalize('skipped (%s)', response.redirected ? 'redirected' : this.isPreview(req) ? 'preview' : 'route excluded');
+                return response;
+            }
+            const site = this.getSite(req, response);
+            // Get personalization info from Experience Edge
+            const personalizeInfo = yield this.personalizeService.getPersonalizeInfo(pathname, language, site.name);
+            if (!personalizeInfo) {
+                // Likely an invalid route / language
+                core_1.debug.personalize('skipped (personalize info not found)');
+                return response;
+            }
+            if (personalizeInfo.variantIds.length === 0) {
+                core_1.debug.personalize('skipped (no personalization configured)');
+                return response;
+            }
+            if (this.isPrefetch(req)) {
+                core_1.debug.personalize('skipped (prefetch)');
+                // Personalized, but this is a prefetch request.
+                // In this case, don't execute a personalize request; otherwise, the metrics for component A/B experiments would be inaccurate.
+                // Disable preflight caching to force revalidation on client-side navigation (personalization WILL be influenced).
+                // Note the reason we don't move this any earlier in the middleware is that we would then be sacrificing performance for non-personalized pages.
+                response.headers.set('x-middleware-cache', 'no-cache');
+                return response;
+            }
+            yield this.initPersonalizeServer({
+                hostname,
+                siteName: site.name,
+                request: req,
+                response,
+            });
+            const params = this.getExperienceParams(req);
+            const executions = this.getPersonalizeExecutions(personalizeInfo, language);
+            const identifiedVariantIds = [];
+            yield Promise.all(executions.map((execution) => this.personalize({
+                friendlyId: execution.friendlyId,
+                variantIds: execution.variantIds,
+                params,
+                language,
+                timeout,
+            }, req).then((personalization) => {
+                const variantId = personalization.variantId;
+                if (variantId) {
+                    if (!execution.variantIds.includes(variantId)) {
+                        core_1.debug.personalize('invalid variant %s', variantId);
+                    }
+                    else {
+                        identifiedVariantIds.push(variantId);
+                    }
+                }
+            })));
+            if (identifiedVariantIds.length === 0) {
+                core_1.debug.personalize('skipped (no variant(s) identified)');
+                return response;
+            }
+            // Path can be rewritten by previously executed middleware
+            const basePath = (res === null || res === void 0 ? void 0 : res.headers.get('x-sc-rewrite')) || pathname;
+            // Rewrite to persononalized path
+            const rewritePath = (0, personalize_1.getPersonalizedRewrite)(basePath, identifiedVariantIds);
+            response = this.rewrite(rewritePath, req, response);
+            // Disable preflight caching to force revalidation on client-side navigation (personalization MAY be influenced).
+            // See https://github.com/vercel/next.js/pull/32767
+            response.headers.set('x-middleware-cache', 'no-cache');
+            core_1.debug.personalize('personalize middleware end in %dms: %o', Date.now() - startTimestamp, {
+                rewritePath,
+                headers: this.extractDebugHeaders(response.headers),
+            });
+            return response;
+        });
+        // NOTE: we provide native fetch for compatibility on Next.js Edge Runtime
+        // (underlying default 'cross-fetch' is not currently compatible: https://github.com/lquixada/cross-fetch/issues/78)
+        this.personalizeService = new personalize_1.GraphQLPersonalizeService(Object.assign(Object.assign({}, config.edgeConfig), { fetch: fetch }));
+    }
+    /**
+     * Gets the Next.js middleware handler with error handling
+     * @returns middleware handler
+     */
+    getHandler() {
+        return (req, res) => __awaiter(this, void 0, void 0, function* () {
+            try {
+                return yield this.handler(req, res);
+            }
+            catch (error) {
+                console.log('Personalize middleware failed:');
+                console.log(error);
+                return res || server_1.NextResponse.next();
+            }
+        });
+    }
+    initPersonalizeServer(_a) {
+        return __awaiter(this, arguments, void 0, function* ({ hostname, siteName, request, response, }) {
+            yield (0, server_2.CloudSDK)(request, response, {
+                sitecoreEdgeUrl: this.config.cdpConfig.sitecoreEdgeUrl,
+                sitecoreEdgeContextId: this.config.cdpConfig.sitecoreEdgeContextId,
+                siteName,
+                cookieDomain: hostname,
+                enableServerCookie: true,
+            })
+                .addPersonalize({ enablePersonalizeCookie: true })
+                .initialize();
+        });
+    }
+    personalize(_a, request_1) {
+        return __awaiter(this, arguments, void 0, function* ({ params, friendlyId, language, timeout, variantIds, }, request) {
+            var _b;
+            core_1.debug.personalize('executing experience for %s %o', friendlyId, params);
+            return (yield (0, server_3.personalize)(request, {
+                channel: this.config.cdpConfig.channel || 'WEB',
+                currency: (_b = this.config.cdpConfig.currency) !== null && _b !== void 0 ? _b : 'USD',
+                friendlyId,
+                params,
+                language,
+                pageVariantIds: variantIds,
+            }, { timeout }));
+        });
+    }
+    getExperienceParams(req) {
+        const utm = {
+            campaign: req.nextUrl.searchParams.get('utm_campaign') || undefined,
+            content: req.nextUrl.searchParams.get('utm_content') || undefined,
+            medium: req.nextUrl.searchParams.get('utm_medium') || undefined,
+            source: req.nextUrl.searchParams.get('utm_source') || undefined,
+        };
+        return {
+            // It's expected that the header name "referer" is actually a misspelling of the word "referrer"
+            // req.referrer is used during fetching to determine the value of the Referer header of the request being made,
+            // used as a fallback
+            referrer: req.headers.get('referer') || req.referrer,
+            utm: utm,
+        };
+    }
+    excludeRoute(pathname) {
+        // ignore files
+        return pathname.includes('.') || super.excludeRoute(pathname);
+    }
+    /**
+     * Aggregates personalize executions based on the provided route personalize information and language
+     * @param {PersonalizeInfo} personalizeInfo the route personalize information
+     * @param {string} language the language
+     * @returns An array of personalize executions
+     */
+    getPersonalizeExecutions(personalizeInfo, language) {
+        if (personalizeInfo.variantIds.length === 0) {
+            return [];
+        }
+        const results = [];
+        return personalizeInfo.variantIds.reduce((results, variantId) => {
+            if (variantId.includes('_')) {
+                // Component-level personalization in format "<ComponentID>_<VariantID>"
+                const componentId = variantId.split('_')[0];
+                const friendlyId = personalize_1.CdpHelper.getComponentFriendlyId(personalizeInfo.pageId, componentId, language, this.config.scope || this.config.edgeConfig.scope);
+                const execution = results.find((x) => x.friendlyId === friendlyId);
+                if (execution) {
+                    execution.variantIds.push(variantId);
+                }
+                else {
+                    // The default/control variant (format "<ComponentID>_default") is also a valid value returned by the execution
+                    const defaultVariant = `${componentId}${personalize_1.DEFAULT_VARIANT}`;
+                    results.push({
+                        friendlyId,
+                        variantIds: [defaultVariant, variantId],
+                    });
+                }
+            }
+            else {
+                // Embedded (page-level) personalization in format "<VariantID>"
+                const friendlyId = personalize_1.CdpHelper.getPageFriendlyId(personalizeInfo.pageId, language, this.config.scope || this.config.edgeConfig.scope);
+                const execution = results.find((x) => x.friendlyId === friendlyId);
+                if (execution) {
+                    execution.variantIds.push(variantId);
+                }
+                else {
+                    results.push({
+                        friendlyId,
+                        variantIds: [variantId],
+                    });
+                }
+            }
+            return results;
+        }, results);
+    }
+}
+exports.PersonalizeMiddleware = PersonalizeMiddleware;