Question

我们有一个API，Oauth2提供商。

从AngularJS客户端应用程序，我如何实现对此API的身份验证流程以获取未来请求的访问令牌？

我正在寻找的是一个Implicit Grant流程。

我会提供

{
    client-id: "abcdefghijklmnopqrstuvqxyz0123456789", 
    redirect_url: "http:localhost:8080/provider_cb",
    response_type: "token"
}

我在后端有一个Rails REST API，并为Oauth2提供了一个门卫/设计。

我遇到angular-oauth，似乎在某种程度上解决了这个问题。但是，

我不希望提供令牌验证功能（这是强制性的）
我不想为登录打开一个新的窗口弹出窗口（希望在同一个窗口中进行重定向）

现在，

Q1。我不明白的是整个过程是如何开始的，我不能发出任何$ http请求，这会返回一个SignIn HTML页面。我应该使用$ location服务重定向到登录页面吗？或者我应该有一个指向/ oauth / authorize的整个GET请求的链接吗？...

Q2，如何在SignIn之后捕获重定向以提取access_token？

Q3。知道任何负责Oauth2身份验证的服务或标准的Angular方式吗？

Answer 1

让我们回答你的三个问题：

Q1 ）您应该基本了解一般的OAuth2流程。它不是您正在研究的特定于AngularJS的实现。如果您不想使用弹出窗口进行授权，那么在返回之后您必须耍一下才能使redirect_url /状态正常工作（如果您想要#state - 保存 - 否则只需指定你的条目 - redirect_uri中的网址）。您不应该使用$ http进行重定向，因为这仅适用于XHR和类似的调用。要让您的用户访问登录页面，只需执行操作即可 $ window.location.href ='http://yourlogin.com/oauthloginpage';

然后您的应用将重定向到登录页面 - 请不要忘记redirect_url的参数。如果需要，还可以在请求中指定其他参数，如“scope”/“state”。

Q2 ）重定向AFTER Login将重定向到您在redirect_url中指定的uri。然后会出现类似http://myapp.com/#access_token=foobar&refresh_token=foobar2&state=loremipsem

的内容

只需使用以下代码获取角度的部分：

var currentURL = $location.absUrl();
var paramPartOfURL = currentURL.slice(currentURL.indexOf('#') + 1);

然后将paramPart解析为带有split（'＆amp;'）的数组，并通过查找“key”access_token进行迭代，并且 - 瞧 - 您的access_token已准备好进入本地存储/服务/ cookie

您可以使用其他实现将URL拆分为多个部分 - 可能有一个更好的实现，但这将是“快速拍摄”。解析后，您可以使用正常的$ location.path（....）调用将用户再次重定向到正确的状态，并消除OAuth2的＃参数。

Q3 ）如果您想要一种映射AngularJS-app的源状态/路由的方法 - 如果您的OAuth2-Server实现了它，请尝试滥用state参数。这将在请求后继续＆lt; - ＆gt;响应。对于非弹出式实现，我目前不知道任何其他模块。

使用OAuth2的另一种方法是自己实现登录页面，然后与oauth2提供程序进行交互，使用Basic Auth或其他方法对休息调用做出反应。然后你可以使用$ http调用。

AngularJS和Oauth2提供程序的身份验证？

1 个答案: