2017-01-03 2 views
1

Erstellt eine MEAN-Stack-App und ich habe eine eckige Komponente, die beim Laden der Seite eine Anfrage an die Amazon Product API stellt. Ich laufe und teste lokal auf localhost (node ​​/ express backend). HierAngular CORS mit Amazon Product API

ist die grundlegende Anforderungs-Code in meiner Komponente:

getAmazonTackle(amz:amazonservice) { 
var req:Object = { 
    method: this.amazonservice.Method, 
    url: this.amazonservice.Endpoint, 
    headers: { 
    //"Access-Control-Allow-Origin":"*" 
    }, 
    data: this.amazonservice.Data, 
    withCredentials: false 
} 
console.log(JSON.parse(JSON.stringify(req))); 
this.$http(req).then(
    function(response) { 
    console.dir('The response: '+response); 
    }, 
    function(response) { 
    console.dir(response); 
    console.dir('The error:'+response); 
    } 
) 

}

Wenn ich nicht über die Access-Control-Allow-Origin Header, den Zugriff auf die Seite im Browser präsentierte ich bin mit dem folgenden in der Chrome dev-Konsole:

XMLHttpRequest cannot load http://webservices.amazon.com/onca/xml?. 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://localhost:3000' is therefore not allowed access. 

Wenn ich den Access-Control-Allow-Origin Header hinzufügen, erhalte ich die folgende:

Response to preflight request doesn't pass access control check: 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://localhost:3000' is therefore not allowed access. 

Was ich feststellen möchte, ist, wenn ich das falsch mache oder wenn die Amazon-API CORS nicht unterstützt.

Antwort

0

Ich konfrontiert das ähnliche Problem und festgestellt, dass, wenn ich cors aktiviert HTTP-Handler, die als Middleware zwischen Ihrem Server und Amazon Server arbeiten wird. So können wir dieses Problem lösen. Es ist ziemlich einfach zu erstellen und ich habe es bereits geschrieben.

Develop Angular2 Application with real server APIs

Überprüfen Sie die Frage und die Antwort in der oben genannten Post aus. Ähnlich Code, den ich auf Github gepostet habe, wenn nötig werde ich den Standort teilen.

Hinweis: Ab sofort habe ich die Get-Anfrage bearbeitet, aber das Hinzufügen anderer Methoden ist ziemlich einfach. https://github.com/Anil8753/CORSHttpHandler

Verwandte Themen