Integra Oct8ne con tu APP mobile (mediante webviews)

Estas instrucciones van dirigidas a personas con un mínimo conocimiento de lenguaje de programación web:  HTML y JAVASCRIPT .  Si no es tu caso, recomendamos que te pongas en contacto con tus desarrolladores y les facilites estas instrucciones. La instalación será muy fácil para ellos. 

Integración Oct8ne con webviews

Funcionamiento básico 

En apps móviles basadas en un webview que contenga la web del cliente podemos mostrar el chat de Oct8ne, ya sea utilizando el widget en la web del cliente que se lanza dentro del webview, o abriendo una nueva página en blanco con el código de Oct8ne.

Si existen algunas páginas propias de la aplicación, que no contienen el iframe con la página del cliente, sino que son vistas propias de la app, se puede añadir un Call to Action (botón, link, etc), que permita la carga de Oct8ne.

Por defecto, Oct8ne no permite mostrarse dentro de iframes, a menos que lleven un parametro addicional. Dentro de tu webview, en la URL del iframe deberás añadir el querystring 'customApp=2', para permitir que se pueda mostrar.

La comunicación entre la webview y el iframe que contiene Oct8ne se realiza mediante eventos 'postMessage' de Javascript.

Comunicación

1.- Entrante: Al clicar el 'Call to action' en el webview.
La aplicación debe detectar si la página contiene el iframe con la página del cliente o no, y realiza las siguientes acciones:

- En las páginas que contienen el iframe de la web se envía un evento:

IFRAME.contentWindow.postMessage("OCT8NEOPEN,Webview","*");

* La API de Oct8ne recibe este evento y dependiendo del estado en el que se encuentre el coviewer de Oct8ne, lo crea, maximiza o minimiza.

- En las páginas propias de la aplicación (sin iframe):

La aplicación deberá modificar la URL del iframe y redirigirlo a la home de la web, que si contiene el código de Oct8ne.

A la URL añade el parámetro 'oct8neOpen=Webview', que hará que se ejecute el coviewer de Oct8ne automáticamente.

Ejemplo de url final:

https://www.client.es/?oct8neOpen=Webview&customapp=2 

​

2.- Salientes (De iframe a webview )

- En las páginas propias de la aplicación (sin iframe), se muestra una capa Loading, mientras carga la página cuando Oct8ne está totalmente cargado envía el siguiente evento al webview para indicar que ya está preparado y ya puede ocultar la capa.

parent.postMessage("oct8neOpened", "*");

• Related Articles

• Instalación de Oct8ne en tu página web

  Oct8ne se puede integrar en cualquier página web de tres formas distintas en función de tu plataforma y necesidades. 1.- Mediante Plugin. Si tu web está reallizada en una de las plataformas mas comunes, oct8ne pone a disposicion un "plugin / addon" ...

• Integración de Oct8ne con Google Analytics 4

  Integración de Oct8ne con Google Analytics 4 Introducción Oct8ne permite la integración directa con Google Analytics versión 4 (GA4) a través del envío de eventos. Estos aportan información vital sobre las interacciones que se realizan dentro de ...

• API Oct8ne de integración con CSM a medida

  Documentación del API Oct8ne Versión del API 2.4 (Octubre 2024 / rev05) Índice de contenidos 1. Introducción 2. Arquitectura 3. Vista general 3.1. Descargar e instalar plugin/extensión 3.2. Registro como desarrollador y activación de la plataforma ...

• Descarga de estadísticas mediante API

  Estas instrucciones van dirigidas a personas con un mínimo conocimiento de lenguaje de programación web: JAVASCRIPT. Si no es tu caso, recomendamos que te pongas en contacto con tus desarrolladores y les facilites estas instrucciones. La instalación ...

• Como integrar el buscador de Doofinder con Oct8ne

  Oct8ne permite la integración del motor de búsqueda con Doofinder, dentro del panel de Magento 2. Primero de todo, debes asegurar que tu Doofinder esta CORRECTAMENTE instalado y funcionando en tu tienda de MAGENTO2. Una vez tu entorno este bien ...