¿Cómo configurar y desactivar las cookies usando jQuery?

Una cookie HTTP es una pequeña porción de datos enviada desde un servidor y almacenada en el lado del cliente por el propio navegador. Las cookies se crean para realizar un seguimiento del usuario y también para proporcionar una experiencia de navegación agradable. También podemos configurar nuestras cookies en el navegador según nuestras necesidades.

Las cookies se pueden configurar en el navegador con la ayuda de JavaScript o jQuery . Aquí veremos cómo configurar las cookies en el navegador con la ayuda de jQuery y cómo eliminarlas más adelante.

Aquí estamos usando CDN de cookies jQuery para insertar una cookie en el navegador.

Nota: mantenga su conexión a Internet mientras usa este código, ya que usa servicios CDN para jQuery .

Ejemplo 1: Configuración de cookies en el navegador después de eso, eliminaremos esa cookie.

HTML

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="UTF-8">
      <meta name="viewport"
            content="width=device-width, initial-scale=1.0">
      <title>Cookie | Geeksforgeeks</title>
      <script src=
"https://code.jquery.com/jquery-3.5.1.min.js"
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
         crossorigin= "anonymous"></script>
      <script src=
"https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
   </head>
   <body>
      <center>  
        <h1 style="color: green">GeeksforGeeks</h1>
        <button onclick="addCookie()">
        Add Cookie
        </button>
        <button onclick="removeCookie()">
        remove Cookie
        </button>
          
<p></p>
  
        <script>
            let addCookie=()=>{
            $.cookie("geeksforgeeks", 
            "It is the data of the cookie");
            $("p").text("cookie added");
            }
            let removeCookie=()=>{
            $.removeCookie("geeksforgeeks", 
            "It is the data of the cookie");
            $("p").text("cookie removed");
            }
        </script>
      </center>
   </body>
</html>

Salida: puede ver claramente que hay una cookie llamada GeeksforGeeks con un valor. También podemos establecer la fecha de caducidad de las cookies.

  • Antes de agregar la cookie: 

  • Después de agregar Cookies:

  • Después de eliminar la cookie:

Publicación traducida automáticamente

Artículo escrito por TARuN y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *