Maison > interface Web > js tutoriel > Explication détaillée du cas d'utilisation du plug-in de cookie js-cookie

Explication détaillée du cas d'utilisation du plug-in de cookie js-cookie

php中世界最好的语言
Libérer: 2018-05-09 09:46:34
original
2035 Les gens l'ont consulté

Cette fois je vous apporte une explication détaillée du cas du plug-in Cookie js-utilisation des cookies, quelles sont les précautions pour l'utilisation du plug-in Cookie js-cookie , ce qui suit est un cas pratique, jetons-y un coup d'œil une fois.

Les cookies sont de petits fichiers texte placés côté client par les concepteurs de sites Web. Généralement, les langages backend sont couramment utilisés et peuvent répondre à certains besoins personnalisés des utilisateurs. Le plug-in js-cookie est un plug-in JS qui exploite les cookies. Le fichier source ne fait que 3,34 Ko, ce qui est très léger. js-cookie prend également en charge l'installation et la gestion de npm et Bower. Jetons un coup d'œil à l'utilisation spécifique de js-cookie.

Une API JavaScript simple et légère pour gérer les cookies

Fonctionne dans tous les navigateurs
Accepte n'importe quel caractère
Fortement testé
Aucune dépendance
Prise en charge discrète de JSON
Prend en charge AMD/CommonJS
Conforme à la norme RFC 6265
Wiki utile
Activer l'encodage/décodage personnalisé
~900 octets compressés !

Méthode de citation :

1. Présentez js-cookie.js

1. Buvez du cdn directement :

2. Après téléchargement local :

3.ModularisationPendant le développement : importer les cookies depuis 'js-cookie'

2. Couramment utilisé API et méthodes de js-cookie.js

a. Définir un cookie

Cookies.set('name', 'value', { expires: 7, path: '' });//Expire dans 7 jours

Cookies.set('name', { foo: 'bar' });//Définir un json

b, lire le cookie

Cookies.get('name');//obtenir le cookie

Cookies.get(); #Lire tous les cookies

c, supprimer le cookie

Cookies.remove('name'); #Ce doit être le même chemin lors de la suppression des cookies.

Ce qui suit est une introduction aux pays étrangers

Utilisation de base

Créer un cookie, valable sur l'ensemble du site :

Cookies.set('name', 'value');

Créez un cookie expirant dans 7 jours, valable sur l'ensemble du site :

Cookies.set('name', 'value', { expires: 7 });

Créez un cookie expirant, valable au chemin de la page actuelle :

Cookies.set('name', 'value', { expires: 7, path: '' });

Lire le cookie :

Cookies.get('name'); >Cookies. get('nothing'); // => undefined

Lire tous les cookies visibles :

Cookies.get(); // => { name: 'value' }

Supprimer le cookie :

Cookies.remove('name');

Supprimer un cookie valide au chemin de la page actuelle :

Cookies.set('name', 'value', { path: ' ' }) ;

Cookies.remove('name'); // échec !
Cookies.remove('name', { path: '' }); // supprimé !

IMPORTANT ! Lors de la suppression d'un cookie, vous devez transmettre exactement les mêmes attributs de chemin et de domaine que ceux utilisés pour définir le cookie, sauf si vous vous appuyez sur les attributs par défaut.

Remarque : la suppression d'un cookie inexistant n'est pas effective. ne déclenche aucune

exception ni ne renvoie aucune valeur.

Conflits d'espace de noms

S'il existe un risque de conflit avec l'espace de noms Cookies, le noConflict La méthode vous permettra de définir un nouvel espace de noms et de conserver celui d'origine. Ceci est particulièrement utile lors de l'exécution du script sur des sites tiers, par exemple dans le cadre d'un widget ou d'un SDK.

// Attribuez l'API js-cookie à une variable différente et restaurez le "window.Cookies" d'origine

var Cookies2 = Cookies.noConflict();
Cookies2.set(' name', 'value');

Remarque : La méthode .noConflict n'est pas nécessaire lors de l'utilisation d'AMD ou de CommonJS, elle n'est donc pas exposée dans ces environnements.

JSON

js-cookie fournit un stockage JSON discret pour les cookies.

Lors de la création d'un cookie, vous pouvez transmettre un tableau ou un littéral d'objet au lieu d'une chaîne dans la valeur. Si vous le faites, js-cookie stockera la représentation sous forme de chaîne de l'objet selon JSON.stringify :

Cookies.set('name', { foo: 'bar' });

Lors de la lecture d'un cookie avec l'API Cookies.get par défaut, vous recevez la représentation sous forme de chaîne stockée dans le cookie :

Cookies.get('name'); // => '{"foo":"bar"}'
Cookies.get(); // => { name: '{"foo":"bar"}' }
Copier après la connexion

Lors de la lecture d'un cookie avec l'API Cookies.getJSON, vous recevez la représentation analysée de la chaîne stockée dans le cookie selon JSON.parse :

Cookies.getJSON('name'); // => { foo: 'bar' }
Cookies.getJSON(); // => { name: { foo: 'bar' } }
Copier après la connexion

Remarque : Pour prendre en charge IE6-7 (et le mode de compatibilité IE 8), vous devez inclure le polyfill JSON-js : https://github.com/douglascrockford/JSON-js

相信

推荐阅读:

Angular集成三方UI框架、控件使用详解

Vue文档使用案例总结

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal