Ionic 2/Angular 2/CORS：HTTP头没有被请求发送

我正在使用Ionic 2（2.0.0-beta.10）的项目。我尝试将请求传递给授权令牌。但是头没有被发送。我试图传递的其他标题也没有被发送。Ionic 2/Angular 2/CORS：HTTP头没有被请求发送

let url = 'http://www.example.com/savedata'; 
let data = JSON.stringify({ email: '[email protected]', password: '123456' }); 

let headers = new Headers(); 

headers.append('Content-Type', 'application/json'); 
headers.append('Authorization', 'Bearer ' + "tokenContent"); 

let options = new RequestOptions({ headers: headers }); 

this.http.post(url, data, options).map(res => res.json()).subscribe(data => { 

       console.log("it worked"); 

}, error => { 
       console.log("Oooops!"); 
});

我的REST API接收到这个请求，有以下标题：

Host:    www.example.com 
Connection:   keep-alive 
Access-Control-Request-Method: POST  
Origin:    http://evil.com/  
User-Agent:   Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.106 Safari/537.36 
Access-Control-Request-Headers: authorization, content-type 
Accept:    */* 
Referer:   http://localhost:8100/?restart=794567 
Accept-Encoding:  gzip, deflate, sdch 
Accept-Language:  en-US,en;q=0.8

的数据（体）进来正确的，只是标题问题，我解决不了。任何帮助将不胜感激。

来源

2016-08-04 GwenTiana

你可以尝试传递这样的'this.http.post（url，data，{headers：headers}）这样的头文件....' – AngJobs

我试图做到这一点，但是我在REST API中收到的头文件发送请求如下：主机\t \t www.example.com连接 \t保活\t 的Content-Length \t \t 45原产 \t \t http://evil.com/ 用户代理\t的Mozilla/5.0（ Windows NT 6.1; WOW64）AppleWebKit/537.36（KHTML，如Gecko）Chrome/51.0.2704.106 Safari/537.36 \t Content-Type \t text/plain \t Accept \t */* \t Referer \t http：// localhost：8100 /？重启= 794567 \t 接受编码gzip的\t，缩小\t 接受语言\t EN-US，EN; Q = 0.8 – GwenTiana

正常，检查这个答案http://stackoverflow.com/questions/38301878/ionic-2-angular -2-http-headers-are-not-being-along-with-the-request – AngJobs

如果您在调用与您的Angular 2/Ionic应用程序（例如evil.com）不同的域中的REST API（您的示例中是example.com），则需要将REST API服务器配置为返回这个头：

Access-Control-Allow-Origin: http://evil.com

，这将使浏览器从主机evil.com发送异步HTTP请求到REST API服务器。

这是通过启用其余api服务器上的CORS来完成的，您可以多读一下它。

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

的后端几个库，从而实现跨起源请求：

https://github.com/expressjs/cors - 的NodeJS /快速

https://pypi.python.org/pypi/Flask-Cors/ - Python的CORS库瓶

和列表持续近任何其他后端框架。

来源

2016-09-14 21:35:39

将JSON这个字符串化并非真的在任何时候工作。首先，您需要将您的JSON数据转换为StringQuery，以便通过服务器以更快的方式正确理解。

public StringQuery(jsonString) { 
     return Object.keys(jsonString).map(function (key) { 
      return encodeURIComponent(key) + '=' + encodeURIComponent(jsonString[key]); 
     }).join('&'); 
     }

然后你让你的文章函数或方法

public post(){ 
let url = 'http://www.example.com/savedata'; 
let data = this.StringQuery({ email: '[email protected]', password: '123456' }) 




    let headers = new Headers(); 

    headers.append('Content-Type', 'application/x-www-form-urlencoded'); 
    headers.append('Authorization', 'Bearer ' + "tokenContent"); 

    let options = new RequestOptions({ headers: headers }); 

    this.http.post(url, data, options).map(res => res.json()).subscribe(data => { 

        console.log("it worked"); 

    }, error => { 
        console.log("Oooops!"); 
    }); 
}

我使用此代码太并获得成功后请求。

来源

2017-08-04 00:56:51

Ionic 2/Angular 2/CORS：HTTP头没有被请求发送

回答

相关问题