AngularJSでCookieの有効期限を設定する方法

1. ブラウザの更新（F5）時に失われないように、ユーザーの認証情報をCookieに保存したいと思います。

2. ユーザーがログオン時に「RememberMe」チェックボックスを選択した場合に備えて、認証情報を「permanent-cookie」に保存します。

これは、ngCookiesモジュールを使用したAngularの1.4.0ビルドで可能です。

https://docs.angularjs.org/api/ngCookies/service/$cookies

angular.module('cookiesExample', ['ngCookies'])
.controller('ExampleController', ['$cookies', function($cookies) {
  // Find tomorrow's date.
  var expireDate = new Date();
  expireDate.setDate(expireDate.getDate() + 1);
  // Setting a cookie
  $cookies.put('myFavorite', 'oatmeal', {'expires': expireDate});
}]);

1.4の場合：ここおよび以下のコメントに記載されているように、1.4以降、AngularのネイティブCookieサポートはCookieを編集する機能を提供するようになりました。

38fbe3eeにより、$ cookiesは現在のブラウザのcookie値を表すプロパティを公開しなくなりました。$ cookiesは、Cookieの変更についてブラウザをポーリングしなくなり、Cookie値を$ cookiesオブジェクトにコピーしなくなりました。

これは、ポーリングに費用がかかり、$ cookiesプロパティが実際のブラウザのcookie値と正しく同期しないという問題が発生したために変更されました（ポーリングが最初に追加された理由は、異なるタブ間の通信を許可するためでしたが、今日これを行うためのより良い方法があります、たとえばlocalStorage。）

$ cookiesの新しいAPIは次のとおりです。

get put getObject putObject getAll remove Cookieデータにアクセスするには、上記のメソッドを明示的に使用する必要があります。これは、ブラウザのCookieで発生した変更を検出するために$ cookiesのプロパティを監視できなくなったことも意味します。

この機能は通常、サードパーティのライブラリが実行時にプログラムでCookieを変更した場合にのみ必要です。これに依存する場合は、Cookieに変更を加えるサードパーティライブラリに反応できるコードを作成するか、独自のポーリングメカニズムを実装する必要があります。

実際の実装は、呼び出しを介して渡すことができる$ cookiesProviderオブジェクトを介して行われputます。

1.3以下の場合：jQueryプラグインをロードする必要がないように最善を尽くした人にとって、これはangularの優れた代替品のようです-https ：//github.com/ivpusic/angular-cookie

Angular v1.4では、有効期限など、Cookieのいくつかのオプションを最終的に設定できます。非常に簡単な例を次に示します。

var now = new Date(),
    // this will set the expiration to 12 months
    exp = new Date(now.getFullYear()+1, now.getMonth(), now.getDate());

$cookies.put('someToken','blabla',{
  expires: exp
});

var cookie = $cookies.get('someToken');
console.log(cookie); // logs 'blabla'

このコードを実行した後にCookieを確認すると、有効期限がsomeToken。という名前のCookieに適切に設定されていることがわかります。

第3 PARAMとして渡されるオブジェクトput関数は、上記のような設定ならびに他のオプションを可能にするpath、domainとsecure。概要については、ドキュメントを確認してください。

PS-$cookieStore廃止されたマインドをアップグレードする場合の補足として、これ$cookiesがCookieを処理する唯一の方法になりました。ドキュメントを参照してください

一部の人々はクッキーの寿命の余分な期間を知っているので、私は追加の例を提示したいと思います。すなわち。彼らは、Cookieをあと10分、つまりあと1日持続するように設定したいと考えています。

通常、Cookieが数秒でどれだけ長く続くかはすでにわかっています。

    var today = new Date();
    var expiresValue = new Date(today);

    //Set 'expires' option in 1 minute
    expiresValue.setMinutes(today.getMinutes() + 1); 

    //Set 'expires' option in 2 hours
    expiresValue.setMinutes(today.getMinutes() + 120); 


    //Set 'expires' option in (60 x 60) seconds = 1 hour
    expiresValue.setSeconds(today.getSeconds() + 3600); 

    //Set 'expires' option in (12 x 60 x 60) = 43200 seconds = 12 hours
    expiresValue.setSeconds(today.getSeconds() + 43200); 

    $cookies.putObject('myCookiesName', 'myCookiesValue',  {'expires' : expiresValue});

そして、通常どおりに取得できます。

    var myCookiesValue = $cookies.getObject('myCookiesName');

空の場合、undefinedを返します。

リンク;

http://www.w3schools.com/jsref/jsref_obj_date.asp
https://docs.angularjs.org/api/ngCookies/provider/ $ cookiesProvider＃defaults

あなたはangular.jsスクリプトに行き、挿入クッキー
検索を変更することができます、そしてあなたはself.cookies = function(name, value) { 例えば7日間クッキーを追加するコードを変更することができます

 if (value === undefined) {
    rawDocument.cookie = escape(name) + "=;path=" + cookiePath +
                            ";expires=Thu, 01 Jan 1970 00:00:00 GMT";
  } else {
    if (isString(value)) {
        var now = new Date();
        var time = now.getTime();
        time += 24*60*60*1000*7;
        now.setTime(time);
         cookieLength = (rawDocument.cookie = escape(name) + '=' + escape(value) +
                 ';path=' + cookiePath+";expires="+now.toGMTString()).length + 1

私はこの質問が少し古いことを知っています、そしてすでに受け入れられた答えを持っています。

しかし、それでも私が苦労している現在の問題です（jQueryや純粋なJavascriptに関しては関係ありません）。

だから、いくつかの調査の後、私はこれを見つけました：https： //github.com/ivpusic/angular-cookie

これは、$ cookieStoreと非常によく似た「インターフェース」を提供します。また、有効期限（値と単位）を構成することを許可します。

$ cookieまたは$ cookieStoreを使用した有効期限のAngularネイティブサポートについては、1.4でこのテーマの更新を「彼ら」が約束します。これを調べてください：https：//github.com/angular/angular.js/pull/10530

$ cookieStore.put（...）で有効期限を設定することは可能ですが、少なくとも彼らはそれを提案しています...

編集： $ cookiesとangular-cookiemodularを混在させることができない「問題」が発生しました。したがって、$ cookieを使用するとが返されるため、ipCookie(...)retrieveを使用してcookieを設定した場合。ipCookie(...)undefined

@ vincent-brigliaが指摘したように、$cookieサービスが構成可能になるまでの回避策として使用できるjQueryドロップインがあります-ここで確認してください

https://github.com/ivpusic/angular-cookieを使用できます

まず、角度モジュールにipCookieを挿入する必要があります。

var myApp = angular.module('myApp', ['ipCookie']);

そして今、例えばあなたがあなたのコントローラーからそれを使いたいなら

myApp.controller('cookieController', ['$scope', 'ipCookie', function($scope, ipCookie) {
  // your code here
}]);

クッキーを作成するには

ipCookie(key, value);

この値は、文字列、数値、ブール値、配列、およびオブジェクトをサポートし、Cookieに自動的にシリアル化されます。

Cookieの有効期限が切れる日数など、いくつかの追加オプションを設定することもできます

ipCookie(key, value, { expires: 21 });