2017-09-25 54 views
0

我正在构建一个尝试向VSTS Rest API发布POST的Angular 4的Web应用程序。我显然不拥有这项服务,我试图在Azure中运行而不是在本地运行(我知道我可以在本地测试中禁用chrome中的CORS)。在Azure CORS上托管的Angular 4前端问题

Failed to load 
https://app.vssps.visualstudio.com/oauth2/tokenRemovedtoStackOverflow 
Response to preflight request doesn't pass access control check: No 'Access- 
Control-Allow-Origin' header is present on the requested resource. Origin 
'https://blah.azurewebsites.net' is therefore not allowed access. The 
response had HTTP status code 400. 

通话基本上是:

private _appID = blah; 
private _tokenRequest = 'client_assertion_type=urn:ietf:params:oauth:client-assertion-type:jwt-bearer&client_assertion={0}&grant_type=urn:ietf:params:oauth:grant-type:jwt-bearer&assertion={1}&redirect_uri={2}'; 
    private _returnURI = 'https://blah.azurewebsites.net/'; 
    private headers = new Headers(
    { 
     'Access-Control-Allow-Origin': '*', 
     'Access-Control-Allow-Headers': 'Content-type', 
     'Content-Type': 'application/x-www-form-urlencoded', 
    }); 

    constructor(private http: Http) { } 

    getAccessToken(code: string): Observable<IToken> { 
    const _url = 'https://app.vssps.visualstudio.com/oauth2/' + code; 
     const body = 'client_assertion_type=urn:ietf:params:oauth:client-assertion-type:jwt-bearer&client_assertion=' + 
     this._appID + 
     '&grant_type=urn:ietf:params:oauth:grant-type:jwt-bearer&assertion=' + 
     code + '&redirect_uri=' + 
     this._returnURI; 
    const options = new RequestOptions(); 
    options.headers = this.headers; 

     return this.http 
     .post(_url, body, options) 
     .map((response: Response) => <IToken[]> response.json()) 
     .do(data => console.log('All: ' + JSON.stringify(data))) 
     .catch(this.handleError); 

目前我没有服务器/ API(AKA在我的源代码的唯一事情就是角),它只是在任何服务器Azure的Web应用程序提供运行。

我唯一的选择是绕过CORS添加一个nodejs服务器来在azure中托管这个服务器吗?

回答

2

Access-Control-Allow-OriginAccess-Control-Allow-Headers响应头。他们没有你的要求的地方。

添加自定义标题是生成400错误的预检选项请求的触发器之一。

删除它们应该会导致请求成为一个简单的请求,并可能被服务所允许。

失败:是的,您需要更改主机,以授予您权限。