单页应用程序上的用户身份验证？答案

【问题标题】：Authentication for users on a Single Page App?单页应用程序上的用户身份验证？
【发布时间】：2012-09-12 03:42:19
【问题描述】：

我开发了一个单页应用原型，它在前端使用 Backbone，并将从服务器上的瘦 RESTful API 中使用它的数据。

来自繁重的服务器端应用程序开发（php 和 python），我真的很喜欢带有厚客户端 MVC 的新的不同设计方法，但对于如何最好地将应用程序限制为登录的经过身份验证的用户感到困惑。

我更喜欢让应用程序本身在登录之后，并且除了网站的本机登录之外，还希望最终实现其他类型的登录（openid、fb connect 等）。我不清楚这是如何完成的，并且一直在搜索 - 但是没有成功找到让我明白的信息。

总的来说，目前注册用户并要求他们登录才能使用您的单页应用程序的最佳做法是什么？

用户登录后，api 请求如何进行身份验证？我可以存储一个会话，但是如何在 API 调用中检测这个会话，或者是否有一个令牌我必须在每个 API 调用中传递？对此的任何答案将不胜感激！

【问题讨论】：

你最后做了什么？如果现有答案之一已解决，请选择一个答案或添加您自己的解决方案？

标签： javascript authentication backbone.js javascriptmvc single-page-application

【解决方案1】：

我见过的最 RESTful 方式是基于 OAuth 客户端凭据流，基本上是您发布用户名/密码的 /token 端点，该端点返回此会话的访问令牌。之后的每个 ajax 请求都会附加一个带有令牌的 Authorization 不记名标头。您可以将令牌存储在全局变量中以保留它直到页面刷新/关闭，使用本地存储来保持用户在会话之间登录，或使用 javascript cookie。如果你不喜欢令牌的想法，那么你可以使用旧的 cookie 方法，无论如何都会自动发送任何 ajax 请求。

至于 facebook/google 等，我通常遵循 stackoverflow 方法，将外部用户登录与帐户相关联。然后使用一个相当普通的基于服务器的 oauth dance（虽然你可以用 ajax 请求替换所有对服务器的请求，只需稍作修改，我只是发现它并没有太大的区别，因为无论如何你都需要在你和服务器之间进行重定向）。我通常为 facebook 登录发布一个加密的 cookie，然后我使用与上述类似的方法将其转换为令牌（只需发送带有请求而不是用户名/密码的 cookie）。

【讨论】：

【解决方案2】：

我们使用基于 django cookie 的身份验证，并为登录和单页应用程序提供单独的页面。非常适合我们的用例。我们使用了我在这里描述的基于 Backbone 的会话管理系统：backbone.js - handling if a user is logged in or not

【讨论】：

我做了一些类似于链接的事情。我有一个仅处理身份验证（登录/注销）的模型，在服务器端验证它然后发回响应。然后，成功或错误回调会发出我的应用程序和视图正在侦听的事件。从服务器返回时，我发送一个加密的 cookie 会话，然后在每次调用时使用它来验证它们是否经过身份验证。
@orangewarp：你所描述的听起来很像（如果不完全是）我们需要的。我们使用的是 knockout.js，而不是bone.js。有什么方法可以提供有关如何实施解决方案的更多详细信息？也许一些示例代码？谢谢！

【解决方案3】：

我们正在使用 Angular.js，并且还有一个单独的登录页面。单独的页面加载单独的单页（和安全）应用程序，该应用程序使用 http XHR 请求调用服务器，发送用户名和密码。如果服务器对凭据进行了身份验证，则 javascript 代码会设置一个 cookie。此 cookie 可以从“另一端”读取，即非安全应用程序。在 cookie 中，我们只输入用户名，当然，没有密码或其他安全信息。那么我们可以展示类似'Not Lior?在非安全应用程序上注销。

唯一需要注意的是重写 Angular 的 cookie 机制来设置无限期过期，最重要的是，根路径：

$document[0].cookie = 'username=' + escape($scope.userName) + ";expires=Thu, 01 Jan 2970 00:00:00 GMT; Path=/";

【讨论】：