Descargar y usar
Publicado como código abierto bajo licencia Apache-2.0
https://www.npmjs.com/package/xcoobee-cookie-kit-web
Cuál es la diferencia
XCK es un marco activo de gestión de cookies y consentimiento para su sitio. Esto es diferente de un cuadro de texto basado solo en notificaciones de cookies.
La mayoría de los avisos GDPR de cookies actuales para sitios web son solo eso: superposiciones que muestran información pero no gestionan activamente la creación de cookies y los ciclos de vida. Todavía es responsable de manejar las cookies y las huellas digitales correctamente. En contraste con esto, el XcooBee Cookie Kit es un verdadero administrador de cookies y de ciclo de vida. Le ayudará a implementar las premisas del GDPR y la directiva electrónica europea correctamente.
Ejemplo de inicio súper rápido
- Cargue la biblioteca desde el CDN usando la etiqueta de script:
- Configure sus cookies administradas con
etiqueta en tu DOM HTML así:
abhchkshsdh azul oscuro
- Inicialice el kit de cookies para administrar las cosas al final de la representación de su página:
Ver Parámetros de referencia para todas las cosas que puedes hacer.
Hecho !!
Este fue un ejemplo súper simple, el XCK asumirá tareas relacionadas con GDPR y directivas electrónicas desde aquí. Por supuesto, hay muchos más ejemplos detallados más adelante.
Vídeo
¿Qué es el XCK?
El objetivo del Kit de cookies XcooBee (XCK) es permitir que los sitios web administren su consentimiento de cookies de manera más efectiva y con menos molestia para sus usuarios. El XCK puede trabajar en concierto con la red XcooBee para mejorar la administración general de usuarios y empresas, pero eso no es obligatorio. Cuando el XCK funciona independientemente de XcooBee, algunas funciones de administración no estarán disponibles.
El XCK facilita agregar administración de consentimiento de cookies en su sitio web. Maneja toda la interacción del usuario para obtener el consentimiento y le permite al sitio web saber qué cookies se pueden usar para cada usuario mientras visita su sitio web. Del mismo modo, su sitio web ahora puede ser informado cuando los usuarios cambian su consentimiento, incluso cuando no lo están visitando.
XCK es una de las formas más transparentes y sin fricciones para administrar las cookies en su sitio. No aparecerá, no obstaculizará la experiencia del usuario cuando no sea necesario. Sin embargo, al mismo tiempo, cumple con las directivas electrónicas europeas y las normas GDPR relacionadas.
Los propietarios de sitios web pueden reaccionar fácilmente a las solicitudes de datos e informar sobre solicitudes relacionadas con la privacidad si es necesario a través de la red XcooBee.
XCK no requiere una conexión XcooBee para funcionar en su sitio web. Aún tendrá acceso a la mayoría de la recopilación de consentimiento de los usuarios, pero no tendrá una visión central y una gestión del consentimiento.
El XCK es receptivo y se ajustará fácilmente a diferentes pantallas, incluidos los usos móviles.
Inicio rápido para llegar a ejemplos de etiquetas
Caracteristicas
Con el kit de galletas puedes:
- use la clasificación previa de cookies de XcooBee para presentar detalles simplificados y claros de cómo usará las cookies
- comparte tus políticas de cookies
- comparte tus términos de servicio
- comparte tu política de privacidad
- determinar las interacciones del configurador / desensamblador de cookies
- integrarse con servicios de back-end para notificaciones de cookies
- determinar de manera transparente si la notificación es necesaria
- permitir a los usuarios eliminar / agregar consentimiento para cookies
- establecer el tiempo y la posición de la pantalla de información
- reaccionar adecuadamente a las solicitudes de consentimiento y eliminación de consentimiento del usuario
Con la suscripción a XcooBee también puedes:
- documentar sus interacciones de consentimiento de cookies
- gestionar de forma remota el consentimiento del usuario
- documentar el tiempo de respuesta adecuado a las solicitudes de los usuarios
- establecer elementos de estilo y logotipo adicionales
- permite a los usuarios utilizar la inteligencia de cookies multitud
Clasificación fácil de cookies
XCK utiliza un sistema de clasificación para cookies en lugar de enumerar cada cookie individual con su origen. Al poner las cookies en grupos lógicos, XCK elimina la necesidad de experiencia técnica para distinguir las cookies individuales. Los usuarios pueden tomar una decisión más fácil en función del uso previsto de la cookie en lugar del nombre de dominio o cualquier otro criterio técnico.
El sistema de clasificación XcooBee coloca en general las cookies en uno de los siguientes tipos:
- Cookies requeridas o de aplicación
- Cookies de personalización
- Cookies de estadísticas
- Cookies de publicidad y marketing
Para mayor información por favor visite Clasificación de cookies XcooBee.
Aplicaciones de ejemplo
Hemos incluido tres aplicaciones de ejemplo que hacen uso de XCK para que pueda verlo usted mismo en acción.
Solicitud de página única
Nuestra aplicación de café demuestra el uso de XCK en una aplicación de una sola página. Puede descomprimir e implementar en un servidor web como IIS o Apache. Los archivos se encuentran en ejemplos / cafe-spa.zip
. Revisa el index.html
archivo de instrucciones / explicaciones.
Aplicación de solicitud / respuesta de muestra basada en NodeJs & Express
Nuestra aplicación de pizza demuestra el uso de XCK en una aplicación basada en solicitud / respuesta. Puede descomprimirlo e implementarlo directamente en su sistema. Necesitará nodejs instalados en su sistema para algunos. Revisa el README.md
archivo de instrucciones / explicaciones en cada una de las aplicaciones de ejemplo de página única (SPA), Express y ReactJS:
Aplicación de ejemplo del kit de cookies
Aplicación basada en ReactJS de muestra
Un clon de nuestra aplicación de café para demostrar el uso de XCK con React. Estamos utilizando la React Build especial de XCK para esto y debe revisar el kit-reaccionar-cookie en npm js.
Aplicación de React de ejemplo de Kit de cookies
Como funciona esto
La galleta
El XCK muestra un icono de cookie flotante en la pantalla en una esquina de su elección. Este es el punto de partida para la interacción del usuario. Al hacer clic en el icono de la cookie, los usuarios abren un cuadro de diálogo de consentimiento emergente que les permite interactuar con su sitio.
Si XCK determina que se necesita el consentimiento del usuario, irá al siguiente paso y abrirá el cuadro de diálogo emergente de XCK:
El diálogo emergente
El XCK puede determinar automáticamente cuándo se necesita un diálogo de consentimiento completo o solo la cookie. Por lo tanto, hacer que la visita al sitio sea más agradable y sin fricciones.
Al usar el XCK usted:
- a) primero determine qué cookies está utilizando actualmente en su sitio
- b) luego seleccione qué tipo de cookie XcooBee (clasificación) que mejor se adapta a cada cookie
- c) muestre a los visitantes de su sitio la ventana emergente de diálogo de consentimiento de XCK para solicitar permiso
- d) después de obtener el consentimiento para un tipo de cookie, configure las cookies en ese grupo para su usuario utilizando un controlador dentro del JavaScript del cliente o el patrón de URL de destino a través de la sintaxis del servidor (PHP, JSP, .net, etc.) o ambos.
Si ya se obtuvo el consentimiento de la cookie, XCK no mostrará otra ventana emergente. Puede consultar el estado a través de JavaScript para configurar las cookies nuevamente, o realizar un seguimiento de este en el lado del backend si está utilizando la aplicación de tipo Solicitud / Respuesta.
Ejemplo a pie a través de
Supongamos un ejemplo de un sitio de compras impulsado por JSP que utiliza cuatro cookies. Aquí hay un proceso de muestra para implementar la gestión adecuada del consentimiento de cookies utilizando XCK:
una
Usted determina que usa las siguientes cuatro cookies en su sitio.
- Su cookie de sesión JSP
- Una cookie de usuario para realizar un seguimiento del tema del usuario.
- Una cookie de estadísticas del sitio de su servidor web
- Una cookie de estadísticas globales de Google Analytics
si
Clasifica las cookies en los siguientes tipos
Aplicación: Cookie de sesión JSP
Personalización: cookie de usuario
Estadísticas: cookie de servidor web local y cookie de google analytics
C
usted inicializar y renderizar el script XCK para mostrar la ventana emergente de consentimiento del usuario.
re
El usuario realiza una selección y hace clic en Aceptar.
mi
XCK invoca el proceso del controlador de JavaScript de su sitio que establece o elimina las cookies.
Pulsos de galletas
El kit de cookies utiliza un método de evaluación de acceso directo para verificar si ya ha obtenido el consentimiento para las cookies del usuario. Esto agiliza la configuración de cookies. Cuando esto tiene éxito, el icono de cookie que se coloca en una esquina designada, se reemplaza por pulsos. Hay diferentes pulsos de color para indicar que se ha producido una selección de acceso directo.
Verde: aprobación explícita del usuario
El pulso verde indica que el usuario ha visitado este sitio antes y que la configuración de consentimiento de cookies del sitio es conocida y se puede volver a aplicar.
Azul: aprobación basada en preferencias
El pulso azul indica que aunque el usuario no ha visitado este sitio antes, ha establecido preferencias de consentimiento para nuevos sitios que pueden aplicarse. Esto solo es posible cuando el usuario y el sitio web son miembros de la red XcooBee.
Amarillo: aprobación basada en inteligencia de multitudes
El pulso amarillo indica que el usuario ha elegido participar en el programa XcooBee Crowd AI para cookies. La red XcooBee utilizará un análisis basado en multitud y establecerá las cookies en función de los comentarios de los visitantes del sitio web. Esto solo es posible cuando el usuario y el sitio web son miembros de la red XcooBee.
Rojo: uso de preferencias del sitio web
El pulso rojo indica que no tenemos ninguna información directamente del usuario. En tal caso, el propietario del sitio web puede seleccionar usar las preferencias del sitio web para las cookies en lugar de las preferencias del usuario. Esto solo se puede hacer si el sitio web y el usuario se encuentran fuera de la UE.
Instalar en pc
Active el XCK al insertarlo en su sitio a través de Etiquetas Además, durante la invocación, proporciona parámetros adicionales a la etiqueta del script.
Algunos de estos incluyen:
- posición del botón del icono
- términos url
- URL de política de cookies
- tiempo de vencimiento del widget
- mensaje de texto
- función de manejo de cookies
- valores predeterminados del sitio
- URL de destino
Cuando se suscribe a XcooBee también puede especificar:
- su referencia de campaña
- logo de la compañía
- cssAutoLoad
UNA ID de campaña
es necesario para que XCK se comunique con XcooBee y permita la gestión de consentimientos. Por favor visita XcooBee si necesita crear una cuenta Sin él, el XCK funcionará en modo fuera de línea.
Modos de operacion
El XCK funciona en dos modos. Uno, en modo desconectado, donde XCK y su sitio web interactúan directamente sin el uso de la red XcooBee. Dos, en modo conectado, donde XCK interactúa con la red XcooBee para permitir que las empresas documenten y administren el consentimiento de las cookies, al tiempo que brinda a los usuarios herramientas adicionales para administrar y simplificar el manejo de cookies.
A continuación explicamos cómo funciona cada modo.
Modo desconectado
En modo desconectado,
- su sitio web carga y procesa su contenido sin configurar cookies
- carga el XCK con sus parámetros
- XCK maneja la interacción del usuario para el consentimiento de cookies
- comunica a su sitio qué tipos de cookies se pueden configurar.
Su sitio, entonces, establece las cookies de acuerdo con las preferencias del usuario.
Modo conectado
El modo conectado es similar en el proceso con diferencias en cada paso para reflejar herramientas adicionales:
En modo conectado,
- su sitio web carga y procesa su contenido sin configurar cookies
- carga el XCK con sus parámetros, incluidas las referencias de su campaña
- XCK maneja la interacción del usuario para el consentimiento de cookies. Para los usuarios de XcooBee, XCK negocia de manera transparente con su sitio según las preferencias del usuario. Los usuarios de XcooBee pueden navegar por sitios con poca interrupción.
- XCK le comunica a su sitio qué tipos de cookies se pueden configurar. Su sitio, luego establece las cookies de acuerdo con las preferencias del usuario.
- Como propietario del sitio, puede revisar todo el consentimiento de cookies administrado. Informe sobre problemas de cumplimiento, tome medidas cuando los usuarios cambien su consentimiento incluso cuando no visiten su sitio. Los visitantes de su sitio (usuarios) pueden gestionar activamente el consentimiento de cookies de forma centralizada y navegar de forma transparente por su sitio sin molestos popups.
Cómo usar el kit de cookies XcooBee
Esta sección explica cómo usar el XCK en su sitio.
Cómo usar el Kit de cookies en la Aplicación de página única (SPA)
Al usar un SPA, puede especificar un controlador de JavaScript que pueda recibir el resultado de la interacción del usuario para el consentimiento de las cookies. Posteriormente, debe cargar los scripts y / o configurar las cookies directamente en función de la interacción del usuario.
Como esto puede cambiar, también debe ser capaz de eliminar las cookies cuando los usuarios cambien de opinión.
En ambos casos, XCK invocará su función de controlador después de que el usuario haya completado su interacción con XCK.
XCK llamará a su controlador de JavaScript con un objeto de JavaScript. Las preferencias del usuario se enumeran en el argumento.
Puedes encontrar un ejemplo de SPA en github.
Aquí hay un objeto de ejemplo.
{"aplicación": verdadero, "uso": verdadero, "estadísticas": falso, "publicidad": falso}
Por lo tanto, la firma de la llamada será: handlerFunction (cookieObject)
.
Por ejemplo, si su función de controlador se llama cookieHandler
y el objeto argumento de la función se llama userCookiePreferences
Esta sería la firma de su función:
cookieHandler (userCookiePreferences);
Función de cookieHandler de muestra:
función cookieHandler (consentSettings) {if (consentSettings.application) {// establezca las cookies requeridas aquí // ...} más {// elimine las cookies requeridas aquí // ...}; if (consentSettings.usage) {// establezca las cookies de personalización del usuario aquí // ...} más {// elimine las cookies de personalización del usuario aquí // ...}; if (consentSettings.statistics) {// establece las estadísticas del sitio que recopilan cookies aquí // ...} más {// elimina las estadísticas del sitio que recopilan cookies aquí // ...}; if (consentSettings.advertising) {// establezca cookies de publicidad y marketing y seguimiento aquí // ...} más {// elimine las cookies de publicidad y marketing y seguimiento aquí // ...}; }
Ver más ejemplo completamente desarrollado más adelante en este documento.
Cómo usar el Kit de cookies con sistemas de solicitud / respuesta como PHP, Node, JSP, .net, CFML, etc.
XCK puede comunicar a los usuarios la concesión y eliminación de consentimiento para cookies a su sitio a través de la publicación webhook (HTTP POST) también. Necesitará un punto final accesible desde la web tal como se define en targetUrl
que puede procesar estos mensajes y establecer / deshabilitar las cookies por tipo de cookie.
Sin embargo, dependiendo de su situación, es posible que pueda manejar todas las interacciones dentro de JavaScript sin recargas o llamadas al backend (vea el ejemplo a continuación)
HTTP POST usará TIPO DE CONTENIDO
= aplicación / json
El contenido del cuerpo es un objeto JSON con la selección de tipos de cookies por parte del usuario. Solo se incluirán los tipos de cookies para los que ha solicitado su consentimiento.
{"tiempo": "2018-10-31T16: 40: 28", "código": 200, "resultado": {"aplicación": verdadero, "uso": falso, "estadísticas": verdadero}}
Dónde:
hora => fecha de la decisión en código UTC => 200 para resultado exitoso => el JSON con información sobre tipos de cookies
Un proceso de muestra para manejar el consentimiento de cookies a través de una Solicitud / Respuesta y un página de manejador
El patrón podría verse así. Tu página de manejador
Es muy probable que sea un fragmento de código que deberá incluirse en todas las llamadas de representación de páginas. También deberá poder llamarlo de forma independiente.
- Su sistema se inicia sin cookies.
- Si no se definen cookies, invoque el XCK
- XCK obtiene el consentimiento del usuario y llama al
página de manejador
identificado entargetUrl
parámetro página de manejador
guarda la decisión del usuario y marca que el usuario ha tomado una decisión- para cada llamada posterior, el
página de manejador
comprueba que la decisión del usuario esté disponible y establece los tipos de cookies
Tu página de manejador
probablemente empleará este tipo de lógica
- determinar si se trata de una llamada regular (incluida) o una llamada de XCK para guardar la decisión del usuario
- si llamada regular
- determinar si tenemos una decisión del tipo de cookie del usuario
- si no tenemos decisión -> cargar XCK insertando
etiquetas en HTML para presentar la opción de cookies al usuario
- si tenemos una decisión de cookie de usuario -> cargar cookies para cada tipo permitido
- si se llama desde XCK
- guardar la decisión de la cookie del usuario
También puedes revisar nuestro ejemplo de aplicación Express / NodeJs en Github.
Ejemplo de uso con la página PHP combinada con el Kit de cookies
En este ejemplo, suponemos que tenemos un sitio web que ejecuta un motor PHP para representar páginas web. Como parte de este proceso, el sitio web cargará el XCK para administrar el consentimiento del usuario. Estás gestionando la creación de cookies a través de JavaScript.
El proceso de gestión se divide en este flujo:
a. La página PHP escribe los valores para cada tipo de cookie en la secuencia HTML / Javascript
si. Incluir código de controlador JS (ejemplo a continuación)
C. Cargar XCK
una
Canalizar variables PHP con etiquetas de script en HTML
En este ejemplo, asumimos que tiene JS etiquetas para todas las cookies que necesita crear y guardarlas en las variables PHP correspondientes de esta manera:
$cookie_scripts_application => las cookies de aplicación requeridas, por ejemplo, por ejemplo: $cookie_scripts_user => las cookies de personalización del usuario, por ejemplo: $cookie_scripts_statistics => las cookies de estadísticas del sitio, por ejemplo: $cookie_scripts_advertising => las cookies de publicidad del sitio, por ejemplo: