{
    "componentChunkName": "component---node-modules-lekoarts-gatsby-theme-minimal-blog-core-src-templates-post-query-tsx",
    "path": "/web-sdk-target-migration-quickstart",
    "result": {"data":{"post":{"slug":"/web-sdk-target-migration-quickstart","title":"Web SDK Target Migration Quickstart","date":"02.10.2023","tags":[{"name":"Adobe","slug":"adobe"},{"name":"AEP","slug":"aep"},{"name":"Experience Platform","slug":"experience-platform"},{"name":"Data Collection","slug":"data-collection"},{"name":"Web SDK","slug":"web-sdk"},{"name":"Target","slug":"target"},{"name":"at.js","slug":"at-js"},{"name":"alloy.js","slug":"alloy-js"}],"description":"Technical Guide for Migrating Adobe Target at.js to Web SDK's alloy.js","canonicalUrl":null,"body":"var _excluded = [\"components\"];\n\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n/* @jsxRuntime classic */\n\n/* @jsx mdx */\nvar _frontmatter = {\n  \"title\": \"Web SDK Target Migration Quickstart\",\n  \"date\": \"2023-10-02T00:00:00.000Z\",\n  \"description\": \"Technical Guide for Migrating Adobe Target at.js to Web SDK's alloy.js\",\n  \"tags\": [\"Adobe\", \"AEP\", \"Experience Platform\", \"Data Collection\", \"Web SDK\", \"Target\", \"at.js\", \"alloy.js\"],\n  \"banner\": \"./labyrinth.jpg\"\n};\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n      props = _objectWithoutProperties(_ref, _excluded);\n\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"h1\", null, \"Web SDK and Adobe Target Migration Quickstart\"), mdx(\"p\", null, \"This guide assumes familiarity with:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Adobe Target\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"HTML and JavaScript\")), mdx(\"p\", null, \"This guide requires access to the following Adobe solutions:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Experience Platform\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Data Collection\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Target\")), mdx(\"h2\", null, \"Web SDK Overview\"), mdx(\"p\", null, mdx(\"span\", {\n    parentName: \"p\",\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"960px\"\n    }\n  }, \"\\n      \", mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"56.25%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAABYlAAAWJQFJUiTwAAACb0lEQVQoz32TXYsUVxCG+4d6FQkKYhSCWVBQ0NwkEzCQICKC/goFRVjBXIghu+PsTJ/+2B13dnumP6c/zumentNn+kmm9z4FL0UVb71UFVVWc3lBZ0/pznz07ATtu1fwHDrfvYLnoF2BFjP0ZExXFnTG0Gk9YLvdsjchBFbXbjC1okrXUBbge7AMoK5R4YpksaDMctgX9T3/Z57vY5mdYaDtFLt2Qy4EyWRC0/foX5+gn/8OdMx9n/DVC/qXz9Av/qT75wu9Y9MuFsjlkjSO8RwHqypL6rpBRR5mq6hUjSxL9kOYuzfYHNylriKiyRj57g0cfmD7/i21YxOcjGmriqZtUYA7m2HN53MuFxd8/fQRlS24DJZD+/uu9Y+3MKP7Q9x5LtXpFKkyMm1YhyGnN2+we/SI/uFDeP0adzzGCsOQNIpoZcVOSpokhqIYRMxP36FG96nSmHUQYIsZ31yb6XTGUgj06DeygwOye/eQoxHO0RHW+fk5qyCgkRKZxLR5TpumqE6jH1zH/PEUmoZ6tSQKI74Jh2gxJY5XfBaCw+MjDo+POT49xZ5MsGzb5sz3WWcZe/EgCEjCkFXbom9fY/fLY0pg7nmkSYzv+9SyRNWKi8sATwhcIUijEOdkgpXnOaqqMF2HkpIsSVBFjtnv8M5Ndk+fXN1E31OEIdH8jDIK6bsOk8RDndZ6oLjTE6wwjsnTdEjophnE+s1miHd3vqf6+QeiooR8Te4KFl/HFMOdKtq/P9PEMXVR0Pc9nutiySxlU1Vs2nZAu/dNw6bvaT5+oPrrE5mqaaIQHa7olEQbc8U1ZuBXUg7fMvlvh/8Ci+gl9PXU1pAAAAAASUVORK5CYII=')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  }), \"\\n  \", mdx(\"img\", {\n    parentName: \"span\",\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Web SDK Diagram\",\n    \"title\": \"Web SDK Diagram\",\n    \"src\": \"/static/ec5295a0cc80a1557e8530453a83323d/7d769/websdk-diagram.png\",\n    \"srcSet\": [\"/static/ec5295a0cc80a1557e8530453a83323d/5243c/websdk-diagram.png 240w\", \"/static/ec5295a0cc80a1557e8530453a83323d/ab158/websdk-diagram.png 480w\", \"/static/ec5295a0cc80a1557e8530453a83323d/7d769/websdk-diagram.png 960w\", \"/static/ec5295a0cc80a1557e8530453a83323d/87339/websdk-diagram.png 1440w\", \"/static/ec5295a0cc80a1557e8530453a83323d/88b03/websdk-diagram.png 1920w\", \"/static/ec5295a0cc80a1557e8530453a83323d/d43d8/websdk-diagram.png 1954w\"],\n    \"sizes\": \"(max-width: 960px) 100vw, 960px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\",\n    \"decoding\": \"async\"\n  }), \"\\n    \")), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"The device loads the Platform Web SDK. The Platform Web SDK sends a request to the edge network with XDM data, the Datastreams Environment ID, passed-in parameters, and the Customer ID (optional). Page (or containers) is pre-hidden.\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"The edge network sends the request to the edge services to enrich it with the Visitor ID, consent, and other visitor context info, such as geolocation and device-friendly names.\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"The edge network sends the enriched personalization request to the Target edge with the Visitor ID and passed-in parameters.\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"Profile scripts execute and then feed into Target profile storage. Profile storage fetches segments from the Audience Library (for example, segments shared from Adobe Analytics, Adobe Audience Manager, the Adobe Experience Platform).\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"Based on URL request parameters and profile data, Target determines which activities and experiences to display for the visitor for the current page view and for future prefetched views. Target then sends this back to the edge network.\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"Steps:\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"a. The edge network sends the personalization response back to the page, optionally including profile values for additional personalization. Personalized content on the current page is revealed as quickly as possible without flicker of default content.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"b. Personalized content for views that are shown as a result of user actions in a Single Page Application (SPA) is cached so it can be instantly applied without an additional server call when the views are triggered.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"c. The edge network sends the Visitor ID and other values in cookies, such as consent, Session ID, identity, cookie check, personalization, and so forth.\"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"The edge network forwards Analytics for Target (A4T) details (activity, experience, and conversion metadata) to the Analytics edge.\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"See \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://experienceleague.adobe.com/docs/experience-platform/edge/personalization/adobe-target/target-overview.html?lang=en\"\n  }, \"documentation reference\"))), mdx(\"h2\", null, \"Product Configuration\"), mdx(\"h3\", null, \"Configure XDM Schema\"), mdx(\"p\", null, \"Experience Data Model (XDM) schemas are the building blocks, principles, and best practices for composing schemas in Adobe Experience Platform.\"), mdx(\"p\", null, \"Platform Web SDK uses your schema to standardize your web event data, send it to the Platform Edge Network, and ultimately forward the data to any Experience Cloud applications configured in the datastream. This step is critical as it defines a standard data model required for ingesting customer experience data into Experience Platform and enables downstream services and applications built on these standards.\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"p\", null, \"For Target, add the recommended pre-defined field groups for web data collection: \"), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"AEP Web SDK ExperienceEvent \"), mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Consumer Experience Event\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"See \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://experienceleague.adobe.com/docs/platform-learn/implement-web-sdk/initial-configuration/configure-schemas.html?lang=en\"\n  }, \"documentation reference\"))), mdx(\"h3\", null, \"Update Audiences and Profile Scripts with XDM Path\"), mdx(\"p\", null, \"When defining your Schema, your data will be passed in the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"xdm\"), \" object of payload and visible to all configured Adobe solution.\\nAlternatively, you can pass data to Target only via \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"data\"), \" object.\\nIf Target custom parameters are moved to the XDM Schema, the path in the Audience builder will differ and needs to be updated for Audiences and Profile Scripts.\\nThe XDM is serialized using dot notation (for example, \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"web.webPageDetails.name\"), \").\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Update Target Audiences with XDM path for custom parameters if needed \"), mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Update Profile Scripts with XDM path for custom parameters if needed\")), mdx(\"h3\", null, \"Configure Identity Namespace\"), mdx(\"p\", null, \"The Adobe Experience Platform Identity Service sets a common visitor ID across all Adobe solutions in order to power Experience Cloud capabilities such as audience-sharing between solutions.\\nYou can also send your own customer IDs to the Service to enable cross-device targeting and integrations with other systems, such as your Customer Relationship Management (CRM) system.\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Add the identityMap object to XDM Schema\"), mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"To enable a partial website migration to AEP, set the \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"targetMigrationEnabled\"), \" and \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"idMigrationEnabled\"), \" parameters to \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"true\"), \" in the configuration. This helps where some pages still coninue to use \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Visitor.js\"), \" and \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"at.js\"), \".\")), mdx(\"p\", null, \"Code below sends identity data to AEP:\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"alloy(\\\"sendEvent\\\", {\\n  xdm: {\\n    \\\"identityMap\\\": {\\n      \\\"ID_NAMESPACE\\\": [\\n        {\\n          \\\"id\\\": \\\"1234\\\",\\n          \\\"authenticatedState\\\": \\\"ambiguous\\\",\\n          \\\"primary\\\": true\\n        }\\n      ]\\n    }\\n  }\\n});\\n\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"See \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://experienceleague.adobe.com/docs/platform-learn/implement-web-sdk/initial-configuration/configure-identities.html?lang=en\"\n  }, \"documentation reference\"))), mdx(\"h3\", null, \"Configure Datastream\"), mdx(\"p\", null, \"Target must be enabled in the datastream configuration before any Target activities can be delivered by the Platform Web SDK.\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Enable Target in Datastream\"), mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Optionally, set Property Token\"), mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Optionally, set Target Environment ID\"), mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Optionally, set Third Party ID\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"See \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://experienceleague.adobe.com/docs/platform-learn/implement-web-sdk/applications-setup/setup-target.html?lang=en#configure-the-datastream\"\n  }, \"documentation reference\"))), mdx(\"h2\", null, \"Web Configuration\"), mdx(\"h3\", null, \"Load and Configure Library\"), mdx(\"p\", null, \"There are three supported ways to use Adobe Experience Platform Web SDK:\"), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"The preferred way to use Adobe Experience Platform Web SDK is via the Data Collection UI or Experience Platform UI.\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"Adobe Experience Platform Web SDK is also available on a content delivery network (CDN) for you to use.\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"Use the NPM library which exports EcmaScript 5 and EcmaScript 2015 (ES6) modules.\")), mdx(\"p\", null, \"For technical clarification purposes, this guide references the CDN approach even though loading Web SDK via the Data Collection UI would be the most simple and recommended way. \"), mdx(\"p\", null, \"Web SDK's alloy.js can be loaded synchronously or asynchronously. \"), mdx(\"h4\", null, \"Synchronous Load\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Implement Web SDK by adding alloy.js JavaScript library, its shim and configurations. \")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"<script>\\n  !function(n,o){o.forEach(function(o){n[o]||((n.__alloyNS=n.__alloyNS||\\n  []).push(o),n[o]=function(){var u=arguments;return new Promise(\\n  function(i,l){n[o].q.push([i,l,u])})},n[o].q=[])})}\\n  (window,[\\\"alloy\\\"]);\\n</script>\\n<script src=\\\"https://cdn1.adoberesources.net/alloy/2.6.4/alloy.min.js\\\"></script>\\n<script>\\nalloy(\\\"configure\\\", {\\n  \\\"edgeConfigId\\\": \\\"ebebf826-a01f-4458-8cec-ef61de241c93\\\",\\n  \\\"orgId\\\":\\\"ADB3LETTERSANDNUMBERS@AdobeOrg\\\",\\n  \\\"prehidingStyle\\\": \\\"body { opacity: 0 !important }\\\"\\n});\\n</script>\\n\")), mdx(\"p\", null, \"It is recommended to set \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"prehidingStyle\"), \" to \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"body { opacity: 0 !important }\"), \". This ensures that the whole page is pre-hidden during personalization call. \"), mdx(\"h4\", null, \"Asynchronous Load with Prehiding Snippet\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Implement Web SDK by adding alloy.js JavaScript library with async tag, its shim and configurations. \")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"<script>\\n  !function(n,o){o.forEach(function(o){n[o]||((n.__alloyNS=n.__alloyNS||\\n  []).push(o),n[o]=function(){var u=arguments;return new Promise(\\n  function(i,l){n[o].q.push([i,l,u])})},n[o].q=[])})}\\n  (window,[\\\"alloy\\\"]);\\n  //Pre-hiding snippet\\n  !function(e,a,n,t){\\n  if (a) return;\\n  var i=e.head;if(i){\\n  var o=e.createElement(\\\"style\\\");\\n  o.id=\\\"alloy-prehiding\\\",o.innerText=n,i.appendChild(o),\\n  setTimeout(function(){o.parentNode&&o.parentNode.removeChild(o)},t)}}\\n  (document, document.location.href.indexOf(\\\"adobe_authoring_enabled\\\") !== -1, \\\"body { opacity: 0 !important }\\\", 3000);\\n</script>\\n<script src=\\\"https://cdn1.adoberesources.net/alloy/2.6.4/alloy.min.js\\\" async></script>\\n<script>\\nalloy(\\\"configure\\\", {\\n  \\\"edgeConfigId\\\": \\\"ebebf826-a01f-4458-8cec-ef61de241c93\\\",\\n  \\\"orgId\\\":\\\"ADB3LETTERSANDNUMBERS@AdobeOrg\\\"\\n});\\n</script>\\n\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"See \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://experienceleague.adobe.com/docs/experience-platform/edge/fundamentals/installing-the-sdk.html?lang=en\"\n  }, \"documentation reference\"))), mdx(\"h3\", null, \"Add \", mdx(\"inlineCode\", {\n    parentName: \"h3\"\n  }, \"renderDecisions\"), \" to Events\"), mdx(\"p\", null, \"To enable Visual Experience Composer (VEC) experiences delivery, add \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"renderDecisions: true\"), \" to Web SDK event calls.\\nThis also delivers custom code experiences set up via VEC.\\nThere is no need to include \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"decisionScopes: __view__\"), \" as it is automatically added by the Web SDK.\\nThis \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"__view__\"), \" scope is a signal to fetch all the page-load activities from Target and prefetch all views. \"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Add \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"renderDecisions\"), \" option for VEC-based Activities.  \")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"alloy(\\\"sendEvent\\\", {\\n  renderDecisions: true,\\n  xmd: {},\\n  data: {}\\n});\\n\")), mdx(\"h3\", null, \"Add Optional \", mdx(\"inlineCode\", {\n    parentName: \"h3\"\n  }, \"decisionScopes\"), \" to Events\"), mdx(\"p\", null, \"Setting \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"decisionScopes\"), \" with a list of custom scopes (a.k.a. \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"mboxes\"), \" or \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Target Locations\"), \" in older terms) retrieves qualifying Target Activities created with the form-based composer.\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Add \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"decisionScopes\"), \" option for the Form-based Activities.\")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"alloy(\\\"sendEvent\\\", {\\n  decisionScopes: [\\\"scope1\\\", \\\"scope2\\\"],\\n  xmd: {},\\n  data: {}\\n});\\n\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"Note that custom scope experiences will need to be rendered manually using code. See more information below.\")), mdx(\"h3\", null, \"Pass Data to Visitor Profile\"), mdx(\"p\", null, \"It is advised to move custom parameters to XDM Schema. This also changes how Audiences work because the path to a custom parameter from XDM becomes different (eg., \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"web.webPageDetails.name\"), \"). \"), mdx(\"p\", null, \"However, free form data is also supported inside \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"data.__adobe.target\"), \" object:\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Move mbox custom parameters and user profile data to \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"xdm\"), \" or \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"data\"), \" objects as needed. \")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"  alloy(\\\"sendEvent\\\", {\\n    renderDecisions: true,\\n    xdm: {},\\n    data: {\\n      __adobe: {\\n        target: {\\n          \\\"profile.gender\\\": \\\"female\\\",\\n          \\\"entity.id\\\": 1234,\\n          \\\"user.categoryId\\\": \\\"outerwear,jackets\\\",\\n          \\\"foo\\\": \\\"bar\\\"\\n        }\\n      }\\n    }\\n  });\\n\")), mdx(\"h3\", null, \"Response Tokens\"), mdx(\"p\", null, \"For response tokens, subscribe to alloy.js sendEvent promise, iterate through \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"propositions\"), \"\\nand extract the details from \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"items -> meta\"), \".\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Extract response token data into local variable\")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"alloy(\\\"sendEvent\\\", {\\n    renderDecisions: true,\\n    xdm: {},\\n    data: {}\\n  }).then(function(result) {\\n    handleResponseTokens(result); //custom method that processes response tokens, see definition example below\\n  });\\n\")), mdx(\"h3\", null, \"Recommendations\"), mdx(\"p\", null, \"Recommnedations entity data is sent as custom parameters in data object.\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Add \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"entity.id\"), \" and any other required \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"entity.\"), \" data to \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"data.__adobe.target\"), \" object.\")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"    alloy(\\\"sendEvent\\\", {\\n      renderDecisions: true,\\n      data: {\\n        __adobe: {\\n          target: {\\n            \\\"entity.id\\\": \\\"123\\\",\\n            \\\"entity.genre\\\": \\\"Drama\\\"\\n          }\\n        }\\n      }\\n    });\\n\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"See \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://experienceleague.adobe.com/docs/experience-platform/edge/personalization/adobe-target/target-overview.html?lang=en\"\n  }, \"documentation reference\"))), mdx(\"h3\", null, \"SPA Implementation\"), mdx(\"h4\", null, \"Target Views\"), mdx(\"p\", null, \"On the first \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"sendEvent()\"), \" call, all XDM Views that should be rendered to the end-user will be fetched and cached. Subsequent \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"sendEvent()\"), \" calls with XDM Views passed in will be read from the cache and rendered without a server call.\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Pass the view name and set to render decisions. \")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"    alloy(\\\"sendEvent\\\", {\\n      \\\"renderDecisions\\\": true, //<--\\n      \\\"xdm\\\": {\\n        \\\"web\\\": {\\n          \\\"webPageDetails\\\": {\\n            \\\"viewName\\\":\\\"home\\\" //<--\\n          }\\n        }\\n      }\\n    });\\n\")), mdx(\"h4\", null, \"Prefetch and Render Decisions\"), mdx(\"p\", null, \"There may be a case where we want to prefetch content and display on demand \"), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Prefetch and render decisions. \")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"alloy(\\\"sendEvent\\\", {\\n  renderDecisions: false,\\n}).then(function(result) {\\n  return alloy(\\\"applyPropositions\\\", {\\n    propositions: retrievedPropositions,\\n    metadata: getMetadata(scopes)\\n  }).then(function(applyPropositionsResult) {\\n    alloy(\\\"sendEvent\\\", { // Send the display notifications\\n      xdm: {\\n        eventType: \\\"decisioning.propositionDisplay\\\",\\n        _experience: {\\n          decisioning: {\\n            propositions: applyPropositionsResult.propositions\\n          }\\n        }\\n      }\\n    });\\n    handleResponseTokens(applyPropositionsResult);\\n  });\\n});\\n\\nfunction getMetadata(scopes){\\n  let metadata = {};\\n  scopes.forEach(function(scope){\\n    metadata[scope] = {\\n      selector: \\\"head\\\",\\n      actionType: \\\"appendHtml\\\"\\n    }\\n  });\\n  return metadata;\\n}\\n\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"See \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://experienceleague.adobe.com/docs/experience-platform/edge/personalization/adobe-target/spa-implementation.html?lang=en\"\n  }, \"documentation reference\"))), mdx(\"h4\", null, \"Prefetch View Scope and Send Notifications\"), mdx(\"p\", null, \"If decisions are not set to render, they are pre-fetched and we would need to apply content manually and send a display notification event.\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Display scope's content and send a notification event.\")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"function getContentForPropositions(data, props){\\n  let content = [];\\n  if (data.propositions) {\\n    data.propositions.forEach(proposition => {\\n      proposition.items.forEach(item => {\\n        if (item.schema === \\\"https://ns.adobe.com/personalization/html-content-item\\\") {\\n          content.push({\\n            scope: \\\"\\\",\\n          });\\n        }\\n      });\\n    });\\n\\n  }\\n  return content;\\n}\\n\\nalloy(\\\"sendEvent\\\", {\\n    xdm: {...},\\n    decisionScopes: [\\\"__view__\\\"]\\n  }).then(function(result) {\\n    getContentForPropositions(result, [\\\"myScope1\\\"]);\\n    if (result.propositions) {\\n      result.propositions.forEach(proposition => {\\n        proposition.items.forEach(item => {\\n          if (item.schema === HTML_SCHEMA) {\\n            // manually apply offer\\n            document.getElementById(\\\"form-based-offer-container\\\").innerHTML =\\n              item.data.content;\\n            const executedPropositions = [\\n              {\\n                id: proposition.id,\\n                scope: proposition.scope,\\n                scopeDetails: proposition.scopeDetails\\n              }\\n            ];\\n            // manually send the display notification event, so that Target/Analytics impressions are increased\\n            alloy(\\\"sendEvent\\\",{\\n              \\\"xdm\\\": {\\n                \\\"eventType\\\": \\\"decisioning.propositionDisplay\\\",\\n                \\\"_experience\\\": {\\n                  \\\"decisioning\\\": {\\n                    \\\"propositions\\\": executedPropositions\\n                  }\\n                }\\n              }\\n            });\\n          }\\n        });\\n      });\\n    }\\n  });\\n\")), mdx(\"h4\", null, \"Prefetch Custom Scopes, Send Notifications, Track Events or User Actions\"), mdx(\"p\", null, \"You can prefetch scopes, send notifications, track events and user actions by calling the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"sendEvent\"), \" command, populating the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"_experience.decisioning.propositions\"), \" XDM fieldgroup, and setting the eventType to one of 2 values:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"decisioning.propositionDisplay\"), \": Signals the rendering of the Target Activity.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"decisioning.propositionInteract\"), \": Signals a user interaction with the Activity, like a mouse click.\")), mdx(\"p\", null, \"Track a \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"decisioning.propositionDisplay\"), \" event after rendering an Activity\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"alloy(\\\"sendEvent\\\", {\\n  xdm: {},\\n  decisionScopes: ['discount']\\n}).then(function(result) {\\n  var propositions = result.propositions;\\n  var discountProposition;\\n  if (propositions) {\\n    // Find the discount proposition, if it exists.\\n    for (var i = 0; i < propositions.length; i++) {\\n      var proposition = propositions[i];\\n      if (proposition.scope === \\\"discount\\\") {\\n        discountProposition = proposition;\\n        break;\\n      }\\n    }\\n  }\\n  if (discountProposition) {\\n    // Find the item from proposition that should be rendered.\\n    // Rather than assuming there a single item that has HTML\\n    // content, find the first item whose schema indicates\\n    // it contains HTML content.\\n    for (var j = 0; j < discountProposition.items.length; j++) {\\n      var discountPropositionItem = discountProposition.items[i];\\n      if (discountPropositionItem.schema === \\\"https://ns.adobe.com/personalization/html-content-item\\\") {\\n        var discountHtml = discountPropositionItem.data.content;\\n        // Render the content\\n        var dailySpecialElement = document.getElementById(\\\"daily-special\\\");\\n        dailySpecialElement.innerHTML = discountHtml;\\n\\n        // For this example, we assume there is only a single place to update in the HTML.\\n        break;\\n      }\\n    }\\n    // Send a \\\"decisioning.propositionDisplay\\\" event signaling that the proposition has been rendered.\\n    alloy(\\\"sendEvent\\\", {\\n      xdm: {\\n        eventType: \\\"decisioning.propositionDisplay\\\",\\n        _experience: {\\n          decisioning: {\\n            propositions: [\\n              {\\n                id: discountProposition.id,\\n                scope: discountProposition.scope,\\n                scopeDetails: discountProposition.scopeDetails\\n              }\\n            ]\\n          }\\n        }\\n      }\\n    });\\n  }\\n});\\n\")), mdx(\"p\", null, \"Track a \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"decisioning.propositionInteract\"), \" event after a click metric occurs\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"\\nalloy(\\\"sendEvent\\\", {\\n  xdm: { ...},\\n  decisionScopes: [\\\"hero-banner\\\"]\\n}).then(function (result) {\\n  var propositions = result.propositions;\\n\\n  if (propositions) {\\n    // Find the discount proposition, if it exists.\\n    for (var i = 0; i < propositions.length; i++) {\\n      var proposition = propositions[i];\\n      for (var j = 0; j < proposition.items.length; j++) {\\n        var item = proposition.items[j];\\n\\n        if (item.schema === \\\"https://ns.adobe.com/personalization/measurement\\\") {\\n          // add metric to the DOM element\\n          const button = document.getElementById(\\\"form-based-click-metric\\\");\\n\\n          button.addEventListener(\\\"click\\\", event => {\\n            const executedPropositions = [\\n              {\\n                id: proposition.id,\\n                scope: proposition.scope,\\n                scopeDetails: proposition.scopeDetails\\n              }\\n            ];\\n            // send the click track event\\n            alloy(\\\"sendEvent\\\", {\\n              \\\"xdm\\\": {\\n                \\\"eventType\\\": \\\"decisioning.propositionInteract\\\",\\n                \\\"_experience\\\": {\\n                  \\\"decisioning\\\": {\\n                    \\\"propositions\\\": executedPropositions\\n                  }\\n                }\\n              }\\n            });\\n          });\\n        }\\n      }\\n    }\\n  }\\n});\\n\")), mdx(\"h4\", null, \"Send Order Confirmation\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"alloy(\\\"sendEvent\\\", {\\n  \\\"documentUnloading\\\": true, // sends as a beacon\\n  \\\"xdm\\\": {\\n    \\\"eventType\\\": \\\"commerce.purchases\\\",\\n    \\\"commerce\\\": {\\n      \\\"order\\\": {\\n        \\\"purchaseID\\\": \\\"a8g784hjq1mnp3\\\",\\n        \\\"purchaseOrderNumber\\\": \\\"VAU3123\\\",\\n        \\\"currencyCode\\\": \\\"USD\\\",\\n        \\\"priceTotal\\\": 999.98\\n      }\\n    }\\n  }\\n});\\n\")), mdx(\"h4\", null, \"Send the \", mdx(\"inlineCode\", {\n    parentName: \"h4\"\n  }, \"mbox3rdpartyId\"), \" to Target\"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Send a Third Party ID in Identity Map\")), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"    alloy(\\\"sendEvent\\\", {\\n      xdm: {\\n        \\\"identityMap\\\": {\\n          \\\"ID_NAMESPACE\\\": [\\n            {\\n              \\\"id\\\": \\\"1234\\\",\\n              \\\"authenticatedState\\\": \\\"authenticated\\\"\\n            }\\n          ]\\n        }\\n      }\\n    });\\n\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"See \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://experienceleague.adobe.com/docs/experience-platform/edge/personalization/adobe-target/using-mbox-3rdpartyid.html?lang=en\"\n  }, \"documentation reference\"))), mdx(\"h4\", null, \"Analytics A4T Integration\"), mdx(\"p\", null, \"The Adobe Experience Platform Web SDK supports two types of Analytics logging for Analytics for Target (A4T) use cases:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Server-side Analytics logging\\tAll Analytics hits sent through the Edge Network are augmented with Target details on the server side, without having to go through the hit stitching process.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Client-side Analytics logging\\tTarget data is returned on the client side, allowing you to manually augment and send data to Analytics using the Data Insertion API.\")), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Confirm Analytics integration is set up and configured. This requires no further implementaiton work for A4T.\\nOtherwise, refer to documentation below to configure it manually if no Analytics set up.\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"See \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://experienceleague.adobe.com/docs/experience-platform/edge/personalization/adobe-target/a4t/overview.html?lang=en\"\n  }, \"documentation reference\"))), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://experienceleague.adobe.com/docs/experience-platform/edge/personalization/adobe-target/a4t/client-side.html?lang=en\"\n  }, \"Manual A4T setup\"))), mdx(\"h4\", null, \"Modify Event Data Before Send\"), mdx(\"p\", null, \"If you want to add, remove, or modify fields from the event globally, you can configure an onBeforeEventSend callback. This callback is called every time an event is sent. This callback is passed in an event object with an xdm field. Modify content.xdm to change the data that is sent with the event.\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"alloy(\\\"configure\\\", {\\n  \\\"edgeConfigId\\\": \\\"ebebf826-a01f-4458-8cec-ef61de241c93\\\",\\n  \\\"orgId\\\": \\\"ADB3LETTERSANDNUMBERS@AdobeOrg\\\",\\n  \\\"onBeforeEventSend\\\": function(content) {\\n    // ignores events from bots\\n    if (MyBotDetector.isABot()) {\\n      return false;\\n    }\\n    // Change existing values\\n    content.xdm.web.webPageDetails.URL = xdm.web.webPageDetails.URL.toLowerCase();\\n    // Remove existing values\\n    delete content.xdm.web.webReferrer.URL;\\n    // Or add new values\\n    content.xdm._adb3lettersandnumbers.mycustomkey = \\\"value\\\";\\n    //sets a query parameter in XDM\\n    const queryString = window.location.search;\\n    const urlParams = new URLSearchParams(queryString);\\n    content.xdm.marketing.trackingCode = urlParams.get('cid')\\n  }\\n});\\n\")), mdx(\"h3\", null, \"Cleanup\"), mdx(\"p\", null, \"Remove at.js JavaScript library if previously used and any references to at.js API functions. \"), mdx(\"table\", null, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \":point_right: Checklist\")))), mdx(\"ol\", {\n    \"className\": \"contains-task-list\"\n  }, mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Remove \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"at.js\"), \" code\"), mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Remove \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"adobe.targe.getOffers\"), \" and/or \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"adobe.targe.getOffer\"), \" if any\"), mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Remove \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"adobe.target.trackEvent\"), \" if any\"), mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Remove \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"window.targetGlobalSettings\"), \" if any\"), mdx(\"li\", {\n    parentName: \"ol\",\n    \"className\": \"task-list-item\"\n  }, mdx(\"input\", {\n    parentName: \"li\",\n    \"type\": \"checkbox\",\n    \"checked\": false,\n    \"disabled\": true\n  }), \" \", \"Remove \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"window.targetPageParams\"), \" and/or \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"window.targetPageParamsAll\"), \" if any\")));\n}\n;\nMDXContent.isMDXComponent = true;","excerpt":"Web SDK and Adobe Target Migration Quickstart This guide assumes familiarity with: Adobe Target HTML and JavaScript This guide requires…","timeToRead":5,"banner":{"childImageSharp":{"resize":{"src":"/static/61c5acdb62f84403e03105a38d463ca2/a6c62/labyrinth.jpg"}}}}},"pageContext":{"slug":"/web-sdk-target-migration-quickstart","formatString":"DD.MM.YYYY"}},
    "staticQueryHashes": ["2744905544","3090400250","318001574"]}