1

Primera pregunta y principiante en la programación, desde ya agradezco su disponibilidad y paciencia.

Estoy realizando con un modal en Bootstrap la aceptación de cookies, obtuve un código que me facilita el registro en el localStorage, pero al momento de confirmar si ya se ha aceptado en un pasado no logro esconder la ventana modal y siempre se vuelve a mostrar al recargar la web.

Adjunto el código para ver si es posible que me ayuden.

document.addEventListener('DOMContentLoaded', () => {

    let cookies = () => {
        //======================================================================
        // COOKIES
        //======================================================================

        //-----------------------------------------------------
        // Variables
        //-----------------------------------------------------
        let seccionCookie = document.querySelector('section.cookies');
        let cookieSi = document.querySelector('.cookies__boton--si');
        let cookieNo = document.querySelector('.cookies__boton--no');

        //-----------------------------------------------------
        // Funciones
        //-----------------------------------------------------

        /**
         * Método que oculta la sección de Cookie para siempre
         */
        function ocultarCookie() {
            // Cierra el modal de cookies automaticamente
            $('#modalOneModal').modal('hide');
        }

        /**
         * Método que marca las cookies como aceptadas
         */
        function aceptarCookies() {
            // Oculta el HTML de cookies
            ocultarCookie();
            // Guarda que ha aceptado
            localStorage.setItem('cookie', true);
            // Tu codigo a ejecutar si aceptan las cookies
            ejecutarSiAcepta();
        }

        /**
         * Método que marca las cookies como denegadas
         */
        function denegarCookies() {
            // Oculta el HTML de cookies
            ocultarCookie();
            // Guarda que ha aceptado
            localStorage.setItem('cookie', false);
        }

        /**
         * Método que ejecuta tu código si aceptan las cookies
         */
        function ejecutarSiAcepta() {
            async; src = "https://www.googletagmanager.com/gtag/js?id=UA-177632652-1"
            window.dataLayer = window.dataLayer || [];
            function gtag() { dataLayer.push(arguments); }
            gtag('js', new Date());

            gtag('config', 'UA-177632652-1');
            /////////////////// Tu código ////////////////
            ////////////  ¿Google Analítics? /////////////
        }

        /**
         * Método que inicia la lógica
         */
        function iniciar() {
            // Comprueba si en el pasado el usuario ha marcado una opción
            if (localStorage.getItem('cookie') !== null) {
                if (localStorage.getItem('cookie') === 'true') {
                    // Aceptó
                    aceptarCookies(

                    );
                } else {
                    // No aceptó
                    denegarCookies();
                }
            }
        }

        //-----------------------------------------------------
        // Eventos
        //-----------------------------------------------------
        cookieSi.addEventListener('click', aceptarCookies, false);
        cookieNo.addEventListener('click', denegarCookies, false);

        return {
            iniciar: iniciar
        }
    }

    // Activa el código. Comenta si quieres desactivarlo.
    cookies().iniciar();

});

1 respuesta 1

0

Tu código es correcto, pero no la lógica:

  • No mostrar el modal hasta que hayas realizado validaciones
  • Buscar cookie en localStorage
  • Si no existe:
    • Solo aquí se muestra modal
    • Con los botones ya controlas lo que se debe hacer después
  • Si existe:
    • Tiene valor 'true': Ejecutar funciones que usan cookies
    • Tiene otro valor: No ejecutar funciones que usan cookies
function iniciar() {
    // Comprueba si en el pasado el usuario ha marcado una opción
    let acepta = localStorage.getItem('cookie');
    if (acepta === null) {
        // Todavía no ha aceptado o denegado cookies
        $('#modalOneModal').modal('show');
    } else {
        // Ya aceptó o denegó cookies
        if (acepta === 'true') {
            // Aceptó, no es necesario mostrar modal, solo ejecutar funciones
            ejecutarSiAcepta();
        } else {
            // No aceptó, no usar cookies, es decir, no hacer nada
            // denegarCookies();
        }
    }
}
1
  • Perfecto, muchas gracias por el aporte entendí la corrección en la lógica. Y ahora esta funcioanndo! Commented el 10 sept. 2020 a las 22:58

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.