如何在AngularJS中设置cookie的到期日期

Question

1. 我们希望将用户的授权信息存储在cookie中,在刷新(F5)浏览器时不应丢失.

2. 我们希望将授权信息存储在"永久cookie"中,以防用户在登录时选择"记住我"复选框.

Answer 1

这可以在1.4.0版本的角度使用ngCookies模块:

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});
}]);

Answer 2

对于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数据.这也意味着您无法再在$ cookies上查看属性以检测浏览器cookie上发生的更改.

仅当第三方库在运行时以编程方式更改cookie时,通常才需要此功能.如果依赖于此,则必须编写可以对第3方库做出反应的代码,以对cookie进行更改或实现自己的轮询机制.

实际的实现是通过$ cookiesProvider对象完成的,该对象可以通过put调用传递.

对于1.3及以下版本:对于那些尽力避免加载jQuery插件的人来说,这似乎是角色的一个很好的替代品 - https://github.com/ivpusic/angular-cookie

Answer 3

在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,您将看到过期将正确设置为名为的cookie someToken.

作为第三PARAM到传递的对象put上述功能允许其他选项,以及,诸如设置path,domain和secure.查看文档以获取概述.

PS - 作为附注,如果您正在升级$cookieStore已被弃用的头脑,那么$cookies现在是处理cookie的唯一方法.看文档

Answer 4

我想提供一个额外的例子,因为有些人知道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

Answer 5

正如 @vincent-briglia指出的，有一个 jQuery 插件可以用作解决方法，直到$cookie服务变得可配置 -请在此处查看