Saltar al contenido

SDK de Web Push 3.0

Integración

Anchor link to

Ejemplo de integración en GitHub

Obtenga el SDK de Web Push de Pushwoosh y descomprímalo. Debería tener los siguientes archivos:

Anchor link to
  • pushwoosh-service-worker.js

Coloque todos estos archivos en el directorio raíz de nivel superior de su sitio web.

Anchor link to

Inicialice el SDK:

Anchor link to
  1. Incluya el SDK desde nuestro CDN de forma asíncrona.
<script type="text/javascript" src="//cdn.pushwoosh.com/webpush/v3/pushwoosh-web-notifications.js" async></script>
  1. Inicialice el SDK de Web Push y asegúrese de poner en cola la inicialización hasta el momento en que el SDK esté completamente cargado.
<script type="text/javascript">
var Pushwoosh = Pushwoosh || [];
Pushwoosh.push(['init', {
logLevel: 'info', // valores posibles: error, info, debug
applicationCode: 'XXXXX-XXXXX', // el código de su aplicación desde el Panel de Control de Pushwoosh
apiToken: 'XXXXXXX', // Token de API de dispositivo
safariWebsitePushID: 'web.com.example.domain', // cadena de dominio inverso única, obtenida en su Portal de Desarrolladores de Apple. Solo es necesario si envía notificaciones push al navegador Safari
defaultNotificationTitle: 'Pushwoosh', // establece un título predeterminado para las notificaciones push
defaultNotificationImage: 'https://yoursite.com/img/logo-medium.png', // URL a la imagen de notificación personalizada
autoSubscribe: false, // o true. Si es true, solicita a un usuario que se suscriba a las notificaciones push al inicializar el SDK
subscribeWidget: {
enable: true
},
userId: 'user_id', // opcional, establezca un ID de usuario personalizado
tags: {
'Name': 'John Smith' // opcional, establezca Tags personalizados
}
}]);
</script>

Popups web

Anchor link to

Añada webPopups a su objeto init para habilitar las campañas de popups web en su sitio.

webPopups: {
enable: true,
autoShow: true, // opcional, establezca en false para cargar los popups sin mostrarlos automáticamente — consulte los métodos de WebPopups a continuación
},

Las campañas de popups web muestran superposiciones que usted configura en el Panel de Control, como promociones, anuncios o formularios de captación de clientes potenciales. A diferencia del popup de suscripción personalizado (subscribePopup), que solo gestiona la suscripción a notificaciones push web, las campañas de popups web pueden mostrar cualquier contenido que usted configure. Para la configuración en el Panel de Control, consulte Entender los popups web.

Para el control programático, consulte los métodos de WebPopups y los eventos de popups web.

Botón de suscripción a notificaciones push

Anchor link to

Para solicitar a sus usuarios que se suscriban a las notificaciones push, recomendamos implementar un botón de suscripción a notificaciones push en su sitio web. ¡Mejore la experiencia del usuario y consiga más suscriptores!

Configuración

Anchor link to

Para terminar de implementar las notificaciones push en su sitio web, necesita configurar las plataformas web en su Panel de Control de Pushwoosh siguiendo nuestras guías paso a paso:

Registrar el service worker en un ámbito diferente

Anchor link to

A veces no se puede colocar el archivo del service worker en un directorio raíz de un sitio web, sino en un subdirectorio.

En este caso, modifique la configuración (paso 4.3) añadiendo un parámetro

serviceWorkerUrl: “/push-notifications/pushwoosh-service-worker.js”

donde /push-notifications/pushwoosh-service-worker.js es la ruta al archivo pushwoosh-service-worker.js.

Manejadores de eventos

Anchor link to

En el SDK de Web de Pushwoosh 3.0 puede suscribirse a ciertos eventos para rastrearlos**,** o darse de baja de los eventos si ya no necesita rastrearlos.

Para rastrear la carga del SDK de Web 3.0, dispare el evento onLoad de la siguiente manera:

// Evento de carga
Pushwoosh.push(['onLoad', (api) => {
console.log('Pushwoosh load!');
}]);

Para rastrear la inicialización correcta del SDK de Web, dispare el evento onReady:

// Evento de listo
Pushwoosh.push((api) => {
console.log('Pushwoosh ready!');
});

