TL;博士:
无法通过 Express、Express-Session 和 Express-Cors 在 Backbone 应用程序和 Node.js 服务器之间执行的多个 API 调用中成功保持会话。每次通话后似乎会话都会重新初始化/丢失。
长版:
我正在运行一个客户端 Backbone/React/Flux 应用程序,在运行localhost:3000
的 Node.js 服务器上执行以下调用localhost:4242
:
Http 调用
RESPONSE HEADERS
Content-Type application/json; charset=utf-8
Set-Cookie connect.sid=s%3AFeNYY5GQGvkyRvOym7DhysprePaQr7xP.BrxOPP56k9pDpxQPvwjDFaxkEYoHU%2FAEtNUIXGltqjI; Domain=http://localhost:3000; Path=/
Vary Origin
X-Powered-By Express
access-control-allow-credentials true
access-control-allow-orign http://localhost:3000
[...]
REQUEST HEADERS
Accept application/json, text/javascript, */*; q=0.01
Content-Type application/json; charset=utf-8
Cookie connect.sid=s%3AjP4iADZvRnDHbJcCE8H81Zy6TIehj9BJ.eDOTw44GcHqq8i2dslBGd43tXMQ22ENl31fRizdC8iA
Host localhost:4242
Origin http://localhost:3000
Referer http://localhost:3000/login
[...]
RESPONSE HEADERS
Content-Type application/json; charset=utf-8
Set-Cookie connect.sid=s%3ARxf91_vLMBqzB6xN-0QFIIk_-SyBP9_8.F1Mr%2BVSkYNJ6MqnzO%2BsxxfwXRinIX6th80SoukG1QBM;Domain=http://localhost:3000; Path=/
Vary Origin
X-Powered-By Express
access-control-allow-credentials true
access-control-allow-orign http://localhost:3000
[...]
REQUEST HEADERS
Accept application/json, text/javascript, */*; q=0.01
Content-Type application/json; charset=utf-8
Cookie connect.sid=s%3AjP4iADZvRnDHbJcCE8H81Zy6TIehj9BJ.eDOTw44GcHqq8i2dslBGd43tXMQ22ENl31fRizdC8iA
Host localhost:4242
Origin http://localhost:3000
Referer http://localhost:3000/login
[...]
基本上,第一个调用POST /api/session
是登录用户并尝试在会话中存储 API 令牌。第二次调用GET /api/users
在第一次调用成功后立即触发,并检索用户信息。
骨干法
这是我在 Session 模型上用于登录的 Backbone 方法:
login: (options) ->
@set {user: options.user, password: options.password}
@save ['user', 'password'],
success: (data) =>
@set({authenticated: true, accessToken: data.accessToken, password: null})
options.success(data) # trigger the second call here
error: (error) =>
options.error(error)
以及在我的 UserStore 中对 /api/users 的调用
users: (options) ->
@users.fetch
success: (users) =>
@users = users
options.success(users)
使用这些不同的选项(我在 Backbone.Collection/Backbone.Model 中覆盖了 Backbone.sync):
class UsersCollection extends Backbone.Collection
url: '/api/users'
model: UserModel
sync: (method, model, options) ->
options ?= {}
options.url ?= @url
options.dataType ?= 'json'
options.contentType ?= "application/json; charset=utf-8"
options.crossDomain ?= true
options.xhrFields ?= {"withCredentials": true}
super(method, model, options)
(简化版:模型和集合都是一样的,使用 BaseCollection 和 BaseModel,我在其中覆盖了 sync() 方法)。
所以Console.log(options)
inBackbone.sync(method, model, options)
正在返回:
{"url":"http://localhost:4242/api/session","dataType":"json","contentType":"application/json; charset=utf-8","crossDomain":true,"validate":true,"parse":true,"xhrFields":{"withCredentials":true}}
Node.js 设置和方法
这是我的 Node.js 路由器设置 Express :
BodyParser = require 'body-parser'
Session = require 'express-session'
Cors = require 'cors'
class Router
constructor: (express) ->
@express = express
@express.use BodyParser.json()
@express.use Cors(@corsConfig())
@express.use Session(@sessionConfig())
# Express routes are set here
# @express.post '/api/session', (request, response) => [...]
# @express.get '/api/users', (request, response) => [...]
corsConfig: ->
origin: 'http://localhost:3000'
credentials: true
sessionConfig: ->
secret: 'whatever'
cookie:
secure: false
httpOnly: false
domain: 'http://localhost:3000'
这是我的 Node.js 方法处理POST /api/session
login: (request, response) ->
session = request.session
console.log JSON.stringify(session)
console.log request.sessionID
console.log '---------------------------------------------'
if session.accessToken
console.log 'session with token!'
response.json {accessToken: session.accessToken}
else
console.log 'performing credentialAuthentication'
user = request.body.user
password = request.body.password
@whatever.authentication
user: user
password: password
success: (accessToken) ->
request.session.accessToken = accessToken
console.log JSON.stringify(session)
console.log request.sessionID
console.log '---------------------------------------------!!!'
response.json {accessToken: accessToken}
# also tried with response.send()
和一个处理GET /api/users
@express.get '/api/users', (request, response) =>
console.log JSON.stringify(request.session)
console.log request.sessionID
console.log '---------------------------------------------'
[...]
Node.js 日志
这是日志:
express:router dispatching OPTIONS /api/session
express:router dispatching POST /api/session
{"cookie":{"originalMaxAge":null,"expires":null,"secure":false,"httpOnly":false,"path":"/"}}
zse18d2zrNRdEXPjFHF0gm3NkONb-_5V
---------------------------------------------
performing credentialAuthentication
{"cookie":{"originalMaxAge":null,"expires":null,"secure":false,"httpOnly":false,"path":"/"},
"accessToken":"ebab5010f9ece5ea984e4b73f9a46ef3"}
zse18d2zrNRdEXPjFHF0gm3NkONb-_5V
---------------------------------------------!!!
express:router dispatching GET /api/users
{"cookie":{"originalMaxAge":null,"expires":null,"secure":false,"httpOnly":false,"path":"/"}}
g8YXQEpt_rnWSGdh1nCKMndiI8Lt2UDq
---------------------------------------------
如您所见,CORS 请求正常执行,我正确获取了我的令牌,然后尝试将其存储在会话中。
但是,在第二次调用中,会话没有持久化,我无法访问我在第一次调用中实际设置的变量 (accessToken)。
查看日志和两个调用的 HTTP 标头,看起来会话每次都重新初始化,因为会话 ID 正在更改并且每个请求 - 并且每次都发送一个 Set-Request 标头(不应该据我所知,情况就是这样)。
我怀疑这种行为是由 CORS 级别的一些不连贯或缺失的配置引起的,或者是由于path
Sessions (Express.use(path, middleware)
和Cookie({path: '/'})
) 的设置引起的。然而,尽管多次尝试使用不同的配置、设置和标题,我真的无法让它工作。
非常欢迎任何能够就这种行为以及我所缺少的东西给予我启发的人:)
谢谢!
PS:我向非 CoffeeScript 开发者道歉 ;)