如何在 AngularJS 的 POST Header 中设置 Cookie

Question

我正在使用 Web 服务（Drupal 7 服务）通过使用 Ionic 框架的移动应用程序（不是浏览器）进行用户登录/注销。它要求我将 POST 方法的 Header 设置为与用户登录时设置的相同的 cookie。

1）如何使用AngularJS（1.3.5版）获取cookie头

登录时响应头中的cookie是

...
Set-Cookie: SESSd6f3e35b53c92bc6e830d79db4d6eb6c=AEFJYKD8s6vAsizxgYaNOJPy0dPMQ1rJX8RYO-cjfXs; 
...

2) 如何使用 AngularJS 将其放入 $http 标头中

接下来，如何为 POST 设置 Cookie。

$http({
    method    : 'POST',
    url       : '192.168.1.10/app/user/logout',
    dataType  : 'json',
    headers: {
      'X-CSRF-Token': token,
      'Content-Type': 'application/x-www-form-urlencoded',
      'Accept': 'application/json',
      'Cookie': 'SESSd6f3e35b53c92bc6e830d79db4d6eb6c=AEFJYKD8s6vAsizxgYaNOJPy0dPMQ1rJX8RYO-cjfXs, 
      // HOW to set this cookie using angular to the value that was read on login
    },
  })

Answer 1

我看到您使用的是旧版本的 AngularJS (1.3.5)。 在 1.3.5 中，您可以使用 $cookies 或 $cookieStore 服务。 请注意，$cookieStore 自 v1.4.0 起已弃用。

在 1.3.5 版本中使用 $cookies

$cookies.cookiename = cookieValue; //sets the cookie
var cookieValue = $cookies.cookiename; //reads the cookie

在 1.3.5 版本中使用 $cookieStore

$cookieStore.put(cookieName, cookieValue); //sets the cookie
var cookieValue = $cookieStore.get(cookieName);//reads the cookie

可以看到$cookies不支持1.3.5版本的方法。更高版本支持它们并且有更多方法，因为 $cookieStore 已弃用。

现在让我们将 cookie 名称设为 phpsessId，它是在您的登录请求后由服务器设置的。在您的控制器中，您可以按如下方式获取其值

var sessionId = $cookieStore.get('phpsessId')

现在http请求可以用这个cookie配置如下

$http({
    method    : 'POST',
    url       : '192.168.1.10/app/user/logout',
    dataType  : 'json',
    headers: {
      'X-CSRF-Token': token,
      'Content-Type': 'application/x-www-form-urlencoded',
      'Accept': 'application/json',
      'Cookie': sessionId
    }
  }).success(function(){...}).error(function(){...});

或者您可以为$http 1.3.5 docs 中提到的所有请求设置通用标头。

还要照顾forbidden header names。 Cookie 就是其中之一

希望这会有所帮助。