在 Ionic 2 中进行 HTTP POST 调用会给出禁止响应

Question

我只是想在我的 IONIC 2 项目中进行 http post call。当我运行 ionic serve 时，它运行良好。但是当我运行 ionic run anroid 以在我的设备上运行它时，它会给我 403（禁止）响应。

这是我的 PaymentService.ts，其中进行了 http 调用

import {Http, Headers, RequestOptions} from '@angular/http';
import 'rxjs/add/operator/map';
import { Injectable } from '@angular/core';

@Injectable()
export class PaymentService {
static get parameters() {
    return [[Http]];
}

constructor(private http:Http) {}

postToPaymentApi(data) {
    let headers: Headers = new Headers()
    headers.set('Content-type', 'application/x-www-form-urlencoded')
    let options = new RequestOptions({headers: headers})

    var response = this.http.post("http://test/url",data,options).map(res => res.json());
    return response;
   }
 }
}

为了克服这个问题，我尝试了几种方法，例如

1. 运行cordova plugin add cordova-plugin-whitelist
2. 在我的 config.xml 中添加了这一行 <meta http-equiv="Content-Security-Policy" content="default-src *; img-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
3. 点击此链接 -> https://github.com/apache/cordova-plugin-whitelist 将 <access origin> 添加为 *、<allow-navigation>、<allow-intent> 具有指定属性的标签。
4. 尝试添加 proxyUrl，如此处 http://blog.ionic.io/handling-cors-issues-in-ionic/ 中所述

但就我而言，上述解决方案均无效。

当我从我的 android 设备点击 post call 时，我收到以下错误响应：

{"_body":"",
"status":403,
"ok":false,
"statusText":"Forbidden",
"headers":{"Date":["Wed","30 Nov 2016 09:28:53 GMT"],
"Content-Length":["0"]},
"type":2,
"url":"http://test/url"}

我有以下离子信息：

Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.12
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.45
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Linux 4.4
Node Version: v7.2.0
Xcode version: Not installed

有人有解决办法吗？

提前致谢。

Answer 1

你能试试这个例子吗？你确定你发送的是正确的标题

postToPaymentApi(data) {
   let headers = new Headers({ 'Content-Type': 'application/x-www-form-urlencoded' });

   return new Promise(resolve => {
      this.http.post('http://test/url',data, {headers: headers })
         .subscribe(respond => {
           console.log(respond);       
         });   
   });        
}

Answer 2

我在这里遇到了同样的错误，我发现这是因为当您运行 ionic serve 时，请求来源以“http://”或“https://”开头，然后ionic run android它以“file:///”开头。

要解决此问题，您需要更改服务器端 CORS 过滤器以识别“文件///”请求：

Access-Control-Allow-Origin: *