使用 Spring Boot 和 Angular 2 CLI 进行 Google OAuth2 身份验证

Arn*_*els 5 google-login oauth-2.0 spring-boot angular-cli angular

我需要将社交登录集成到我的网络应用程序中。我的后端使用 Spring Boot,前端技术使用 Angular 2。我按照教程来设置我的项目。

这非常有效,Spring Boot 在 http://localhost:8080 上运行,Angular 2 在 http://localhost:4200 上运行。这样做的原因是我将 Angular-cli 用于实时重新加载开发服务器功能。

由于跨源策略,angular 项目需要使用代理。如上一个教程中所述,您需要配置一个 proxy.conf.json 文件:

{
  "/api": {
    "target": "http://localhost:8080",
    "secure": false
  }
}
Run Code Online (Sandbox Code Playgroud)

如果您这样做,您可以按如下方式访问 Spring API:例如 http:/localhost:4200/api/users(每个“/api”请求都将转发到 Spring 服务器)。

以上所有工作都完美无缺。现在我需要通过谷歌登录使用 Oauth2。我试过很多教程喜欢这个人,但我似乎无法管理工作这一点。

如果我尝试实现这一点并导航到 http://localhost:8080(从 Spring Boot 地址),我会被重定向到 google 登录页面,但是当尝试同样的事情时,例如 http://localhost:4200/api/authenticate 我总是立即重定向到 http:/localhost:4200/login 而不将我重定向到登录页面。

我在网上到处找,但似乎找不到这个特定的问题。任何人都可以帮助我理解或我做错了什么,也许有人有很棒的示例代码!

Arn*_*els 2

我找到了解决问题的方法。首先,我有一个带有“href=/api/authenticate”的登录链接,但这不起作用!

注意:@EnableOAuth2Sso 标准保护服务器上的每个路径,因此您只需访问受保护路径上的 API 即可重定向到登录页面

由于某种原因,http:/4200/api/authenticate什么也没做,只是立即将我重定向到http:/4200/login(我想如果身份验证失败或未通过身份验证,这一定是@EnableOAuth2Sso的标准行为?)

所以我将 href 更改为“href=http:/localhost:8080/api/authenticate”。这非常有效,并将我重定向到谷歌登录页面。

我遇到的另一个问题是重定向网址。我尝试将重定向网址直接设置为“http:/localhost:4200/profile”,以便在登录用户配置文件后进行导航,但由于某些奇怪的原因,这又不起作用。

经过一些测试后,我发现你需要首先重定向回你的 api 域(不知道为什么)。

因此,我将重定向网址设置为 http:/localhost:8080/callback,然后重定向到端口 4200 上的个人资料页面。

@GetMapping("/callback")
void redirect(HttpServletResponse response) throws IOException {
    response.sendRedirect("http://localhost:4200/profile");
}
Run Code Online (Sandbox Code Playgroud)

经过长时间的搜索和测试后,我觉得这在任何地方都没有记录。