CODEWITHSUNDEEP
phptypescriptapiionic-frameworkionic3
snigdha
snigdha

Reputation: 19

IONIC 3 CORS Issue while opening in device and using api

I am beginner in IONIC, I am using slim rest api with ionic 3. I am getting this error:

"Failed to load http://sargam.digifrizz.com/api/v1/empLogin: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8100' is therefore not allowed access."

I am also using proxies URL.

 {
      "name": "sargam",
      "integrations": {
        "cordova": {}
      },
      "type": "ionic-angular",
       "proxies": [
        {
          "path": "/v1/empLogin",
          "proxyUrl": "http://sargam.digifrizz.com/api/v1/empLogin"
        }
      ]
    }

I am using this code:

  return new Promise((resolve, reject) => {
                let headers = new Headers();

                headers.append('Access-Control-Allow-Origin' , '*');
                        headers.append('Access-Control-Allow-Headers','Origin, Content-Type, X-Auth-Token, authorization, X-Requested-With');           
                headers.append('Access-Control-Allow-Methods', 'POST, GET, OPTIONS, PUT');
                headers.append('Access-Control-Allow-Credentials', 'true');
                headers.append('Accept','application/json');
                        headers.append('Content-Type', 'application/json');


            this.http.post(apiUrl+'empLogin', JSON.stringify(credentials), {headers: headers})
              .subscribe(res => {
                resolve(res.json());

              }, (err) => {
                reject(err);
              });
            });

Please help me in solving this issue

Thanks Snigdha

Upvotes: 1

Views: 826

Answers (3)

snigdha
snigdha

Reputation: 19

I am using "Access-Control-Allow-Origin, Access-Control-Allow-Headers and Access-Control-Allow-Methods" backend but geting same error

Backend response is

access-control-allow-headers →X-Requested-With, Content-Type, Accept, Origin, Authorization access-control-allow-methods →GET,PUT,POST,DELETE,OPTIONS access-control-allow-origin →* cache-control →no-store, no-cache, must-revalidate connection →close content-length →412 content-type →application/json;charset=utf-8 date →Fri, 21 Dec 2018 08:06:22 GMT expires →Thu, 19 Nov 1981 08:52:00 GMT pragma →no-cache server →Apache/2.2.15 x-powered-by →PHP/7.0.27

Upvotes: 0

prats
prats

Reputation: 26

Add cors plugin to your chrome browser it will work for now. But you have handle cors on server side.

Upvotes: 0

Nicolás Longhi
Nicolás Longhi

Reputation: 306

CORS access control must be implemented on server side. You should respond with 200 OK to an OPTIONS request and include these headers with proper configuration: Access-Control-Allow-Origin, Access-Control-Allow-Headers and Access-Control-Allow-Methods. You should read CORS documentation to how to implement it in the backend.

Upvotes: 1

Related Questions