正在收到此问题，因为您发送的标头与后端的标头不匹配。

假设您发送了以下标题：

  contentHeaders = new Headers（）; 
 contentHeaders.append（'Authorization'，'您的令牌在应用中使用'）; 
 contentHeaders.append（'Content-Type'，'application / json'）; 
 contentHeaders.append（'Access-Control-Allow-Origin'，'*'）; 
 

因此，这些标题像 Authorization ， Content-type 和 Access-Control-Allow-Origin 应该匹配后端允许的标题。

所以在后端 Access-Control-Allow-Headers 应该包含以上所有标题：

  res.header（Access-Control-Allow-Origin，*）; 
 res.header（Access-Control-Allow-Headers，Authorization，content-type，Access-Control-Allow-Origin）; 
 

所以在 Access-Control-Allow-Headers 你必须通过你从前端发送的所有头文件：'Authorization'，'Content-type'和'Access-Control-Allow-Origin'。

当你使用上述的概念时，它会很好的工作。

希望这篇文章对你有帮助

p>

I'm trying to use the forecast API with my angular2 app. However, when i try to access the API I get a Cross-Origin Error. Any idea how i can fix this error ?

search(latitude: any, longitude: any){
        console.log(latitude); 
        console.log(longitude);
        let body = 'https://api.forecast.io/forecast/APIKEY/'+latitude+','+longitude ; 
        console.log(body); 
        this.http.get(body)
            .map(
                response => response.json()
            ).subscribe(
                data =>  console.log("Data: "+data),
                err =>  console.log("Error: "+err),
                () => console.log('Get Complete')
            );
    }

Error

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api.forecast.io/forecast/APIKEY/37.8267,-122.423. (Reason: CORS header 'Access-Control-Allow-Origin' missing).

Update Now using JSONP

    let body = 'https://api.forecast.io/forecast/APIKEY/'+latitude+','+longitude + '?callback=?' ; 
    console.log(body); 
    this.jsonp.get(body)
    .map(response => response.json())
    .subscribe(
            data =>  console.log("Data: "+data),
            err =>  console.log("Error: "+err),
            () => console.log('Get Complete')
    );

Error

Error0.def29191127bbc3e0100.hot-update.js:59:10 Object { _body: "JSONP injected script did not invok…", status: 200, ok: true, statusText: "Ok", headers: Object, type: 3, url: "https://api.forecast.io/forecast/60…" }0.def29191127bbc3e0100.hot-update.js:61:10 SyntaxError: expected expression, got '==='

You are getting this problem because the header you are sending does not match the headers in the backend.

Suppose you send the following headers:

contentHeaders = new Headers();
contentHeaders.append('Authorization', 'Your token used in app'); 
contentHeaders.append('Content-Type', 'application/json'); 
contentHeaders.append('Access-Control-Allow-Origin', '*');

So those headers like Authorization, Content-type, and Access-Control-Allow-Origin should match the allowed headers in your backend.

So in the backend Access-Control-Allow-Headers should have all above headers:

res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Authorization, content-type, Access-Control-Allow-Origin");

So here in Access-Control-Allow-Headers you have to pass all headers which you send from frontend: 'Authorization', 'Content-type', and 'Access-Control-Allow-Origin'.

It will work perfectly when you use above concept.

Hope this post will helpful for you

Thanks