Comment créer des cookies dans Angular 6?
Comment créer des cookies dans Angular 6, pour AngularJS, il existe ngcookie, quel est le meilleur moyen de créer des cookies dans Angular 6.
Vous pouvez utiliser ce package de noeud pour cela
npm install ngx-cookie-service --save- Ajouter à votre module:
import { CookieService } from 'ngx-cookie-service'; - Ajoutez
CookieServiceaux fournisseurs du module. - Injectez-le dans votre constructeur.
- Utilisez
cookie.get(nameOfCookie)pour obtenir un cookie spécifique, utilisezcookie.set(nameOfCookie,cookieValue)pour ajouter un nouveau cookie.
Tout d'abord, vous devriez vous demander: "Ai-je vraiment besoin de cookies?" :
Les cookies étaient autrefois utilisés pour le stockage général côté client. Bien que cela fût légitime alors qu’ils étaient le seul moyen de stocker des données sur le client, il est recommandé de préférer les API de stockage modernes . Les cookies sont envoyés à chaque demande, ce qui peut nuire aux performances (en particulier pour les connexions de données mobiles). Les API modernes pour le stockage client sont l'API de stockage Web (localStorage et sessionStorage) et IndexedDB. (Source: MDN)
Donc, si vous ne l’avez pas déjà fait, vous voudrez peut-être vous renseigner sur = API de stockage Web .
Si vous souhaitez continuer avec les cookies, lisez la suite.
J'ai essayé ngx-cookie-service et cela n'a pas fonctionné pour moi. J'avais question après question, j'ai discuté de cela sur github, j'ai essayé de mettre à jour les paquets. Il m'a fallu environ une journée pour réaliser que ce dont j'avais besoin n'avait pas besoin d'être aussi compliqué. Après tout, obtenir/installer des cookies n'était qu'un outil javascript natif.
Je n’avais plus de temps à perdre et j’écris moi-même cette simple CookieService. Et je voulais juste le partager avec d'autres développeurs désespérés. :)
Un simple CookieService
J'ai créé ceci Gist , qui est une alternative légère au service ngx-cookie.
Configuration et utilisation
Bien sûr, vous devez l’enregistrer dans votre fichier app.module.ts. Ajoutez-le à la liste de vos fournisseurs:
providers: [FooService, BarService, CookieService]
Ensuite, utilisez-le dans vos composants, par exemple. comme suit:
private _sessionId: string;
constructor(private cookieService: CookieService) {
this._sessionId = cookieService.get("sessionId");
}
public set sessionId(value: string) {
this._sessionId = value;
this.cookieService.set("sessionId", value);
}
Notez que vous pouvez utiliser les outils de débogage pour vérifier que le cookie est réellement défini et pour vérifier qu'il est présent dans les demandes HTTP suivantes. (captures d'écran de Chrome, mais Firefox et Edge ont des vues d'ensemble similaires)
Maintenant, c'est: npm install ngx-cookie --save