I have a very simple Cordova app which attempts to do an AJAX POST.
The requested URL, simple.php, looks like this :
<?php
header('Access-Control-Allow-Origin: *');
die ( json_encode ( array('result'=>'ok') ) );
?>
index.html is exactly this :
<head>
<script src="jquery.js"></script>
<script>
$(document).ready( function() {
$.ajax(
{
type: 'POST',
url: 'http://drawonthe.net/simple.php',
contentType: 'text/plain',
xhrFields: {
withCredentials: false
},
success: function(res) {
alert('got this res : ');
alert(JSON.stringify(res));
},
error: function(err) {
alert('got this fail : ');
alert(JSON.stringify(err));
}
});
});
</script>
</head>
<body>
</body>
My Cordova config.xml file includes the following :
<content src="index.html" />
<access origin="*" />
<allow-intent href="*" />
<allow-navigation href="*" />
<access origin="content:///*" />
My app includes the cordova-plugin-whitelist
plugin.
I've experimented with various CSPs in index.html, but with no good result. Eg.
<meta http-equiv="Content-Security-Policy" content="default-src *; script-src * 'unsafe-eval' 'unsafe-inline'; connect-src *; img-src *; style-src * 'unsafe-inline' ; media-src *; ">
When I access this HTML page locally (from file://) I get XMLHttpRequest cannot load http://drawonthe.net/simple.php. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 403.
XMLHttpRequest cannot load http://drawonthe.net/simple.php. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 403.
XMLHttpRequest cannot load http://drawonthe.net/simple.php. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 403.
and it returns {"readyState":0,"status":0,"statusText":"error"}
.
When I access the HTML page via being hosted on a local server it works without complaint. (The correct response: "{\\"result\\":\\"ok\\"}"
)
When I run it as a Cordova App on either an Android or an iOS device I get {"readyState":4, "responseText":"<!DOCTYPE HTML PUBLIC \\" -//IETF//DTD HTML 2.0//EN\\">... blah blah ... 403 Forbidden ... , "status":403, "statusText": "Forbidden"}
.
What's going on? And how do I make this request work from the phone app?
This issue was resolved when I disabled ModSecurity on my server .
For me, I was able to do that via the cPanel access to my host:
cPanel > Security > ModSecurity
I hope this helps others.
Thank you @jcesarmobile for pointing out the problem had to be with the server.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.