我想在我的网站上使用 Twitch 进行 oauth2 登录，我有一个 angular2 网站，我正在使用路由器链接。 当我想用 twitch acc 登录我说是的，是我，所以一切都很好。好的结束不是xD
当我转到抽搐 oauth2 进行授权时，我需要一个重定向 Uri。我的问题是现在如何在 angular2 中做到这一点？因为我不能打字 www.page.com/app/afterlogin/afterlogin.php 或类似的想法。
我需要这个，因为我需要用户的访问令牌，我不希望他需要授权自己 x 次。
也许这有助于帮助我：
https://api.twitch.tv/kraken/oauth2/authorize?client_id=[client_id]&redirect_uri=http://www.page.com/app/AfterLogin/afterlogin.php&response_type=code&scope=user_read
我希望有人可以帮助我重定向和一些 oauth2 登录:)
让我假设一个带有单页应用程序前端的 RESTful 后端并回答这个问题。一般过程如下
您的SPA -->您的服务器 -->您的提供商 -->您的浏览器 -->您的提供商 -->您的服务器 -->您的SPA
- 您的SPA =>初始化登录并预览
redirect_uri - 您的服务器 => 将
redirect_uri存储在 cookie 中并将请求发送到 供应商 - 您的提供程序 => 获取成功和失败 URL 并加载登录页面 到您的浏览器
- 您的浏览器 => 加载提供商登录页面
- 您的提供程序 => 向服务器发送请求成功或失败 处理器
- 您的服务器 => 提取
redirect_uri并重定向浏览器 到它 - 您的 SPA => 从
redirect_uri获取afterLoginUrl并路由 用户到它
以下是实现此目的的步骤
当前端将身份验证请求发送到服务器时， 附加
redirect_uri。在该 URL 中，传递afterLoginUrl查询 参数。前端 SPA 使用它将用户路由到 触发登录的特定页面。(即，如果请求有 由尝试访问的用户触发{base_uri}/profile/project/projects例如，这是一个很好的 将用户路由到此页面而不是默认页面的做法 正常登录需要喜欢的页面base_uri/profile/about)。如 结果，您将得到如下所示的url。`http://localhost:8080/oauth2/authorize/google?redirect_uri=http://localhost:4200/oauth2/redirect&afterLoginUrl=/profile/project/projects`端口 8080 用于后端，4200 用于前端。
由于您使用的是 RESTful 服务，因此您无法将
redirect_uri保存在服务器上(因为 REST 是无状态的)。因此，您需要将其与您作为 cookie 发送给提供商的请求一起发送。当从提供商处获得成功时，您将通过提取您发送的 cookie 来知道要命中您的 SPA 的哪条路线。然后，在前端应用中专用于一条路由来处理来自您自己的服务器(在我的情况下
oauth2/redirect)的请求。在步骤 3 中为路由指定的组件上，您将收到
token和afterLoginUrl(如果有)。您将在网址上看到类似以下内容的内容http://localhost:4200/oauth2/redirect?afterLoginUrl=/profile/project/projects&token={token value}验证令牌，检查是否有
afterLoginUrl，如果存在路由，则重定向到afterLoginUrl指定的路由，如果没有，则重定向到默认配置文件页面。
我认为可以在这里找到一个很棒的资源。
授权代码授予流只是如何使用 OAuth2 的几种方法之一。它不适合在浏览器中运行的应用程序，因为它需要一个客户端密钥，您无法在浏览器中保持安全。
还有另一个流 - 用于 JavaScript 应用程序的隐式流 - 您在重定向 URI 中获得访问令牌和/或 ID 令牌 - 在哈希部分 (#...) 中，因此它们不会到达服务器。然后，您可以轻松地将任何角度路由路径用作重定向 URI。因此，来自 OAuth2 服务器的重定向 URL 可能如下所示：
http://example.com/myAngularApp/afterLogin#token=...
当您到达该 URI 时，您只需保存令牌并将路由更改为某种真实形式。