访问 gmail api 时没有“Access-Control-Allow-Origin”

Question

我在这个测试中使用 spring oauth2 和 angular。 Spring Boot 应用程序位于端口 8081 上，Angular 位于 4200 上，我在 Spring 上为端口 4200 设置了 CORS。当我点击 Gmail 按钮时，Spring 没有给出任何异常，仅在 chrome 上，我得到了 No 'Access-Control-Allow-Origin' 错误。

Java 代码：

@Autowired
    private OAuth2ClientContext oauthClientContext;

    @Value("${cross-origin-url}")
    private String crossOriginUrl;

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        // TODO Auto-generated method stub
        http.cors()
            .and().csrf().csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse())
            .and()
            .antMatcher("/**").authorizeRequests()
                .antMatchers("/login**","/","/test","/login/gmail").permitAll()
                .anyRequest().fullyAuthenticated()
            .and()
            .addFilterBefore(oauthGmailFilter(), BasicAuthenticationFilter.class)
            ;
    }

    @Bean
    public CorsConfigurationSource corsConfigurationSource() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration cors = new CorsConfiguration();
        cors.addAllowedOrigin(crossOriginUrl);
        source.registerCorsConfiguration("/**", cors.applyPermitDefaultValues());
        return source;
    }

    @Bean
    public Filter oauthGmailFilter() {
        OAuth2ClientAuthenticationProcessingFilter gmailFilter = new OAuth2ClientAuthenticationProcessingFilter("/login/gmail");
        OAuth2RestTemplate gmailTemplate = new OAuth2RestTemplate(gmail(),oauthClientContext);
        gmailFilter.setRestTemplate(gmailTemplate);
        UserInfoTokenServices tokenService = new UserInfoTokenServices(gmailResource().getUserInfoUri(),gmail().getClientId());
        tokenService.setRestTemplate(gmailTemplate);
        gmailFilter.setTokenServices(tokenService);
        return gmailFilter;
    }

    @Bean
    @ConfigurationProperties("gmail.client")
    public AuthorizationCodeResourceDetails gmail() {
        return new AuthorizationCodeResourceDetails();
    }

    @Bean
    @ConfigurationProperties("gmail.resource")
    public ResourceServerProperties gmailResource() {
        return new ResourceServerProperties();
    }

    @Bean
    public FilterRegistrationBean<OAuth2ClientContextFilter> oauth2ClientFilterRegistration(OAuth2ClientContextFilter filter) {
        FilterRegistrationBean<OAuth2ClientContextFilter> registration = new FilterRegistrationBean<OAuth2ClientContextFilter>();
        registration.setFilter(filter);
        registration.setOrder(-100);
        return registration;
    }

我正在关注这个教程：https://spring.io/guides/tutorials/spring-boot-oauth2/#_social_login_click

Gmail login button

Gmail API setup

Application.properities:

教程链接中的代码相同，我只是从 facebook 更改为 gmail。我已经将 localhost:8081 添加到 Gmail API，但我仍然收到以下错误

感谢您的帮助，我无法弄清楚我的应用出了什么问题。

Answer 1

几天前遇到同样的错误， 我的问题是我没有提供 API 密钥以及内容类型

所以我创建了一个名为 httpOptions 的对象，其中包含一个新的 httpHeader，然后我将它添加到我的 api 调用中，如下所示：

import { HttpClient, HttpHeaders } from "@angular/common/http";

  constructor(private httpClient: HttpClient) {}

      httpOptions = {
    headers: new HttpHeaders({
      "Content-Type": "application/json",
      Authorization: "API_KEY"
    })
  };

  createNewSubscriber() {
    this.httpClient
  .post(
    "https://endpoint",
    {
      name: this.data.form.manager.managerFirstName,
      last_name: this.data.form.manager.managerLastName,
      email: this.data.form.manager.managerEmail,
      external_id: this.data.managerUUID,
      group_id: `${this.data.form.companyName}${this.data.form.teamName}`
    },
    this.httpOptions
  )
  .subscribe(
    data => {
      console.log("POST Request is successful ", data);
    },
    error => {
      console.log("Error", error);
    }
  );
};

这对我有用，希望它也对你有用

祝你好运！