2017-09-25 55 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錯誤的預檢選項請求的觸發器之一。

刪除它們應該會導致請求成爲一個簡單的請求,並可能被服務所允許。

失敗:是的,您需要更改主機,以授予您權限。