Para suscribirse o darse de baja de cualquiera de los eventos del SDK, utilice los manejadores después de la carga del SDK:

Pushwoosh.push(['onLoad', (api) => {
function onEventNameHandler() {
console.log('Triggered event: event-name!');
}
// Para suscribirse a un evento:
Pushwoosh.addEventHandler('event-name', onEventNameHandler)
// Para darse de baja de un evento:
Pushwoosh.removeEventHandler('event-name', onEventNameHandler)
}]);

Eventos del SDK

Anchor link to

Evento de suscripción

Anchor link to

Se ejecuta después de que un usuario acepte recibir notificaciones push.

Pushwoosh.push(['onLoad', (api) => {
Pushwoosh.addEventHandler('subscribe', (payload) => {
console.log('Triggered event: subscribe');
});
}]);

Evento de cancelación de suscripción

Anchor link to

Se ejecuta después de que un dispositivo se da de baja de las notificaciones.

Pushwoosh.push(['onLoad', (api) => {
Pushwoosh.addEventHandler('unsubscribe', (payload) => {
console.log('Triggered event: unsubscribe');
});
}]);

Eventos del widget de suscripción

Anchor link to

Rastrea la visualización de un widget de Solicitud de Suscripción.

Pushwoosh.push(['onLoad', (api) => {
// Se ejecuta al mostrar el widget de Solicitud de Suscripción
Pushwoosh.addEventHandler('show-subscription-widget', (payload) => {
console.log('Triggered event: show-subscription-widget');
});
// Se ejecuta al ocultar el widget de Solicitud de Suscripción
Pushwoosh.addEventHandler('hide-subscription-widget', (payload) => {
console.log('Triggered event: hide-subscription-widget');
});
}]);

Eventos del diálogo de permiso de notificación

Anchor link to

Rastrea la visualización del diálogo de suscripción nativo.

Pushwoosh.push(['onLoad', function (api) {
// Se ejecuta al mostrar el diálogo de permiso
Pushwoosh.addEventHandler('show-notification-permission-dialog', (payload) => {
console.log('Triggered event: show-notification-permission-dialog');
});
// Se ejecuta al ocultar el diálogo de permiso con uno de los tres estados posibles:
// 1. default - el diálogo se cierra
// 2. granted - se concede el permiso
// 3. denied - se deniega el permiso
Pushwoosh.addEventHandler('hide-notification-permission-dialog', (payload) => {
console.log('Triggered event: hide-notification-permission-dialog', payload.permission);
});
}]);

Eventos de permiso

Anchor link to

Comprueba el estado del permiso de notificaciones push en la inicialización del SDK; rastrea la actualización de este estado cada vez que se produce.

Pushwoosh.push(['onLoad', (api) => {
// Se ejecuta durante la inicialización del SDK si 'autoSubscribe: false' y/o si un usuario ignora una solicitud de notificación push.
Pushwoosh.addEventHandler('permission-default', (payload) => {
console.log('Triggered event: permission-default');
});
// Se ejecuta durante la inicialización del SDK si las notificaciones están bloqueadas o una vez que un usuario bloquea las notificaciones push.
Pushwoosh.addEventHandler('permission-denied', (payload) => {
console.log('Triggered event: permission-denied');
});
// Se ejecuta durante la inicialización del SDK si las notificaciones están permitidas o una vez que un usuario permite las notificaciones push.
Pushwoosh.addEventHandler('permission-granted', (payload) => {
console.log('Triggered event: permission-granted');
});
}]);

Evento de recepción de push

Anchor link to

Rastrea la entrega de notificaciones push a un dispositivo.

Pushwoosh.push(['onLoad', (api) => {
// Se ejecuta cuando se muestra una notificación push.
Pushwoosh.addEventHandler('receive-push', (payload) => {
console.log('Triggered event: receive-push', payload.notification);
});
}]);

Eventos de notificación

Anchor link to

Rastrea si una notificación push es abierta o cerrada por un usuario.

Pushwoosh.push(['onLoad', (api) => {
// Se ejecuta cuando un usuario hace clic en una notificación.
Pushwoosh.addEventHandler('open-notification', (payload) => {
console.log('Triggered event: open-notification', payload.notification);
});
// Se ejecuta cuando un usuario cierra una notificación push.
Pushwoosh.addEventHandler('hide-notification', (payload) => {
console.log('Triggered event: hide-notification', payload.notification);
});
}]);

