oauth 预检响应具有无效的 HTTP 状态代码 403答案

【问题标题】：oauth Response for preflight has invalid HTTP status code 403oauth 预检响应具有无效的 HTTP 状态代码 403
【发布时间】：2018-04-05 03:43:08
【问题描述】：

技术：弹簧靴角度 2 谷歌认证

spring boot 代码尝试连接到 google auth 进行登录。角度代码使 http.get 获取用户信息。我收到上述 403 错误。早些时候，我在 Firefox 中得到“CORS 预检通道未成功”。迁移到 chrome 会给我 403。

我搜索了 SO 和谷歌。尝试了一些修复，但没有解决我的问题。任何帮助表示赞赏。

sring 启动控制器

    @CrossOrigin(origins = {"http://localhost:4200"})
    @RestController
    public class UserRestController {

     @RequestMapping("/")
     public RedirectView index()
     {
         RedirectView redirectView = new RedirectView();
         redirectView.setUrl("http://localhost:4200/");
         return redirectView;
//         return "index";
     }


     @CrossOrigin(origins = {"http://localhost:4200"})
    @RequestMapping("/user")
    public Principal sayHello(Principal principal) {
        return principal;
    }
    }

角2码

import { Component, OnInit  } from '@angular/core';
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import {Headers, RequestOptions} from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

@Injectable()
export class AppComponent implements OnInit {
  title = 'app works!';
  user : any;

private headers:Headers = new Headers({'Content-Type': 'application/json'});

private auth64 = btoa("my-trusted-client:secret");
private tokenHeaders = new Headers({
'Content-Type': 'application/x-www-form-urlencoded',
'Authorization': 'Basic '+this.auth64
});

    constructor(private http : Http){
    }


    // method for getting user details
     getUser() {
        // this.http.get('http://localhost:8080/user').success(function(user) {
        //  this.user = user;
        //  console.log('Logged User : ', user);
        // }).error(function(error) {
        //  // $scope.resource = error;
        // });

        let options = new RequestOptions({ headers: this.tokenHeaders});
        // let options = { headers : this.tokenHeaders};

        this.http.get('http://localhost:8080/user', options)
        .subscribe ((data :Response)=> {
            this.user = data;
            console.log('Logged User : ', data);
        });
    }


    // method for logout
    logout() {

        // this.http.post('http://localhost:8080/logout', null);
            this.user = null;

    }


  ngOnInit() {
    this.getUser();
  }

}

【问题讨论】：

标签： angular spring-boot google-oauth

【解决方案1】：

试试这个：

https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi

这是一个 chrome 扩展，可帮助您继续进行开发和测试。

用于生产：

我对 spring 了解不多，但是当我遇到同样的问题时，这是我在 PHP 代码中所做的。

header('Access-Control-Allow-Origin: *'); 
header("Access-Control-Allow-Credentials: true");
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
header('Access-Control-Max-Age: 86400'); // for 1 day
header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token , 
Authorization');`

希望对你有帮助！

【讨论】：

谢谢。 chrome 工具有帮助。现在错误是“无效的 CORS 请求”。让我寻找解决办法。
您是否尝试添加我提到的标题，如果它真的对您有帮助，请点赞。

【解决方案2】：

请查看此答案https://stackoverflow.com/a/46433046/836701 并且您想使用您用于身份验证的相同库在 API 中获取有关用户的信息。

【讨论】：