CODEWITHSUNDEEP
wordpressionic-frameworkcorshttp-headers
Ahmed ElShemy
Ahmed ElShemy

Reputation: 76

Wordpress API - Ionic GET - The 'Access-Control-Allow-Origin' header contains multiple values '*, *'

I am currently building some custom API's using WordPress API, and works great as calling from browser as this link:

https://laundrylocker-eg.com/wp-json/wp/v2/delivery-locations

The response in JSON nothing goes wrong, so from Ionic application I try to call this API to get callback this data but faced this CORS issue and try to fix it. Nothing works like disable CORS in Chrome and using plugin enabling CORS for all domains as development phase.

CORS PLUGIN IMG

CONSOLE ERROR

Failed to load https://laundrylocker-eg.com/wp-json/wp/v2/pickup-locations/2018-04-03: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header contains multiple values '*, *', but only one is allowed. Origin 'http://localhost:8100' is therefore not allowed access. core.js:1350 ERROR HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: null, ok: false, …}

REQUEST INFORMATION

Request URL: https://laundrylocker-eg.com/wp-json/wp/v2/pickup-locations/2018-04-03
Request Method: OPTIONS
Status Code: 200 OK
Remote Address: 50.87.248.230:443
Referrer Policy: no-referrer-when-downgrade
Access-Control-Allow-Credentials: true
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Authorization, Content-Type
Access-Control-Allow-Headers: Authorization, Content-Type, Content-Range, Content-Disposition, Content-Description, Access-Control-Request-Method
Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE
Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS
Access-Control-Allow-Origin: *
Access-Control-Allow-Origin: *
Access-Control-Expose-Headers: X-WP-Total, X-WP-TotalPages
Allow: GET
Cache-Control: max-age=21600
Connection: keep-alive
Content-Encoding: gzip
Content-Length: 116
Content-Type: application/json; charset=UTF-8
Date: Tue, 03 Apr 2018 12:02:28 GMT
Expires: Tue, 03 Apr 2018 18:02:28 GMT
Link: https://laundrylocker-eg.com/wp-json/; rel="https://api.w.org/"
Server: nginx/1.12.2

Upvotes: 0

Views: 1498

Answers (1)

roryhewitt
roryhewitt

Reputation: 4507

It's not that you are returning a single ACAO header with a value of *, * - it's that you are returning duplicate CORS headers, and the browser has merged them.

Somewhere in your code (or in the code of the packages you're using), the CORS headers are being added twice. My guess is that you have somehow added two CORS-enablement packages or something like that, and they're both adding CORS response headers...

Since the value of the two Access-Control-Allow-Headers and Access-Control-Allow-Methods headers are different, it should be easy enough to search for where they are being added and remove the duplication.

Upvotes: 0

Related Questions