En este artículo, sabremos obtener la lista de todas las cookies para la página actual en Javascript, además de comprender su implementación a través de los ejemplos. La tarea es recuperar las cookies almacenadas en el dominio actual (No podemos obtener todas las cookies por razones de seguridad). Hay dos métodos para resolver este problema que se discuten a continuación.
Enfoque 1:
- Acceda a las cookies utilizando document.cookie .
- Use el método .split() para dividirlos en «;» para obtener una serie de cookies.
- Atraviesa la array de cookies.
- Agregue todas las cookies una por una en una string para imprimir.
Ejemplo: Este ejemplo implementa el enfoque anterior.
HTML
<!DOCTYPE HTML>
<html>
<head>
<title>How to list all cookies for the current page?</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
</script>
</head>
<body style="text-align:center;">
<h1 style="color: green">
GeeksforGeeks
</h1>
<p id="GFG_UP" style="font-size: 20px; font-weight: bold;"> </p>
<button onclick="gfg_Run()"> Click Here </button>
<p id="GFG_DOWN" style="color:green;
font-size: 26px; font-weight: bold;"> </p>
<script>
var el_up = document.getElementById("GFG_UP");
var el_down = document.getElementById("GFG_DOWN");
el_up.innerHTML = "Click on the button to "
+ "get the stored cookies.";
function getCookies() {
var cookies = document.cookie.split(';');
var ret = '';
for(var i = 1; i <= cookies.length; i++) {
ret += i + ' - ' + cookies[i - 1] + "<br>";
}
return ret;
}
function gfg_Run() {
el_down.innerHTML = getCookies();
}
</script>
</body>
</html>
Producción:
Obtener las cookies almacenadas usando Javascript
Enfoque 2:
- Acceda a las cookies utilizando document.cookie .
- Use el método .split() para dividirlos en «;» para obtener una serie de cookies.
- Utilice el método .reduce() y acceda a cada cookie una por una.
- Para obtener el nombre y el valor de la cookie. Para cada cookie, divídala en “=” usando el método .split() y acceda al Nombre y Valor de la cookie.
- Este método hace lo mismo que el método anterior y devuelve las cookies como un objeto.
Ejemplo: Este ejemplo implementa el enfoque anterior.
HTML
<!DOCTYPE HTML>
<html>
<head>
<title>How to list all cookies for the current page?</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
</script>
</head>
<body style="text-align:center;">
<h1 style="color: green">
GeeksforGeeks
</h1>
<p id="GFG_UP" style="font-size: 20px; font-weight: bold;"> </p>
<button onclick="gfg_Run()">Click Here</button>
<p id="GFG_DOWN" style="color:green;
font-size: 26px; font-weight: bold;"> </p>
<script>
var el_up = document.getElementById("GFG_UP");
var el_down = document.getElementById("GFG_DOWN");
el_up.innerHTML = "Click on the button "
+ "to get the stored cookies.";
function gfg_Run() {
var cookies = document.cookie.split(';').reduce(
(cookies, cookie) => {
const [name, val] = cookie.split('=').map(c => c.trim());
cookies[name] = val;
return cookies;
}, {});
el_down.innerHTML = JSON.stringify(cookies);
}
</script>
</body>
</html>
Producción:
Obtener las cookies almacenadas usando Javascript
Publicación traducida automáticamente
Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA