-2

I am calling a local API from ionic project testing on android but it shows Http response status code 0 unknown error I did look up for many solutions but non helped.

app.use(function(req, res, next) {
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Methods', 'GET, PUT, POST, DELETE, OPTIONS');
    res.header("Access-Control-Allow-Credentials", "true",);
    res.header('Access-Control-Allow-Headers', 'Origin, X-Auth-Token, Accept, Content-Type, Authorization, Content-Length, X-Requested-With, x-access-token, Access-Control-Request-Method, Access-Control-Request-Headers');
  next();
});

method requesting API.

    async loginWithFacebook(data) {
        console.log("api USER data from facebook ");
        console.log(data);

        let headers = new HttpHeaders({
            'Content-Type': 'application/json'
        });
        let options = {
            headers: headers
        };

        return await (this.http.post(environment.endpoint + "/users/facebook-login", data, options)).toPromise();
    }

it's unable to call the API for some reason.

Pratik Solanki
  • 75
  • 1
  • 2
  • 10

1 Answers1

-1

You are just assigning header to the HTTP response, which will not help you with the CORS of the request. Doing the following might help.

Install cors package in the server root using terminal.

npm i cors

Import cors to your app.js (the root file of your server).

const cors = require('cors')

Use cors for your App.

app.use(cors()) 

Your final code should look something like this.

var express = require('express')
var cors = require('cors')
var app = express()
 
app.use(cors())
 
app.get('/products/:id', function (req, res, next) {
  res.json({msg: 'This is CORS-enabled for all origins!'})
})
 
app.listen(80, function () {
  console.log('CORS-enabled web server listening on port 80')
})

Source

  • well still I get the same error `HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: "http://localhost:8000/users/facebook-login", ok: false, …}` – Pratik Solanki Aug 05 '20 at 16:03
  • Did you try this request from postman? or any other API Client? – Arun Rajagopal Aug 06 '20 at 08:30
  • In postman, it works fine even without adding cors the issue is when I test it on my android device. – Pratik Solanki Aug 06 '20 at 09:51
  • Please check the below link. https://stackoverflow.com/a/905878/7393630 The reason for status code 0 can also be one of the following. -Illegal cross origin request (see CORS) -Firewall block or filtering -The request itself was cancelled in code -An installed browser extension is mucking things up – Arun Rajagopal Aug 06 '20 at 10:43
  • BTW, since you are developing in Ionic, I assume you are doing the development from a desktop browser. There are certain ways, that I used to confirm if the only because of CORS and not anything else. Disable web security in your browser and refresh the page. disabling security in mac. `open -n -a /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --args --user-data-dir="/tmp/chrome_dev_sess_1" --disable-web-security` in Windows, navigate to chrome folder, normally in Program Files (x86) `chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security` – Arun Rajagopal Aug 06 '20 at 10:53
  • What if this issue occurs on prod? – Ehsan Nissar Feb 14 '22 at 05:55