Eventos de la bandeja de entrada

Anchor link to

Rastrea las notificaciones enviadas a la bandeja de entrada.

Pushwoosh.push(['onLoad', (api) => {
// Ejecutado por el ServiceWorker después de que el Mensaje de la Bandeja de Entrada se recibe y se guarda en indexedDB.
Pushwoosh.addEventHandler('receive-inbox-message', (payload) => {
console.log('Triggered event: receive-inbox-message', payload.message);
});
// Se ejecuta después de que la Bandeja de Entrada se actualiza automáticamente mientras la página se está cargando.
Pushwoosh.addEventHandler('update-inbox-messages', (payload) => {
console.log('Triggered event: receive-inbox-message', payload.messages);
});
}]);

Eventos del popup de suscripción personalizado

Anchor link to

Para obtener detalles sobre cómo manejar los eventos del popup de suscripción personalizado, consulte la Guía de Eventos del Popup de Suscripción Personalizado.

Eventos de popups web

Anchor link to
Pushwoosh.push(['onLoad', (api) => {
// Se ejecuta una vez que los popups web se han cargado y el pipeline de visualización automática se ha ejecutado para la página actual
Pushwoosh.addEventHandler('web-popups-ready', () => {
console.log('Triggered event: web-popups-ready');
});
// Se ejecuta cuando se muestra un popup web, ya sea automáticamente o a través de webPopups.show()
Pushwoosh.addEventHandler('show-web-popup', (payload) => {
console.log('Triggered event: show-web-popup', payload.code, payload.trigger); // disparador: 'auto' | 'api'
});
// Se ejecuta cuando se oculta un popup web
Pushwoosh.addEventHandler('hide-web-popup', (payload) => {
console.log('Triggered event: hide-web-popup', payload.code, payload.reason); // motivo: 'user' | 'api' | 'preempted'
});
}]);

Después de inicializar el SDK de Web Push, puede realizar las siguientes llamadas a la API de Pushwoosh. Todos los métodos devuelven objetos Promise.

Pushwoosh.push((api) => {
// Establecer tags para un usuario
api.setTags({
'Tag Name 1': 'value1',
'Tag Name 2': 'value2'
});
// Obtener tags para un usuario desde el servidor
api.getTags();
// Registrar ID de usuario
api.registerUser('user123');
// Registrar correo electrónico del usuario
api.registerEmail('user@example.com');
// Registrar número de SMS
api.registerSmsNumber('+15551234567');
// Registrar número de WhatsApp
api.registerWhatsappNumber('+1234567890');
// Publicar un Evento
api.postEvent('myEventName', {attributeName: 'attributeValue'});
// Darse de baja de las notificaciones
api.unregisterDevice();
// Establecer el idioma del dispositivo (sobrescribe el valor en el Tag "Language")
api.setLanguage('es');
// Alternativamente, registrar múltiples dispositivos y canales para un usuario
api.multiRegisterDevice({
user_id: 'user123',
email: 'user@example.com',
sms_phone_number: '+1234567890',
tags: {
'UserType': { operation: TTagOperationSet, value: 'Premium' },
'Interests': { operation: TTagOperationAppend, values: ['sports', 'technology'] }
}
});
});

multiRegisterDevice

Anchor link to

Método de registro mejorado que permite registrar un perfil de usuario con múltiples dispositivos y canales de mensajería en una sola llamada a la API. Este método es particularmente útil para aplicaciones multiplataforma o al implementar estrategias de mensajería omnicanal.

