@sitecore-jss/sitecore-jss-proxy 22.3.0 → 22.3.1-canary.2

package/dist/cjs/personalize/PersonalizeHelper.js

@@ -0,0 +1,243 @@
+"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());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PersonalizeHelper = void 0;
+const server_1 = require("@sitecore-cloudsdk/core/server");
+const server_2 = require("@sitecore-cloudsdk/personalize/server");
+const sitecore_jss_1 = require("@sitecore-jss/sitecore-jss");
+const personalize_1 = require("@sitecore-jss/sitecore-jss/personalize");
+const querystring_1 = __importDefault(require("querystring"));
+class PersonalizeHelper {
+    constructor(config) {
+        this.config = config;
+        /**
+         * Performs personalize on layout data before a page is rendered
+         * @param {IncomingMessage} req Incoming request nodejs object
+         * @param {OutgoingMessage} res Outgoing response nodejs object
+         * @param {LayoutServiceData} layoutData layoutData for the page
+         * @returns layout data with personalization applied
+         */
+        this.personalizeLayoutData = (req, res, layoutData) => __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            if (!((_a = layoutData.sitecore) === null || _a === void 0 ? void 0 : _a.context)) {
+                sitecore_jss_1.debug.personalize('skipped (sitecore context is empty)');
+                return layoutData;
+            }
+            if (!((_b = layoutData.sitecore) === null || _b === void 0 ? void 0 : _b.route)) {
+                sitecore_jss_1.debug.personalize('skipped (layout is empty)');
+                return layoutData;
+            }
+            // current method can run for page requests and for layout service requests.
+            // the latter will not have the correct path - so we use path from layoutData instead
+            const pathname = layoutData.sitecore.context.itemPath;
+            const language = this.getLanguage(layoutData);
+            const hostname = this.getHostHeader(req) || this.defaultHostname;
+            const startTimestamp = Date.now();
+            if (!pathname) {
+                sitecore_jss_1.debug.personalize('skipped (pathname missing from layoutData)');
+                return layoutData;
+            }
+            sitecore_jss_1.debug.personalize('personalize layout start: %o', {
+                pathname,
+                language,
+                hostname,
+                headers: this.extractDebugHeaders(req.headers),
+            });
+            if (this.excludeRoute(pathname)) {
+                sitecore_jss_1.debug.personalize('skipped (route excluded)');
+                return layoutData;
+            }
+            if (this.config.disabled && this.config.disabled(req, res)) {
+                sitecore_jss_1.debug.personalize('skipped (personalize is disabled)');
+                return layoutData;
+            }
+            try {
+                yield this.initPersonalizeServer(req, res, hostname);
+            }
+            catch (e) {
+                sitecore_jss_1.debug.personalize('skipped (CloudSDK initialization failed), error %o', e);
+                return layoutData;
+            }
+            const variantIds = yield this.getVariantIds(req, language, pathname);
+            if (!variantIds) {
+                return layoutData;
+            }
+            const personalizeData = (0, personalize_1.getGroomedVariantIds)(variantIds);
+            // layout will be personalized here
+            (0, personalize_1.personalizeLayout)(layoutData, personalizeData.variantId, personalizeData.componentVariantIds);
+            sitecore_jss_1.debug.personalize('personalize layout end in %dms: %o', Date.now() - startTimestamp, {
+                headers: this.extractDebugHeaders(req.headers),
+                variantIds: variantIds,
+            });
+            return layoutData;
+        });
+        this.getVariantIds = (req, language, pathname) => __awaiter(this, void 0, void 0, function* () {
+            const timeout = this.config.cdpConfig.timeout;
+            // Get personalization info from Experience Edge
+            const personalizeInfo = yield this.personalizeService.getPersonalizeInfo(pathname, language, this.config.sitecoreSiteName);
+            if (!personalizeInfo) {
+                // Likely an invalid route / language
+                sitecore_jss_1.debug.personalize('skipped (personalize info not found)');
+                return [];
+            }
+            if (personalizeInfo.variantIds.length === 0) {
+                sitecore_jss_1.debug.personalize('skipped (no personalization configured)');
+                return [];
+            }
+            const params = this.getExperienceParams(req);
+            const executions = this.getPersonalizeExecutions(personalizeInfo, language);
+            const identifiedVariantIds = [];
+            try {
+                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)) {
+                            sitecore_jss_1.debug.personalize('invalid variant %s', variantId);
+                        }
+                        else {
+                            identifiedVariantIds.push(variantId);
+                        }
+                    }
+                })));
+            }
+            catch (e) {
+                sitecore_jss_1.debug.personalize('skipped, error %o', e);
+            }
+            if (identifiedVariantIds.length === 0) {
+                sitecore_jss_1.debug.personalize('skipped (no variant(s) identified)');
+                return [];
+            }
+            return identifiedVariantIds;
+        });
+        this.personalizeService = new personalize_1.GraphQLPersonalizeService(Object.assign({}, config.edgeConfig));
+        this.defaultHostname = config.defaultHostname || 'localhost';
+    }
+    /**
+     * Init CloudSDK personalization on server side
+     * @param {IncomingMessage} request incoming nodejs request object
+     * @param {OutgoingMessage} response outgoing nodejs response object
+     * @param {string} hostname host for cookies. Usually a host header, or a fallback config
+     */
+    initPersonalizeServer(request, response, hostname) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield (0, server_1.CloudSDK)(request, response, {
+                sitecoreEdgeUrl: this.config.cdpConfig.sitecoreEdgeUrl,
+                sitecoreEdgeContextId: this.config.cdpConfig.sitecoreEdgeContextId,
+                siteName: this.config.sitecoreSiteName,
+                cookieDomain: hostname,
+                enableServerCookie: true,
+            })
+                .addPersonalize({ enablePersonalizeCookie: true })
+                .initialize();
+        });
+    }
+    getLanguage(layoutData) {
+        var _a, _b;
+        return ((_b = (_a = layoutData.sitecore) === null || _a === void 0 ? void 0 : _a.context) === null || _b === void 0 ? void 0 : _b.language) || this.config.defaultLanguage || 'en';
+    }
+    getHostHeader(req) {
+        var _a;
+        return ((_a = req.headers.host) === null || _a === void 0 ? void 0 : _a.split(':')[0]) || '';
+    }
+    excludeRoute(pathname) {
+        var _a, _b;
+        return ((_a = this.config) === null || _a === void 0 ? void 0 : _a.excludeRoute) && ((_b = this.config) === null || _b === void 0 ? void 0 : _b.excludeRoute(pathname));
+    }
+    extractDebugHeaders(incomingHeaders) {
+        const headers = {};
+        Object.keys(incomingHeaders).forEach((key) => incomingHeaders[key] && (headers[key] = incomingHeaders[key]));
+        return headers;
+    }
+    personalize(_a, request_1) {
+        return __awaiter(this, arguments, void 0, function* ({ params, friendlyId, language, timeout, variantIds, }, request) {
+            var _b;
+            sitecore_jss_1.debug.personalize('executing experience for %s %o', friendlyId, params);
+            return (yield (0, server_2.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) {
+        var _a;
+        // nodejs req.url does not have a hostname, we parse query string the old fashioned way
+        const rawQs = ((_a = req.url) === null || _a === void 0 ? void 0 : _a.split('?')[1]) || '';
+        const queryString = querystring_1.default.parse(rawQs);
+        // also need to account for types (string | string[]) returned by parse()
+        const utm = {
+            campaign: [queryString.utm_campaign].join('') || undefined,
+            content: [queryString.utm_content].join('') || undefined,
+            medium: [queryString.utm_medium].join('') || undefined,
+            source: [queryString.utm_source].join('') || 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.referer || [''].concat(req.headers.referrer || '').join(''),
+            utm: utm,
+        };
+    }
+    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);
+                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);
+                const execution = results.find((x) => x.friendlyId === friendlyId);
+                if (execution) {
+                    execution.variantIds.push(variantId);
+                }
+                else {
+                    results.push({
+                        friendlyId,
+                        variantIds: [variantId],
+                    });
+                }
+            }
+            return results;
+        }, results);
+    }
+}
+exports.PersonalizeHelper = PersonalizeHelper;

