You should ONLY have the Access-Control-Allow-Origin: * set when you’re developing using your browser, especially if the API is not only used for the app but also some other web based application! This is not required for the phone, as the files are served from the file:// URI and cross domain policies do not apply. Either you set the ACAO on the server, or setup a proxy in your ionic.config.json file during development
When it comes to the OPTIONS request, do as @Sujan12 says and make the server respond 200 OK to all OPTIONS requests. If you have any custom headers and what not, make sure to set the Access-Control-Allow-Headers header in the response to the preflight.
If this is your API then add this on Top in your PHP file if you are testing in Browser but only for testing. Delete this lines if you release your Application:
For POST Methods:
/*------------------------------------------------------*/
if (isset($_SERVER['HTTP_ORIGIN'])) {
header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}");
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Max-Age: 86400'); // cache for 1 day
}
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
header("Access-Control-Allow-Methods: POST, POST, OPTIONS");
if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
header("Access-Control-Allow-Headers: {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");
exit(0);
}
/* -----------------------------------------------------*/
For GET Methodes:
/*------------------------------------------------------*/
if (isset($_SERVER['HTTP_ORIGIN'])) {
header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}");
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Max-Age: 86400'); // cache for 1 day
}
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
header("Access-Control-Allow-Methods: GET, GET, OPTIONS");
if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
header("Access-Control-Allow-Headers: {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");
exit(0);
}
/* -----------------------------------------------------*/
And be sure to Allow Origin in your Application as well in your config.xml
What have you tried? Is the server now answering the OPTIONS request with somethig else than 405? Did you add the header because the problem persisted even with a working OPTIONS request?
