Instalación del SDK web installing-the-sdk
Existen tres formas compatibles de instalar el SDK web de Adobe Experience Platform:
- La forma preferida de utilizar el SDK web de Adobe Experience Platform es mediante la IU de recopilación de datos o la IU del Experience Platform.
- El SDK web de Adobe Experience Platform también está disponible en una red de distribución de contenido (CDN) que puede utilizar.
- Utilice la biblioteca NPM que exporta los módulos EcmaScript 5 y EcmaScript 2015 (ES6).
Opción 1: Instalación de la extensión de etiqueta
Para obtener documentación sobre la extensión de etiqueta, consulte la Documentación de etiquetas
Opción 2: instalar la versión independiente prediseñada
La versión prediseñada está disponible en una CDN. Puede hacer referencia a la biblioteca en la CDN directamente en la página o descargarla y alojarla en su propia infraestructura. Está disponible en formatos minificado y no minificado. La versión no minificada es útil para la depuración.
Estructura de la URL: https://cdn1.adoberesources.net/alloy/[VERSIÓN]/alloy.min.js o alloy.js para la versión no minificada.
Por ejemplo:
Adición del código adding-the-code
La versión independiente creada previamente requiere un "código base" añadido directamente a la página. Copie y pegue el siguiente "código base" lo más alto posible en la <head> de su HTML:
<script>
!function(n,o){o.forEach(function(o){n[o]||((n.__alloyNS=n.__alloyNS||
[]).push(o),n[o]=function(){var u=arguments;return new Promise(
function(i,l){n[o].q.push([i,l,u])})},n[o].q=[])})}
(window,["alloy"]);
</script>
<script src="https://cdn1.adoberesources.net/alloy/2.14.0/alloy.min.js" async></script>
El "código base" crea una función global denominada alloy. Utilice esta función para interactuar con el SDK. Si desea asignar otro nombre a la función global, cambie el alloy nombrar como sigue:
<script>
!function(n,o){o.forEach(function(o){n[o]||((n.__alloyNS=n.__alloyNS||
[]).push(o),n[o]=function(){var u=arguments;return new Promise(
function(i,l){n[o].q.push([i,l,u])})},n[o].q=[])})}
(window,["mycustomname"]);
</script>
<script src="https://cdn1.adoberesources.net/alloy/2.14.0/alloy.min.js" async></script>
En este ejemplo, se cambia el nombre de la función global mycustomname, en lugar de alloy.
window.Este código base, además de crear una función global, también carga código adicional contenido en un archivo externo (alloy.js) alojado en un servidor. De forma predeterminada, este código se carga asincrónicamente para permitir que la página web tenga el mayor rendimiento posible. Esta es la implementación recomendada.
Compatibilidad con Internet Explorer support-internet-explore
Este SDK utiliza promesas, que son un método de comunicación de la finalización de tareas asincrónicas. El Promesa La implementación utilizada por el SDK es compatible de forma nativa con todos los navegadores de destino, excepto Internet Explorer. Para usar el SDK en Internet Explorer, debe tener window.Promise polillenado.
Para determinar si ya tiene window.Promise polillenado:
- Abra el sitio web en Internet Explorer.
- Abra la consola de depuración del explorador.
- Tipo
window.Promiseen la consola y pulse Intro.
Si algo distinto de undefined aparece, probablemente ya haya rellenado correctamente window.Promise. Otra forma de determinar si window.Promise es polyfill es cargando su sitio web después de haber completado las instrucciones de instalación anteriores. Si el SDK genera un error al mencionar algo sobre una promesa, es probable que no haya rellenado correctamente window.Promise.
Si ha determinado que debe rellenar políticamente window.Promise, incluya la siguiente etiqueta de script encima del código base proporcionado anteriormente:
<script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.min.js"></script>
Esta etiqueta carga una secuencia de comandos que garantiza que window.Promise es una implementación de Promise válida.
Promise.prototype.finally.Carga sincrónica del archivo JavaScript loading-javascript-synchronously
Como se explica en la sección Adición del código, el código base que ha copiado y pegado en el HTML del sitio web carga un archivo externo. El archivo externo contiene la funcionalidad principal del SDK. Cualquier comando que intente ejecutar mientras se carga este archivo se pone en cola y se procesa después de cargar el archivo. La carga asíncrona del archivo es el método de instalación más eficaz.
En determinadas circunstancias, sin embargo, es posible que desee cargar el archivo sincrónicamente. Al hacerlo, el explorador impide que analice y procese el resto del documento del HTML hasta que se haya cargado y ejecutado el archivo externo. Normalmente no se recomienda este retraso adicional antes de mostrar el contenido principal a los usuarios, pero puede tener sentido según las circunstancias.
Para cargar el archivo sincrónicamente en lugar de asincrónicamente, quite el async atributo del segundo script como se muestra a continuación:
<script>
!function(n,o){o.forEach(function(o){n[o]||((n.__alloyNS=n.__alloyNS||
[]).push(o),n[o]=function(){var u=arguments;return new Promise(
function(i,l){n[o].q.push([i,l,u])})},n[o].q=[])})}
(window,["alloy"]);
</script>
<script src="https://cdn1.adoberesources.net/alloy/2.14.0/alloy.min.js"></script>
Opción 3: Uso del paquete NPM
El SDK web de Adobe Experience Platform también está disponible como paquete NPM. NPM es el administrador de paquetes para JavaScript. La instalación del paquete NPM permite controlar el proceso de compilación para el JavaScript del SDK web de Adobe Experience Platform. El paquete NPM expone módulos EcmaScript versión 5 o módulos EcmaScript versión 2015 (ES6) pensados para ejecutarse en el navegador.
npm install @adobe/alloy
El paquete NPM del SDK web de Adobe Experience Platform expone un createInstance función. Esta función se utiliza para crear una instancia de. La opción de nombre pasada a la función controla el prefijo utilizado en el registro. A continuación se muestran ejemplos de uso del paquete.
Uso del paquete como módulo ECMAScript 2015 (ES6)
import { createInstance } from "@adobe/alloy";
const alloy = createInstance({ name: "alloy" });
alloy("config", { ... });
alloy("sendEvent", { ... });
Uso del paquete como módulo ECMAScript 5
var alloyLibrary = require("@adobe/alloy");
var alloy = alloyLibrary.createInstance({ name: "alloy" });
alloy("config", { ... });
alloy("sendEvent", { ... });
Compatibilidad con Internet Explorer
El SDK de Adobe Experience Platform utiliza promesas, que son un método de comunicación de la finalización de tareas asincrónicas. El Promesa La implementación utilizada por el SDK es compatible de forma nativa con todos los navegadores de destino, excepto Internet Explorer. Para usar el SDK en Internet Explorer, debe tener window.Promise polillenado.
Una biblioteca que podría usar para polyfill promise es promise-polyfill. Consulte la documentación de promise-polyfill para obtener más información sobre cómo instalar con NPM.
Promise.prototype.finally.