OAuth2 与 Google - CORS 错误（Angular + Spring boot）

Question

我遇到 CORS 错误问题。我确实请求 Google oAuth2，但收到 CORS 错误：我想获得 google 身份验证并生成 JWT 令牌。当我在不使用客户端的情况下执行此操作时，一切都很好。当我发送角度请求时，这是 CORS 的问题。我允许所有类型的 CORS。为什么我会收到此错误？

Access to XMLHttpRequest at 'https://accounts.google.com/o/oauth2/v2/auth?response_type=code&client_id=1020159669873-d9r35ssmnejud852bam87d8gqtcj5qf1.apps.googleusercontent.com&scope=openid%20profile%20email&state=8nizHP1X2z9sA8m0vqM4Lzd6VT24R15eSw5flteTywM%3D&redirect_uri=http://localhost:8080/oauth2/callback/google' (redirected from 'http://localhost:8080/oauth2/authorization/google')

from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Cross-Origin Read Blocking (CORB) blocked cross-origin response https://accounts.google.com/o/oauth2/v2/auth?response_type=code&client_id=1020159669873-d9r35ssmnejud852bam87d8gqtcj5qf1.apps.googleusercontent.com&scope=openid%20profile%20email&state=8nizHP1X2z9sA8m0vqM4Lzd6VT24R15eSw5flteTywM%3D&redirect_uri=http://localhost:8080/oauth2/callback/google with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details.

我的角度请求：

 googleLogin(): Observable<LoginResponse> {

    return this.http.get<LoginResponse>

    (environment.baseUrl + '/oauth2/authorization/google')

      .pipe(tap(response => {

        localStorage.setItem('access_token', response.accessToken);

      }));

  }

//...

public onGoogleLogin(): void {

   this.authService.googleLogin().subscribe();

 }

//...

跨域资源配置：

 @Override

    public void addCorsMappings(CorsRegistry registry) {

        registry

                .addMapping("/**")

                .allowedOrigins("*")

                .allowedMethods("HEAD", "OPTIONS", "GET", "POST", "PUT", "PATCH", "DELETE")

                .maxAge(MAX_AGE_SECS);

    }

Answer 1

您无法在此示例中获取令牌，因为您需要进行实际的重定向。有几种方法可以规避此要求，RFC&nbsp;https://www.rfc-editor.org/rfc/rfc6749#section-1.2中有详细说明在弹出窗口中启动授权流程，并通过浏览器中提供的 API 将服务器收到的令牌postMessage()从弹出窗口传回 Web 应用程序。保存状态，无论状态是什么，重定向到将启动授权流程的服务器，并在将令牌交换为授权后，使用令牌作为查询字符串参数重定向回 Web 应用程序。然后使用它并恢复状态。