package/dist/cjs/personalize/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PersonalizeHelper = void 0;
+var PersonalizeHelper_1 = require("./PersonalizeHelper");
+Object.defineProperty(exports, "PersonalizeHelper", { enumerable: true, get: function () { return PersonalizeHelper_1.PersonalizeHelper; } });

package/dist/cjs/personalize/test-data/personalizeData.js

@@ -0,0 +1,86 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getPersonalizeLayoutData = exports.component_variant = exports.cityBikeVariant = exports.mountainBikeVariant = void 0;
+exports.mountainBikeVariant = {
+    uid: '0b6d23d8-c50e-4e79-9eca-317ec43e82b0',
+    componentName: 'ContentBlock',
+    dataSource: '20679cd4-356b-4452-b507-453beeb0be39',
+    fields: {
+        content: {
+            value: '<p><img src="https://edge-beta.sitecorecloud.io/ser-edge-personalization/media/JssNextWeb/Mountain-Bike.jpg?h=675&amp;w=1200" style="width:1200px;height:675px;" /></p>',
+        },
+        heading: { value: 'Mountain Bike' },
+    },
+};
+exports.cityBikeVariant = {
+    uid: '0b6d23d8-c50e-4e79-9eca-317ec43e82b0',
+    componentName: 'ContentBlock',
+    dataSource: '36e02581-2056-4c55-a4d5-f4b700ba1ae2',
+    fields: {
+        content: {
+            value: '<p><img src="https://edge-beta.sitecorecloud.io/ser-edge-personalization/media/JssNextWeb/Mountain-Bike.jpg?h=675&amp;w=1200" style="width:1200px;height:675px;" /></p>',
+        },
+        heading: { value: 'Mountain Bike' },
+    },
+};
+exports.component_variant = {
+    uid: '0b6d23d8-c50e-4e79-9eca-317ec43e82b0',
+    componentName: 'ContentBlock',
+    dataSource: '36e02581-2056-4c55-a4d5-f4b700ba1ae2',
+    fields: {
+        content: {
+            value: '<p><img src="https://edge-beta.sitecorecloud.io/ser-edge-personalization/media/JssNextWeb/Hybrid-Bike.jpg?h=675&amp;w=1200" style="width:1200px;height:675px;" /></p>',
+        },
+        heading: { value: 'Hybrid Bike' },
+    },
+};
+const defaultRendering = {
+    uid: '0b6d23d8-c50e-4e79-9eca-317ec43e82b0',
+    componentName: 'ContentBlock',
+    dataSource: 'e020fb58-1be8-4537-aab8-67916452ecf2',
+    fields: { content: { value: '' }, heading: { value: 'Default Content' } },
+    experiences: {
+        'mountain-bike-audience': exports.mountainBikeVariant,
+        'city-bike-audience': exports.cityBikeVariant,
+        'componentid_variant-id': exports.component_variant,
+    },
+};
+const getPersonalizeLayoutData = (variant, language, path) => {
+    const baseLayout = {
+        sitecore: {
+            context: {
+                pageEditing: false,
+                site: { name: 'JssNextWeb' },
+                visitorIdentificationTimestamp: 1038543,
+                language: language || 'en',
+                variantId: '',
+                itemPath: path || '/styleguide',
+            },
+            route: {
+                name: 'styleguide',
+                placeholders: {
+                    main: {},
+                },
+            },
+        },
+    };
+    switch (variant) {
+        case 'mountain-bike-audience':
+            baseLayout.sitecore.route.placeholders.main = [exports.mountainBikeVariant];
+            baseLayout.sitecore.context.variantId = 'mountain-bike-audience';
+            break;
+        case 'city-bike-audience':
+            baseLayout.sitecore.route.placeholders.main = [exports.cityBikeVariant];
+            baseLayout.sitecore.context.variantId = 'city-bike-audience';
+            break;
+        case 'componentid_variant-id':
+            baseLayout.sitecore.route.placeholders.main = [exports.component_variant];
+            baseLayout.sitecore.context.variantId = '_default';
+            break;
+        default:
+            baseLayout.sitecore.route.placeholders.main = [defaultRendering];
+            break;
+    }
+    return baseLayout;
+};
+exports.getPersonalizeLayoutData = getPersonalizeLayoutData;

package/dist/cjs/types/personalize.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });