Crear una Notificación GDPR con Angular 6 + Cookie y Bootstrap 4

Angular Articulos JavaScript | | Comunidad: Crear un Post, Eventos Devs, Foro

Demo Github

Hace poco salio el Reglamento de Protección de Datos, el cual obliga a todas las plataformas a que notifiquen sobre el uso de datos de los usuarios que usan y visitan una plataforma, esta información aun sigue en debate pero ya es obligatorio que todas las empresas la desplieguen a sus usuarios, vamos a trabajar con la versión de Angular 6 y Bootstrap 4 para la interface.

Trabajando con Angular 6

Abrimos la consola de comando de NodeJS (Command Prompt) Creamos un nuevo proyecto

Paso seguido abrimos el archivo app.component.ts y agregamos:

Trabajando con Bootstrap 4

Bien en mi vista voy a crear la notificación GDRP en la parte de abajo después de cerrar la etiqueta </footer> con el botón aceptar que llamará a la acción onGRDP con el evento para cerrar la notificación, esta acción la definimos en nuestro archivo app.component.ts :

Si ven le di el valor hidden]=”!visible” a la capa (div) para trabajar con la acción cerrar en mi componente app.component.ts .

En nuestro archivo app.component.css agregamos los estilos a los elementos de nuestra vista:

Y la Cookie ?

No olvidemos que parte del desarrollo agíl de Software es apoyarnos en librerias para entregar a tiempo los proyectos. Usaremos la libreria de Cookies ngx-cookie-service y si vieron el archivo de nuestro componente app.component.ts pueden ver que estamos desplegando una Cookie personalizada en el navegador.

Entonces cada ves que abrimos nuestro navegador veremos que nos setea una cookie.

Gracias a esta Cookie podrás controlar que al usuario no se le vuelva a mostrar más la notificación GDPR, solo tienes que crear el código necesario para manipular dicho evento.

Te invitamos a seguirnos en nuestras Redes Sociales y suscribirte a nuestro canal de Youtube para que no te pierdas nuestros próximos contenidos.

 

 

Newsletter

Suscríbete a Nuestro Boletín de Novedades:

(Luego de la suscripción no te va salir ningun mensaje. Solo revisa tu bandeja de Correo para confirmar tu suscripción)
* indicates required
Subscribirse
Notificar a
guest
6 Comments
antiguos
nuevos más votado
Inline Feedbacks
View all comments
sj400
sj400
6 meses atrás

No funciona la demo

kevin
kevin
1 mes atrás

quiero que cuando se le de en aceptar al recargar la pagina no vuela a aparecer ese aviso osea que reconozca que el ya acepto las cookies, quisiera saber el codigo de ese porfa

kevin
kevin
Reply to  Nube Colectiva
1 mes atrás

Ya pude hacerlo, de verdad muchas gracias por la colaboración!