Running an HTTP POST request in Ionic 2 gives a banned response

Question

I'm just trying to make an http mail call in my IONIC 2 project. When I start the ion service , it works fine. But when I launch the android ion launch to run it on my device, it gives me 403 (forbidden) answer.

This is my PaymentService.ts where the http call was made

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

To overcome this problem, I tried several things, for example

• Launch cordova plugin add Cordova-plugin-whitelist
• Added this line to my 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'">
• Follow this link → https://github.com/apache/cordova-plugin-whitelist to add the <access origin> tags as *, <allow-navigation> , <allow-intent> with the specified attributes.
• Tried to add proxyUrl as indicated here http://blog.ionic.io/handling-cors-issues-in-ionic/

But in my case, no solution above works.

When I hit the mail call from my Android device, I get the following error response:

 {"_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"} 

I have the following ionic information:

 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 

Anyone with some solution?

Thanks in advance.

Answer 1

Can you try this example? Are you sure you are sending the right headers.

 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

I had the same error here, I found that this is happening, because when you start the ionic service , the start of the request starts with "http: //" or "https: //" and on the Ion launch of the android starts with "file : /// ".

To solve this problem, you need to change the server-side CORS filter to recognize file /// requests:

 Access-Control-Allow-Origin: *