【问题标题】:Setting a cookie in AJAX request with AngularJS使用 AngularJS 在 AJAX 请求中设置 cookie
【发布时间】:2017-08-05 13:45:00
【问题描述】:

我正在尝试设置一个 cookie,其中包含从 AngularJS 中的 Ajax 请求中检索到的令牌值。

起初,我通过在我的html页面中简单地显示令牌值来测试请求的结果 -> {{myToken}}。结果是正确的。现在,我正在尝试将该值存储在 cookie 中。我为此添加的行写在**之间。

在我的 HTML 页面中,我导入了 angular.min.js (v1.4.8),然后导入了 angular-cookies.min.js (v1.6.3):

<!DOCTYPE html>
<html>

<head>

  <meta charset="UTF-8">
  <title>XXX</title>

  <link rel="stylesheet" href="assets/css/style.css" media="screen" type="text/css" />
  <script src="assets/scripts/angular.min.js"></script>
</head>

<body >

  <div ng-app="myApp" ng-controller="LoginCtrl">
    <h1>Log-in</h1><br>
    <form>
      <input type="text" name="user" placeholder="Username" ng-model="login">
      <input type="password" name="password" placeholder="Password" ng-model="password">
      <input type="submit" name="login" class="login login-submit" value="login" ng-click="myLogin()">
    </form>
    <div class="login-help">
      <a id="button-login" href="#">Register</a> • <a href="#">Forgot Password</a>
    </div>
<p>myToken: {{myToken}}</p>
  </div>

**<script src="assets/scripts/angular-cookies.min.js"></script>**
<script src="assets/scripts/myApp.js"></script>
<script src="assets/scripts/controllers/loginCtrl.js"></script>
</body>

</html>

myApp.js 现在非常简单:

var app = angular.module('myApp', [**'ngCookies'**]);

loginCtrl.js 包含调用myLogin() 时的Ajax 请求触发器。

app.controller('LoginCtrl', function($scope, $http**, $cookieStore**) {
  $scope.login     = "";
  $scope.password  = "";
  $scope.myLogin = function() {
    $http({ <request>})
    .then(function(response) {
      $scope.myToken = <token value>;
      **$cookieStore.put('myToken', $scope.myToken);**
    })
  };
});

我的页面存储在 WampServer 上,当我到达它时,我收到以下错误:

"Error: [$injector:unpr] http://errors.angularjs.org/1.4.8/$injector/unpr?p0=%24cookieStoreProvider%20%3C-%20%24cookieStore%20%3C-%20LoginCtrl

【问题讨论】:

    标签: angularjs ajax cookies cookiestore


    【解决方案1】:

    AnguleJS: API : $cookiesHow to access cookies in AngularJS?

    Angular 在 1.4.x 版本中不推荐使用 $cookieStore,因此如果您使用的是最新版本的 Angular,请改用 $cookies。 $cookieStore 和 $cookies 的语法保持不变

    app.controller('LoginCtrl', ['$scope', '$http', '$cookies', function($scope, $http, $cookies) {
        $scope.login     = "";
        $scope.password  = "";
        $scope.myLogin = function() {
            $http({ <request>})
            .then(function(response) {
                $scope.myToken = <token value>;
                $cookies.put('myToken', $scope.myToken);
            })
        };
    }]);
    

    【讨论】:

    • 在您建议的更改之后,我收到以下错误:"Error: [$injector:unpr] http://errors.angularjs.org/1.4.8/$injector/unpr?p0=%24cookiesProvider%20%3C-%20%24cookies%20%3C-%20LoginCtrl ,所以我现在明白为什么您还建议在方括号中添加一些声明([“未捕获的错误:[$injector :unpr]” 部署后带有角度](stackoverflow.com/questions/19671962/…))。我
    【解决方案2】:

    $cookieStore.put('myToken', $scope.myToken);无效,现在需要使用

     $cookies.put('myToken', $scope.myToken);
    

    【讨论】:

      【解决方案3】:

      好的,所以我犯了一些菜鸟错误。以下是现在对我有用的方法:

      1. 通过使用缩小的脚本,我需要映射范围"Uncaught Error: [$injector:unpr]" with angular after deployment
      2. 我需要声明相同版本的脚本。我现在使用 angular.min.js 和 angular-cookies.min.js 版本 1.6.3 (Index of /1.6.3/)
      3. 正如两位回复者所说,$cookieStores 很久以前就被弃用了$cookieStore deprecated

      【讨论】:

        猜你喜欢
        • 2014-02-08
        • 1970-01-01
        • 2017-12-04
        • 2021-12-28
        • 1970-01-01
        • 2015-12-21
        • 1970-01-01
        • 2016-07-21
        相关资源
        最近更新 更多