ハイブリッド実装のための Einstein Activities

1res.render('checkout/checkout', {
2+   basketId: currentBasket.UUID,
3    order: orderModel,
4    customer: accountModel,
5    ...
6});

1-    <div id="checkout-main" class="container data-checkout-stage <isif condition="${pdict.order.usingMultiShipping && pdict.order.shipping.length > 1}">multi-ship</isif>" data-customer-type="${pdict.customer.registeredUser ? 'registered' : 'guest'}" data-checkout-stage="${pdict.currentStage}" data-checkout-get-url="${URLUtils.https('CheckoutServices-Get')}">
2+    <div id="checkout-main" class="container data-checkout-stage <isif condition="${pdict.order.usingMultiShipping && pdict.order.shipping.length > 1}">multi-ship</isif>" data-customer-type="${pdict.customer.registeredUser ? 'registered' : 'guest'}" data-checkout-stage="${pdict.currentStage}" data-checkout-get-url="${URLUtils.https('CheckoutServices-Get')}" data-checkout-price-total="${pdict.order.priceTotal}" data-checkout-items="${JSON.stringify(pdict.order.items)}" data-basket-id="${pdict.basketId}">

1'use strict';
2
3/**
4 * Get the value of a cookie
5 * Source: https://gist.github.com/wpsmith/6cf23551dd140fb72ae7
6 * @param  {string} name  The name of the cookie
7 * @return {string | undefined}       The cookie value
8 */
9function getCookie(name) {
10    var value = '; ' + document.cookie;
11    var parts = value.split('; ' + name + '=');
12    var result;
13
14    if (parts.length === 2) {
15        result = parts.pop().split(';').shift();
16    }
17    return result;
18}
19
20/**
21 * Fire a given Einstein activity with the provided data.
22 *
23 * @param {string} name - The name of the activity.
24 * @param {Object} data - The activity payload.
25 */
26function fireEinsteinActivity(name, data) {
27    // NOTE: These should be placed in the custom preferences of BM. This will help
28    // avoid any code deployments if you need to change these values.
29    // NOTE 2: this is _Einstein_ site id (not the same as SFRA one like RefArch).
30    var SITE_ID = '$YOUR_SITE_ID';
31    var CLIENT_ID = '$YOUR_CLIENT_ID';
32    // Reports & Dashboards will only show data that's been tagged as `prd` (production)
33    var INSTANCE_TYPE = 'prd';
34
35    // Assign the realm to the data.
36    var activityData = Object.assign(data, {
37        realm: SITE_ID.split('-')[0],
38        instanceType: INSTANCE_TYPE
39    });
40
41    var userId = data.userId;
42    var cookieId = data.cookieId;
43
44    // Apply payload information for logged in users.
45    if (userId) {
46        activityData = Object.assign(activityData, {
47            userId: userId
48        });
49    }
50
51    if (cookieId) {
52        activityData = Object.assign(activityData, {
53            cookieId: cookieId
54        });
55    }
56
57    var url =
58            'https://api.cquotient.com/v3/activities' +
59                '/' + SITE_ID +
60                '/' + name;
61
62    try {
63        fetch(url, {
64            headers: {
65                'Content-Type': 'application/json',
66                'x-cq-client-id': CLIENT_ID
67            },
68            method: 'POST',
69            body: JSON.stringify(activityData)
70        });
71    } catch (e) {
72        console.error(e);
73    }
74}
75
76var exports = {
77    fireEinsteinActivity: fireEinsteinActivity,
78    getCookie: getCookie
79};
80
81module.exports = exports;

1var einsteinHelpers = require('../einsteinHelpers');

1/**
2 * @returns {boolean} whether the current customer is registered or not
3 */
4function isRegisteredCustomer() {
5    return $('.data-checkout-stage').data('customer-type') === 'registered';
6}
7
8/**
9 * Get the cookieId, which is a unique identifier used for linking subsequent activities to the same user.
10 * If the cookieId is not defined, then Reports & Dashboards will treat the activity as coming from an anonymous user.
11 * @returns {string | undefined} value of the cookieId param for Einstein Activities API
12 */
13function getCookieId() {
14    var siteId = window.CQuotient && window.CQuotient.siteId;
15    // This usid cookie is set by either PWA or plugin_slas
16    return einsteinHelpers.getCookie('usid_' + siteId) || einsteinHelpers.getCookie('usid') || undefined;
17}
18
19/**
20 * Get the userId, which is for linking registered users across different devices.
21 * @returns {string | undefined} value of the userId param for Einstein Activities API
22 */
23function getUserId() {
24    var siteId = window.CQuotient && window.CQuotient.siteId;
25    // This enc_user_id is set by PWA
26    return window.localStorage.getItem('enc_user_id_' + siteId) || window.localStorage.getItem('enc_user_id') || undefined;
27}
28
29/**
30 * Updates the URL to determine stage
31 * @param {number} currentStage - The current stage the user is currently on in the checkout
32 */
33function updateUrl(currentStage) {
34    // ...
35
36    var cookieId = getCookieId();
37    var userId = isRegisteredCustomer() ? getUserId() : undefined;
38
39    einsteinHelpers.fireEinsteinActivity('checkoutStep', {
40        basketId: $('#checkout-main').data('basket-id'),
41        stepName: checkoutStages[currentStage],
42        stepNumber: currentStage,
43        cookieId: cookieId,
44        userId: userId
45    });
46}

1//
2// Send Einstein `beginCheckout` activity
3//
4// Parse total amount value
5var amount = $('#checkout-main').data('checkout-price-total');
6amount = Number(amount.replace(/[^0-9.-]+/g, ''));
7
8var products = $('#checkout-main')
9    .data('checkout-items')
10    .items.map(function (item) {
11        return {
12            id: item.id,
13            price: Number(item.priceTotal.price.replace(/[^0-9.-]+/g, '')),
14            quantity: item.quantity
15        };
16    });
17
18var cookieId = getCookieId();
19var userId = isRegisteredCustomer() ? getUserId() : undefined;
20
21einsteinHelpers.fireEinsteinActivity('beginCheckout', {
22    products: products,
23    amount: amount,
24    cookieId: cookieId,
25    userId: userId
26});