Angular 6でCookieを作成する方法AngularJSの場合、Angular 6.でCookieを作成する最良の方法はngcookieです。
このノードパッケージを使用できます
npm install ngx-cookie-service --save
import { CookieService } from 'ngx-cookie-service';
CookieService
をモジュールのプロバイダーに追加します。cookie.get(nameOfCookie)
を使用し、新しいCookieを追加するにはcookie.set(nameOfCookie,cookieValue)
を使用します。まず最初に、あなた自身に尋ねるべきです: "本当にクッキーが必要ですか?":
Cookieは、かつて一般的なクライアント側のストレージに使用されていました。クライアントにデータを保存する唯一の方法である場合、これは正当でしたが、最近のストレージAPIを好むことが現在推奨されています。 Cookieはリクエストごとに送信されるため、パフォーマンスが低下する可能性があります(特にモバイルデータ接続の場合)。クライアントストレージ用の最新のAPIは、WebストレージAPI(localStorageおよびsessionStorage)とIndexedDBです。 (出典:MDN)
したがって、まだお持ちでない場合は、代わりに Web Storage API についてお読みください。
クッキーを続行したい場合は、先をお読みください。
ngx-cookie-service
を試しましたが、うまくいきませんでした。私は問題ごとに問題があり、最終的にgithubで議論し、パッケージを更新しようとしました。 Cookieの取得/設定はすべてネイティブJavaScriptであるため、必要なものがそれほど複雑である必要はないことを理解するのに約1日かかりました。
無駄にする時間はもうなかったので、この簡単なCookieService
を自分で書きました。そして、私はそれを他の絶望的な開発者と共有したかっただけです。 :)
私はこれを作成しました Gist 、これはngx-cookie-serviceの軽量の代替です。
もちろん、app.module.ts
ファイルに登録する必要があります。プロバイダーのリストに追加します:
providers: [FooService, BarService, CookieService]
次に、コンポーネントで使用します。次のように:
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);
}
デバッグツールを使用して、Cookieが実際に設定されていることを確認し、後続のHTTP要求に存在することを確認できることに注意してください。 (Chromeのスクリーンショットですが、FirefoxとEdgeは同様の概要を持っています)
現在は:npm install ngx-cookie --save