CORS Issue in browser build


#1

Hello,

I am using ionic to create a web app that works with a PHP API. Proxies are set in my ionic.config.json and work great when testing my app with ionic search. The problem is that when i’m trying to set it to production on an apache server (building with ionic cordova build browser --prod --release), it looks like the proxies are not working anymore.

this is the error I get:

Failed to load resource: the server responded with a status of 404 (Not Found) /api/auth/check.php

Does the proxy works on browser builds ? Is there an other way to deal with CORS issues in browser build ?

edit :
It doesn’t work with ionic cordova run either

edit 2 :
Refreshing the page gave me this error :

polyfills.js:3 POST https://my-webserver-url/api/auth/check.php 404 (Not Found)

It looks like the proxy is not working.


#2

No, the proxy only applies to ionic serve.

Make the API respond with the correct status code for the request.


#3

Thank you @Sujan12 !

That’s exactly what I did. The problem was that I was trying to set Access-Control-Allow-Origin to all but wanted to protect my api with basic auth.

I know it isn’t really ionic related, but this is what i’ve done:

My config

Debian 9 server running apache 2.4 and PHP 7

Step 1 : In every php scripts that can be called from the outside, I delete every lines about headers, so that php doesn’t interfer with Apache configuration’s headers

Step 2 : Change my htaccess file like follow :


Header always set Access-Control-Allow-Origin: "*"

Header set Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

Header always set Access-Control-Allow-Headers: "Authorization"

AuthName "API Auth"
AuthType Basic
AuthUserFile "/my/way/to/.htpasswd"

<LimitExcept OPTIONS>
Require valid-user
</LimitExcept>