OAuth2：从隐式流中提取 access_token 片段

Question

我不太清楚如何处理 oauth2 隐式流响应。我使用 angular4 创建了一个 SPA。据我所知，我需要创建一个请求，如下所示：

GET /authorize?
  response_type=token&
  client_id=s6BhdRkqt3&
  state=xyz&
  redirect_uri=<<uri-located-into-SPA>>

我不太了解的是如何处理响应。响应是对先前指定的redirect_uri 查询参数的重定向。

HTTP/1.1 302 Found
Location: <<uri-located-into-SPA>>#access_token=2YotnFZFEjr1zCsicMWpAA&
    state=xyz&
    token_type=example&
    expires_in=3600

那么，我应该如何实现<<uri-located-into-SPA>> 以提取access_token，我应该设置哪个？

Answer 1

重定向 URI（例如 /auth/oauth2）应映射到将当前浏览器 URL 的 parse the hash part 的组件，将 access_token 值保存在某处（sessionStorage、localStorage 或某些 Angular 服务或存储）。如果您想将访问令牌与每个后端请求一起发送，请创建一个 HttpInterceptor（来自新的 Angular HttpClient API）并将其添加到那里。

如果您想在访问令牌过期之前刷新访问令牌，您还应该设置一个超时功能来刷新访问令牌（使用隐藏的iframe 和prompt=none URL 参数）。

组件不需要有任何真实的视图。处理完成后，只需将路由更改为某个现有应用程序组件 - 初始视图或身份验证之前请求的视图。