Angular 4 Front End gehostet auf Azure CORS Ausgabe

Question

Ich baue eine Web-App mit Angular 4, die versucht, an die VSTS Rest API zu senden. Ich bin offensichtlich nicht Eigentümer des Dienstes und versuche in Azure und NICHT lokal live zu laufen (ich verstehe, dass ich CORS in Chrome für lokale Tests deaktivieren kann).

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. 

Call ist im Grunde:

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); 

Zeit habe ich keinen Server/api (AKA das einzige, was in meiner Quelle ist eckig) und es läuft nur auf, was Server Azure Web-App zur Verfügung stellt.

Ist meine einzige Wahl um die CORS herumkommen Hinzufügen eines Nodejs-Server, um dies in Azur zu hosten?

Answer 1

Access-Control-Allow-Origin und Access-Control-Allow-Headers sind Antwort Header. Sie haben keinen Platz für Ihre Anfrage.

Das Hinzufügen von benutzerdefinierten Headern ist einer der Auslöser der Preflight-OPTIONS-Anforderung, die den 400-Fehler generiert.

Wenn Sie diese entfernen, sollte die Anfrage eine einfache Anfrage sein und möglicherweise vom Dienst genehmigt werden.

Fehler: Ja, Sie müssen den Host ändern, damit er Ihnen die Berechtigung erteilt.