Pushwoosh.push((api) => {
api.multiRegisterDevice({
user_id: 'user123', // Opcional: Identificador de usuario
email: 'user@example.com', // Opcional: Correo electrónico para mensajería por email
sms_phone_number: '+1234567890', // Opcional: Número de teléfono SMS (formato E.164)
whatsapp_phone_number: '+1234567890', // Opcional: Número de WhatsApp (formato E.164)
kakao_phone_number: '+1234567890', // Opcional: Número de KakaoTalk (formato E.164)
language: 'en', // Opcional: Código de idioma (ISO 639-1)
timezone: 'America/New_York', // Opcional: Identificador de zona horaria
city: 'New York', // Opcional: Ciudad para segmentación
country: 'US', // Opcional: País para segmentación
state: 'NY', // Opcional: Estado para segmentación
tags: { // Opcional: Valores de Tag con operaciones
'UserType': {
operation: TTagOperationSet, // Establecer valor de Tag (0)
value: 'Premium'
},
'Interests': {
operation: TTagOperationAppend, // Añadir al valor de Tag (1)
values: ['sports', 'technology']
},
'LoginCount': {
operation: TTagOperationIncrement, // Incrementar valor de Tag (3)
value: '1'
}
},
push_devices: [ // Opcional: Array de dispositivos push
{
hwid: 'web-device-456',
platform: TPlatformChrome, // Plataforma Chrome (11)
push_token: 'fcm-token-here',
app_version: '2.1.0',
platformData: {
public_key: 'web-push-public-key',
auth_token: 'web-push-auth-token',
browser: 'chrome'
}
}
]
})
.then((response) => {
console.log('Multi-registration successful:', response);
})
.catch((error) => {
console.error('Multi-registration failed:', error);
});
});

Tipos de plataforma:

  • TPlatformSafari (10): Plataforma Safari
  • TPlatformChrome (11): Plataforma Chrome
  • TPlatformFirefox (12): Plataforma Firefox

Tipos de operación de Tag:

  • TTagOperationSet (0): Establecer valor de Tag (reemplaza el valor existente)
  • TTagOperationAppend (1): Añadir al valor de Tag (añadir a la lista)
  • TTagOperationRemove (2): Eliminar valor de Tag (eliminar de la lista)
  • TTagOperationIncrement (3): Incrementar valor de Tag (incremento numérico)

Beneficios:

  • Llamada única a la API: Registre múltiples dispositivos y canales a la vez
  • Operación atómica: Todos los registros tienen éxito o fallan juntos
  • Centrado en el usuario: Asocia todos los dispositivos con un único perfil de usuario
  • Etiquetado avanzado: Admite operaciones de Tag complejas
  • Multiplataforma: Maneje múltiples plataformas simultáneamente

Ejemplo de envío de Tags a Pushwoosh:

Pushwoosh.push((api) => {
var myCustomTags = {
'Tag 1': 123,
'Tag 2': 'some string'
};
api.setTags(myCustomTags)
.then((res) => {
var skipped = res && res.skipped || [];
if (!skipped.length) {
console.log('success');
}
else {
console.warn('skipped tags:', skipped);
}
})
.catch((err) => {
console.error('setTags error:', err);
});
});

Incrementar valor de Tag

Anchor link to

Para incrementar un valor de un Tag numérico, utilice el parámetro operation con el valor ‘increment’ de la siguiente manera:

Pushwoosh.push((api) => {
api.setTags({
'Tag 1': {
operation: 'increment',
value: 1
}
})
});

Añadir valores de Tag

Anchor link to

Para añadir nuevos valores al Tag de lista existente, utilice el parámetro operation con el valor ‘append’ de la siguiente manera:

Pushwoosh.push((api) => {
api.setTags({
'Tag 3': {
operation: 'append',
value: ['Value3']
}
})
});

Eliminar valor de Tag

Anchor link to

Para eliminar un valor de un Tag de lista, utilice el parámetro operation con el valor ‘remove’ de la siguiente manera:

Pushwoosh.push((api) =>{
api.setTags({
'Tag 3': {
operation: 'remove',
value: ['Value2']
}
})
});

Métodos públicos

Anchor link to

Pushwoosh.subscribe()

Este método se utiliza para solicitar el permiso de un usuario para las notificaciones push. Si un usuario ya está suscrito, el método dejará de ejecutarse.

Si un usuario aún no se ha suscrito a las notificaciones push:

1. Se solicita el permiso para las notificaciones push.

2. Si un usuario permite las notificaciones, se dispara el evento onSubscribe.

Pushwoosh.subscribe() se ejecuta automáticamente si se establece autoSubscribe: true. durante la inicialización del SDK.

Llame a este método si ha elegido solicitar manualmente a un usuario que se suscriba a las notificaciones push utilizando el parámetro autoSubscribe: false durante la inicialización:

<button onclick="Pushwoosh.subscribe()">Suscribirse</button>
<script>
Pushwoosh.push(['onSubscribe', (api) => {
console.log('User successfully subscribed');
}]);
</script>

