Configurar com autenticação híbrida
Regras da eCDN para implementações híbridas
Einstein Activities para implementações híbridas
Habilidades para o sucesso
Ask the Community
Com os painéis de relatórios&, você pode identificar tendências ao longo do tempo e tomar decisões de negócios mais inteligentes com base em seus dados do B2C Commerce.
Relatórios & A análise de painéis só pode ser derivada de logs do adaptador da Web ou do Einstein Activities API. Por padrão, os dados de análise de SFRA e SiteGenesis são armazenados em logs de adaptador da Web, enquanto o PWA Kit envia dados de análise para Einstein Activities API.
Se você estiver buscando uma implementação híbrida, em que algumas páginas são alimentadas por PWA Kit e outras são alimentadas por SFRA ou SiteGenesis, e deseja usar os Painéis de Relatórios & em todo o site, atualize seu SFRA ou SiteGenesis implementação para usar o Einstein Activities API. Isso garante que a API capture a experiência completa do comprador, independentemente de ele estar em PWA Kit, SFRA ou SiteGenesis.
Somente clientes existentes podem acessar alguns dos links desta página. Visite Salesforce Commerce Cloud GitHub Repositories and Access (Repositórios e acesso ao GitHub do Salesforce Commerce Cloud) para obter informações sobre como obter acesso aos repositórios do Commerce Cloud.
Tip
Este guia mostra como integrar o Einstein Activities API com o checkout do SFRA, para que ele envie as mesmas atividades que o checkout do PWA Kit.
Se sua distribuição em fases tiver páginas adicionais em SFRA ou SiteGenesis que enviam dados analíticos para os logs do adaptador da Web, para essas páginas, você poderá seguir um processo semelhante ao descrito neste guia. Olhe para as páginas correspondentes no Retail React App e observe quais atividades elas enviam. Em seguida, você precisará enviar as mesmas atividades em suas páginas SFRA ou SiteGenesis. Como recurso, esta visão geral de Einstein atividades mostra onde essas atividades devem ser usadas.
As implementações que usam SiteGenesis com o Composable Storefront não são oficialmente suportadas.
Note
Cuidado ao integrar os exemplos de código fornecidos e sempre teste seu código rigorosamente antes de enviá-lo para Production.
As linhas a ser adicionadas a um código existente estão marcadas com o símbolo de adição (+). Já as linhas a serem excluídas estão marcadas com o símbolo de subtração (-).
Antes de executar os comandos neste tutorial, substitua os espaços reservados por valores reais. Os espaços reservados são formatados da seguinte maneira: $PLACEHOLDER.
Comece atualizando seu controlador de checkout para incluir o ID do carrinho atual.
1res.render('checkout/checkout', {
2+ basketId: currentBasket.UUID,
3 order: orderModel,
4 customer: accountModel,
5 ...
6});Atualize o modelo ISML usado para o checkout. Essa alteração disponibiliza no navegador o ID, os itens e o total do carrinho.
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}">Crie um arquivo JavaScript chamado js/einsteinHelpers.js que contenha as funções auxiliares:
Lembre-se de substituir os espaços reservados $YOUR_SITE_ID e $YOUR_CLIENT_ID com os valores reais.
Important
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;Atualize seu script checkout.js para registrar atividades. Você precisa incluir essa chamada a require() na parte superior de seu script de checkout, e ele precisa aparecer após todas as importações existentes.
1var einsteinHelpers = require('../einsteinHelpers');Acione a atividade checkoutStep quando o estágio do checkout for alterado. Adicione o código a seguir ao método updateUrl:
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}O acionamento da atividade checkoutStep no método updateUrl assegura que qualquer transição de um estágio do checkout para o próximo (ou anterior) seja rastreada.
Note
Acione a atividade beginCheckout ao final da função initialize do seu código de checkout.
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});A beginCheckout atividade é acionada apenas uma vez por carregamento de página durante o checkout. A preparação dos dados da atividade é feita automaticamente.
Note
Pronto! Você integrou com sucesso o Einstein Activities com o checkout do SFRA. Para concluir a configuração do amplificador Reports &; Dashboards, conclua as etapas em Reports & Painéis.