Rails 关于前后端分离项目的 Token 存储问题

wfwdex · 2016年09月22日 · 最后由 wfwdex 回复于 2016年09月23日 · 20866 次阅读

目前在做一个前后端分离的项目,后端是 Rails5 API only,前端是用 vue.js,这是我第一次做,而且 vue.js 也是边学边做。

在做认证的时候,我通过用户名 + 密码登录并获取服务端的 token,这时候我面临两个选择来存储这个 token。

  • 将 token 存在 cookie 里,为了防止 xss 攻击,最好要给 cookie 加上 httponly,而 Rails5 我用的是 API only 模式,不支持服务器下发 SET-COOKIE header
  • 将 token 存在 localStorage 中,但这样没办法防止 xss 攻击

请问大家一般是怎么解决这个问题的?有没有最佳实践?

1楼 已删除

来回发呗,一请求一变。

[Update] 说到这里,给你推荐个方案:https://github.com/hlcfan/faceless 封装的 UCenter 的 Auth code 的做法。

可以在服务器上配置吧(nginx : add_header Set-Cookie "HttpOnly=true";)

#2 楼 @hlcfan 能详细介绍下吗?我看了一下 faceless 的源码,没看明白,我的客户端是由 vue.js 写的,能应用这种做法吗?

#3 楼 @hxh1246996371 但 Rails5 我用的是 API only 模式,不支持 cookie 的情况下,即使设置了 nginx,也不能下发 cookie,所以用 nginx 来设置 httponly 就是虚设吧。

#4 楼 @wfwdex API 模式是不支持 cookie 的,可以带到 http request header 里面吧

另外参考一下 JSON web token https://jwt.io/

#5 楼 @hxh1246996371 我只是不确定这是不是最佳实践,另外 jwt 其实也是需要客户端保存 token 的吧,每次请求也要在 header 上带上 token。最终还是保存的问题。

8楼 已删除

前端没有绝对的安全,你可以混淆存储。

#10 楼 @hww 谢谢,看到他也是用 localStorage,我还是就用这个吧

localStorage 等同于客户端的数据库,没有任何清除和过期机制,除非你有代码指挥客户端清除。不熟最好不要碰。用 cookie 就好了,总之是找个地方存然后放到 header,和后端能不能接受 cookie 完全没有关系。

可以将 token 存储在 localstorage 里面,在一个统一的地方复写请求头,让每次请求都在 header 中带上这个 token, 当 token 失效的时候,后端肯定会返回 401,这个时候在你可以在前端代码中操作返回登陆页面,清除 localstorage 中的 token 就好。

@wfwdex 没必要看 faceless 源码 我也看不懂 :D 因为肯定需要一个 token 用来验证用户信息的,通过 faceless 来混淆。存在 localStorage 或者 cookie 都可以。

#13 楼 @xifengzhu 谢谢回复,受到了你的启发,我决定把 token 存在当前 app 的运行时状态里,因为这是个后台管理系统,我也不想做成保存认证状态,每次关掉浏览器标签就丢失 token,每次重新打开都要登陆就好了。

需要 登录 后方可回复, 如果你还没有账号请点击这里 注册