Pushwoosh.unsubscribe()

  1. Se ejecuta el método /unregisterDevice.
  2. Se dispara el evento onUnsubscribe.
<button onclick="Pushwoosh.unsubscribe()">Darse de baja</button>
<script type="text/javascript">
Pushwoosh.push(['onUnsubscribe', (api) => {
console.log('User successfully unsubscribed');
}]);
</script>

Pushwoosh.isSubscribed()

Comprueba si un usuario está suscrito y devuelve un indicador true/false.

Pushwoosh.isSubscribed().then((isSubscribed) => {
console.log('isSubscribed', isSubscribed);
});

Pushwoosh.getHWID()

Devuelve el HWID de Pushwoosh.

Pushwoosh.getHWID().then((hwid) => {
console.log('hwid:', hwid);
});

Pushwoosh.getPushToken()

Devuelve el token de push si está disponible.

Pushwoosh.getPushToken().then((pushToken) => {
console.log('pushToken:', pushToken);
});

Pushwoosh.getUserId()

Devuelve el ID de Usuario si está disponible.

Pushwoosh.getUserId().then((userId) => {
console.log('userId:', userId);
});

Pushwoosh.getParams()

Devuelve una lista de los siguientes parámetros:

Pushwoosh.getParams().then((params) => {
params = params || {};
var hwid = params.hwid;
var pushToken = params.pushToken;
var userId = params.userId;
});

Pushwoosh.isAvailableNotifications()

Comprueba si un navegador es compatible con el WebSDK 3.0 de Pushwoosh, devuelve ‘true’ o ‘false’.

Pushwoosh.isAvailableNotifications() // true/false

Métodos de InboxMessages

Anchor link to

messagesWithNoActionPerformedCount(): Promise<number>

Devuelve el número de mensajes abiertos.

Pushwoosh.pwinbox.messagesWithNoActionPerformedCount()
.then((count) => {
console.log(`${count} messages opened`);
});

unreadMessagesCount()

Devuelve el número de mensajes no leídos.

Pushwoosh.pwinbox.unreadMessagesCount()
.then((count) => {
console.log(`${count} messages unread`);
});

messagesCount(): Promise<number>

Devuelve el número total de mensajes.

Pushwoosh.pwinbox.messagesCount()
.then((count) => {
console.log(`${count} messages`);
});

loadMessages(): Promise<Array>

Carga la lista de mensajes no eliminados.

Pushwoosh.pwinbox.loadMessages()
.then(() => {
console.log('Messages have been loaded');
});

readMessagesWithCodes(codes: Array<string>): Promise<void>

Marca los mensajes como leídos por Inbox_Ids.

Pushwoosh.pwinbox.readMessagesWithCodes(codes)
.then(() => {
console.log('Messages have been read');
});

performActionForMessageWithCode(code: string): Promise<void>

Realiza la acción asignada a un mensaje y marca el mensaje como leído.

Pushwoosh.pwinbox.performActionForMessageWithCode(code)
.then(() => {
console.log('Action has been performed');
});

deleteMessagesWithCodes(codes: Array<string>): Promise<void>

Marca los mensajes como eliminados.

Pushwoosh.pwinbox.deleteMessagesWithCodes([code])
.then(() => {
console.log('Messages have been deleted');
});

syncMessages(): Promise<void>

Sincroniza los mensajes con el servidor.

Pushwoosh.pwinbox.syncMessages()
.then(() => {
console.log('Messages have been synchronized');
});

Métodos de WebPopups

Anchor link to

La API programática de popups web requiere webPopups: {enable: true} en el objeto init; está disponible a través de Pushwoosh.moduleRegistry.webPopups una vez que se ha disparado el evento web-popups-ready.

show(code: string): Promise<boolean>

Muestra un popup inmediatamente, omitiendo todas las condiciones de visualización (retraso, reglas de página, tipo de dispositivo/visitante, limitación de frecuencia, tipo de disparador). Cierra un popup ya visible para hacer espacio. Resuelve a false en lugar de rechazar cuando el popup no se puede mostrar.

Pushwoosh.moduleRegistry.webPopups.show('popup_code')
.then((shown) => console.log('Popup shown:', shown));

hide(code?: string): boolean

