1. 首页
  2. 问题
  3. 如何在 AngularJS 中访问 c​​ookie？
小编典典

如何在 AngularJS 中访问 c​​ookie？

all

AngularJS 访问 cookie 的方式是什么？我已经看到了对 cookie 的服务和模块的引用，但没有示例。

有，还是没有 AngularJS 规范的方法？


阅读 58

收藏
2022-05-31

共1个答案

小编典典

此答案已更新以反映最新的稳定 angularjs
版本。一个重要的注意事项是$cookieStore周围有一层薄薄的包装纸$cookies。它们几乎相同，因为它们仅适用于会话
cookie。虽然这回答了最初的问题，但您可能希望考虑其他解决方案，例如使用 localstorage 或 jquery.cookie
插件（这将为您提供更细粒度的控制并执行服务器端 cookie。当然，在 angularjs
中这样做意味着您可能希望将它们包装在服务中并用于$scope.apply通知模型更改的角度（在某些情况下）。

另一个注意事项是，根据您是用于$cookie存储值还是$cookieStore. 当然，您真的想使用其中一个。

除了添加对 js 文件的引用之外，您还需要将其注入ngCookies到您的应用定义中，例如：

angular.module('myApp', ['ngCookies']);

然后你应该很高兴。

这是一个功能最小的示例，我在其中展示了它cookieStore是 cookie 的薄包装：

<!DOCTYPE html>
<html ng-app="myApp">
<head>
   <link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body ng-controller="MyController">

  <h3>Cookies</h3>
  <pre>{{usingCookies|json}}</pre>
  <h3>Cookie Store</h3>
  <pre>{{usingCookieStore|json}}</pre>

  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js"></script>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular-cookies.js"></script>
  <script>
    angular.module('myApp', ['ngCookies']);
    app.controller('MyController',['$scope','$cookies','$cookieStore', 
                       function($scope,$cookies,$cookieStore) {
      var someSessionObj = { 'innerObj' : 'somesessioncookievalue'};

    $cookies.dotobject = someSessionObj;
    $scope.usingCookies = { 'cookies.dotobject' : $cookies.dotobject, "cookieStore.get" : $cookieStore.get('dotobject') };

    $cookieStore.put('obj', someSessionObj);
    $scope.usingCookieStore = { "cookieStore.get" : $cookieStore.get('obj'), 'cookies.dotobject' : $cookies.obj, };
    }
  </script>

</body>
</html>

步骤是：

  1. 包括angular.js
  2. 包括angular-cookies.js
  3. 注入ngCookies您的应用程序模块（并确保您在ng-app属性中引用该模块）
  4. 向控制器添加$cookies或$cookieStore参数
  5. 使用点 (.) 运算符访问 cookie 作为成员变量 – 或 –
  6. cookieStore使用 put/get 方法访问
2022-05-31