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

  2. 如果用户在登录时选择了“记住我”复选框,我们希望将授权信息存储在“永久 cookie”中。

4

8 回答 8

46

这在 Angular 的 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});
}]);
于 2015-03-13T13:20:09.537 回答
32

对于 1.4:正如这里的评论和下面的其他评论所述,从 1.4 开始,Angular 的原生 cookie 支持现在提供了编辑 cookie 的能力:

由于 38fbe3ee,$cookies 将不再公开代表当前浏览器 cookie 值的属性。$cookies 不再轮询浏览器以获取对 cookie 的更改,也不再将 cookie 值复制到 $cookies 对象上。

这已更改,因为轮询很昂贵,并且导致 $cookies 属性无法与实际浏览器 cookie 值正确同步的问题(最初添加轮询的原因是允许不同选项卡之间的通信,但今天有更好的方法来做到这一点,例如本地存储。)

$cookies 上的新 API 如下:

get put getObject putObject getAll remove 您必须明确使用上述方法才能访问 cookie 数据。这也意味着您无法再通过查看 $cookies 上的属性来检测浏览器 cookie 上发生的变化。

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

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

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

于 2013-12-14T02:56:17.900 回答
28

在 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.

作为第三个参数传递给上述函数的对象也允许其他选项,put例如设置path和。检查文档以获取概述。domainsecure

PS - 作为旁注,如果您正在升级$cookieStore已弃用的思维,那么$cookies现在是处理 cookie 的唯一方法。见文档

于 2015-03-04T12:44:31.927 回答
16

我想举一个额外的例子,因为有些人知道 cookie 生命周期的额外持续时间。IE。他们希望将 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');

如果为空,则返回未定义。

链接;

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

于 2016-09-09T11:08:45.170 回答
3

您可以转到 angular.js 脚本并更改插入 cookie
搜索,self.cookies = function(name, value) { 然后您可以更改添加 cookie 的代码,例如 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
于 2014-09-07T12:45:14.753 回答
2

我知道这个问题有点老了,并且已经有了一个公认的答案。

但仍然是我正在努力解决的一个当前问题(与 jQuery 或纯 Javascript 无关)。

所以,经过一些研究,我发现了这个: https ://github.com/ivpusic/angular-cookie

它提供了一个与 $cookieStore 非常相似的“界面”。并允许配置到期日期(值和单位)。

关于 $cookie 或 $cookieStore 的到期日期的角度原生支持,“他们”承诺在 1.4 上对此主题进行更新,请查看:https ://github.com/angular/angular.js/pull/10530

可以使用 $cookieStore.put(...) 设置到期日期,至少他们建议...

编辑:我遇到了一个“问题”,你不能将 $cookies 与 angular-cookie 模块化混合。因此,如果您设置一个 cookie 并使用ipCookie(...)检索它,ipCookie(...)因为使用 $cookie 它将返回undefined

于 2015-02-05T22:56:27.570 回答
1

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

于 2013-09-20T16:19:01.787 回答
0

您可以使用https://github.com/ivpusic/angular-cookie

首先,您需要将 ipCookie 注入您的 Angular 模块。

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

现在,例如,如果您想从控制器中使用它

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

创建 cookie 使用

ipCookie(key, value);

该值支持字符串、数字、布尔值、数组和对象,并将自动序列化到 cookie 中。

您还可以设置一些其他选项,例如 cookie 过期的天数

ipCookie(key, value, { expires: 21 });
于 2016-11-06T16:01:23.530 回答