Oculta el popup visible. Si se pasa code, solo lo oculta cuando coincide con el popup visible. Devuelve false si no se ocultó nada.

Pushwoosh.moduleRegistry.webPopups.hide();

hideAll(): boolean

Oculta el popup visible y descarta todo lo que aún esté pendiente para la carga de la página actual. show() sigue funcionando después.

Pushwoosh.moduleRegistry.webPopups.hideAll();

isVisible(code?: string): boolean

Comprueba si un popup está visible actualmente. Sin code, comprueba si algún popup está visible.

Pushwoosh.moduleRegistry.webPopups.isVisible('popup_code');

getVisibleCode(): string | null

Devuelve el código del popup actualmente en pantalla, o null si no hay ninguno visible.

Pushwoosh.moduleRegistry.webPopups.getVisibleCode();

getAvailableCodes(): Array<string>

Devuelve los códigos de cada popup que el servidor devolvió para este dispositivo.

Pushwoosh.moduleRegistry.webPopups.getAvailableCodes();

getState(): object

Devuelve una instantánea del estado del popup web: visible (código en pantalla, o null), queued (códigos en espera del espacio de visualización), waiting (códigos con un temporizador de retraso activado) y available (todos los códigos que el servidor devolvió).

Pushwoosh.moduleRegistry.webPopups.getState();

Soporte para Progressive Web App

Anchor link to

Para integrar Pushwoosh en su Progressive Web Application (PWA), siga los pasos que se describen a continuación.

1. Copie la ruta a su archivo de Service Worker:

if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/service-worker.js') // <- la URL de su service worker
});
}

Luego, use el parámetro serviceWorkerUrl al inicializar el WebSDK de la siguiente manera:

var Pushwoosh = Pushwoosh || [];
Pushwoosh.push(['init', {
logLevel: 'error',
applicationCode: 'XXXXX-XXXXX',
safariWebsitePushID: 'web.com.example.domain',
defaultNotificationTitle: 'Pushwoosh',
defaultNotificationImage: 'https://yoursite.com/img/logo-medium.png',
serviceWorkerUrl: '/service-worker.js', // <- la URL de su service worker
}]);

El WebSDK no registra el nuevo Service Worker inmediatamente; un Service Worker se registra cuando es necesario:

  • cuando un dispositivo recibe un token de push (en el registro del dispositivo o en la re-suscripción),
  • cuando se elimina un token de push (al eliminar un dispositivo de la base de usuarios).

Acelera la carga de sus páginas al reducir el número de solicitudes al servidor.

Los navegadores no permiten que se registren dos Service Workers diferentes al mismo tiempo (lea más: https://github.com/w3c/ServiceWorker/issues/921), por lo que para que su PWA funcione correctamente, se debe registrar un Service Worker común para su base de código y la base de código de Pushwoosh.

2. Añada la siguiente cadena a su Service Worker (al principio o al final, no importa):

importScripts('https://cdn.pushwoosh.com/webpush/v3/pushwoosh-service-worker.js' + self.location.search);

De este modo, habilita la recepción y el procesamiento de las notificaciones push enviadas a través de los servicios de Pushwoosh para su Service Worker.

Instalación desde Google Tag Manager

Anchor link to

Use el siguiente código en su Google Tag Manager para inicializar el SDK de Pushwoosh. Cree una etiqueta HTML personalizada y pegue el código a continuación. Asegúrese de cambiar su Código de Aplicación de Pushwoosh, el ID de Sitio Web de Safari y la URL de la imagen de notificación predeterminada.
También establezca una prioridad alta de Activación de Etiqueta (ej: 100) y actívela en Todas las Páginas. Vea una captura de pantalla a continuación.Copiar

<script type="text/javascript" src="//cdn.pushwoosh.com/webpush/v3/pushwoosh-web-notifications.js" async></script>
<script type="text/javascript">
var Pushwoosh = Pushwoosh || [];
Pushwoosh.push(['init', {
logLevel: 'error',
applicationCode: 'XXXXX-XXXXX',
safariWebsitePushID: 'web.com.example.domain',
defaultNotificationTitle: 'Pushwoosh',
defaultNotificationImage: 'https://yoursite.com/img/logo-medium.png',
autoSubscribe: true,
subscribeWidget: {
enable: false
},
userId: 'user_id'
}]);
</script>