与AngularJS的Express会话 [英] Express sessions with AngularJS

问题描述

我试图使用express和angularjs创建一个简单的登录。 angular js应用程序在单独的服务器（grunt服务器localhost：9000）上运行，而express应用程序在另一个端口上运行。对于我的快速应用，我设置了以下标题：

I am trying to create a simple login using express and angularjs. The angular js app runs on a separate server (grunt server localhost:9000) while the express app runs on another port. For my express app, I have the following headers set:

app.all('/*', function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "http://localhost:9000");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  res.header("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE");
  res.header("Access-Control-Allow-Credentials", "true");
  next();
});

我运行angular 1.0.7，这意味着我可以在配置步骤中设置一些默认值： / p>

I am running angular 1.0.7, meaning that I can set some defaults in the config step:

// Add COR ability
$httpProvider.defaults.useXDomain = true;
delete $httpProvider.defaults.headers.common['X-Requested-With'];

with $ http请求中的withCredentials：

And the withCredentials on the $http request:

$http({
   method : "GET",
   withCredentials : true,
   url : apiEndpoint + '/session'
}, success);

因此，使用我的应用程序登录后，会创建一个会话， 。使用chrome调试工具，我可以看到连接会话cookie正在与下一个后续请求（上面的会话调用）一起发送。但在服务器上， req.session 属性仍为空。当然，我可以只是主持角的应用程序与快速，并围绕所有这一切，但我宁愿保持两个项目/服务器分开。

So after logging in with my app, a session is created and a cookie can be seen in the response. Using chrome debugging tools, I can see that the connect session cookie is being sent with the next subsequent request (the session call above). On the server, however, the req.session property is still empty. Of course I could just host the angular app with express and get around all of this, but I'd rather keep the two projects/servers separate.

这是一个视图 / session 请求，连接会话cookie附加到请求：

This is a view of the /session request, with the connect session cookie attached to the request:

推荐答案

我不得不混淆几个不同的事情得到这个工作。首先，我升级到边缘角，因为一些值不能全局默认的$ http，我需要。

I had to mess around with a few different things to get this working. First, I upgraded to the edge angular, as some values could not be globally defaulted on $http that I needed.

在 config（）步骤中，我添加了：

// Add COR ability
$httpProvider.defaults.useXDomain = true;
$httpProvider.defaults.withCredentials = true;
delete $httpProvider.defaults.headers.common['X-Requested-With'];

在express中，我创建了一个角度中间件：

In express, I created an angular middleware:

exports.angularHeaders = function(req, res, next){
    res.header("Access-Control-Allow-Origin", '{{insert your ui endpoint}}');
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    res.header("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
    res.header("Access-Control-Allow-Credentials", "true");
    next();
};

这篇关于与AngularJS的Express会话的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！