When I ran the project on Chrome browser the ajax requests worked fine but when I installed the app on Android the requests are not working anymore.
This is the code:
var xhr=new XMLHttpRequest()
xhr.onerror=function(){
var message=alert(txt('Please turn on mobile data or Wi-Fi','Ligue os dados moveis ou Wi-Fi'))
}
xhr.onreadystatechange=function (){
if (this.status== 200 && this.readyState == 4){
alert("trye")
eval(xhr.responseText)
}
}
xhr.open("POST",`http://dpreaction.ml?i=js`)
xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded')
xhr.send()
the config.xml file
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.teste.teste" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>DP Reaction</name>
<description>Inrease your things</description>
<author email="gilluisfrancisco70#gmail.com" href="http://dpreaction.ml">
DP Reaction
</author>
<content src="index.html" />
<allow-intent href="*" />
<access origin="*" />
<allow-naviation href="*" />
</widget>
And this is my tag:
<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
According to https://github.com/apache/cordova-android/issues/1354:
Content-Security-Policy is a different security mechanism than CORS (Cross-Origin Resource Sharing).
In cordova-android#10, they implemented a WebAssetLoader, which proxies requests through the https://localhost protocol. The WebAssetLoader acts like a private web server only accessible to your app. This was done because some web view features require you to be in a "secure context" (e.g. HTTPS) for the features to be enabled. In doing so, it does enable CORS enforcement.
Cordova android 9.x uses the plain old file system (file://), which didn't enforce CORs. This is why you see the XHR request work in 9. x but not in 10. x. You can make 10. x behave like 9. x by enabling the AndroidInsecureFileModeEnabled
So if you are using cordova-android#10 just add the following preference at config.xml:
<preference name="AndroidInsecureFileModeEnabled" value="true" />
I had the same problem and it solved it for me. :)
I am trying to play audio stream for a radio channel using cordova, The code runs well on all mobile phones but on Huawei Pro 30 it is not able to load the and throwing this error when using direct
<audio controls src='mystreamurl' id="myaudio" />
Failed to load resource: the server responded with a status of 401 (Authentication Required)
I have tried to use cordova-plugin-media and made sure that all permissions are there :
it throws error code 0
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.WAKE_LOCK" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
and have added to the application tag
android:usesCleartextTraffic="true"
and my html meta tag
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'self' http://* https://* 'unsafe-inline'; script-src * 'self' http://* https://* 'unsafe-inline' 'unsafe-eval';img-src * 'self' https: blob: data: http:; media-src * 'self' 'unsafe-inline' http://* https://* ;font-src *" />
Kindly note as mentioned before on all other phones it is working but on huawei having androird 10 not working and I have double checked the application settings and permissions on the phone all seems to be right.
**EDIT : I found that the issue is not in the code but the issue in authorization on the link in Android 10 ,
this Link is http://acc.qatarnavigator.com/news/music.html which contains the audio src (http://shaincast.caster.fm:44928/listen.mp3?authn3a123cb80bd23dbc6bee1f8156e8c8a0) is working fine.
If I added it as a iframe the Android 10 also block the media link (Failed to load resource: the server responded with a status of 401 (Authentication Required)
So the question now is there any work arround to authorize the link? is because it is not encoding it correctly ?
Note if I play any other online media .mp3 link it is working
I have tested to create
CLICK ME
Then it Throws an error
err_cleartext_not_permitted
So I have added due to Network configuration new rules
<?xml version="1.0" encoding="utf-8"?>
<domain-config cleartextTrafficPermitted="true">
<domain includeSubdomains="true">shaincast.caster.fm:44928</domain>
</domain-config>
But again it throws the error :
Failed to load resource: the server responded with a status of 401 (Authentication Required)
Any Ideas?
**
I have been searching hours on this issue, but I still can't find any solution to this.
I am developping an App cordova (basicely HTML / JS)
So : the app runs on mobile from the navigator, and I have trouble making an ajax request to an API : https://developer.riotgames.com/
But let's say that I just want to get the google page.
How on earth do I do that, is this even possible ?
Here is a simple exemple :
$.ajax({
type: "GET",
url: "https://google.com",
dataType: "text",
success: function(response){
alert("!!!");
},
error: function(error){
alert("...");
}
});
I am getting the same error again and again :
XMLHttpRequest cannot load https://google.com/. No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'null' is therefore not allowed access
The origin 'null' is because I run the code from : file:///D:/Projets/LoL/www/index.html and I read that the navigator is blocking, but it doesn't work as well if I disable the security with --disable-web-security
And of course, I don't have access to the server I want to join.
You need the Cordova whitelist plugin: https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-whitelist/.
Have this in config.xml:
<access origin="*" />
<allow-navigation href="*"/>
And have the Content-Security-Policy meta in index.html. Something like:
<meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data:">
If the Cordova Whitelist plugin doesn't work out for you, you can use the Cordova advanced Http plugin to make calls to external servers.
Install using:
cordova plugin add cordova-plugin-advanced-http
Link to plugin:
https://github.com/silkimen/cordova-plugin-advanced-http?ref=hackernoon.com
Extra info:
https://hackernoon.com/a-practical-solution-for-cors-cross-origin-resource-sharing-issues-in-ionic-3-and-cordova-2112fc282664
If you just experienced the issue starting Aug 1 2019. This Access-Control-Allow-Origin Error..(using cordova) might be related to the problem.
I have added following in nodejs server which solves my issue;
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});
This may be helpful if you are using nodejs.
Thanks
There is no need to do such thing
You just try to change the permission
<?xml version="1.0" encoding="utf-8"?>
<manifest ...>
<uses-permission android:name="android.permission.INTERNET" />
<application
...
android:usesCleartextTraffic="true"
...>
...
</application>
I found the solution for my similar scenario, was getting the error:
"access-control-allow-origin cannot contain more than one origin"
Eventually I found that although I had set my .net core API to allow all sources like so:
public void ConfigureServices(IServiceCollection services)
{
services.AddCors();
...
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
app.UseCors(builder => builder
.AllowAnyOrigin()
.AllowAnyMethod()
.AllowAnyHeader());
app.UseEndpoints(endpoints =>
{
endpoints.MapControllers();
});
...
I had then left an old CORS command in the web.config file in the website root of the API:
<customHeaders>
<add name="Access-Control-Allow-Origin" value="https://localhost:444" />
</customHeaders>
I commented out the customHeaders section and it worked.
Mission accomplished!
I am trying to build an Android phonegap/cordova application using AngularJS. I am trying to make a POST request but I keep getting a 404 Not Found (from cache).
My POST request
return $http({
method: 'POST',
url: myURL ,
data: {data: dataObj}
})
.then(function (res) {
return res.data;
});
I have the whitelist plugin installed in my config.xml
<plugin name="cordova-plugin-whitelist" spec="~1.2.1" />
<access origin="*" />
<allow-intent href="*" />
<allow-navigation href="*" />
And I have a Content-Security-Policy set in my index.html
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
But I am still getting the 404 from cache error. Any ideas of what I am doing wrong?
Thanks
Is anyone able to get this to work in their PhoneGap build? :
$(function(){
$.getJSON("http://reddit.com/.json", function(data){
alert("Success!");
})
})
It works fine in browsers but when I build the app it doesn't run.
I've added these to my config.xml already to whitelist all domains
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
<allow-navigation href="data:*" />
<allow-navigation href="*" />
<access origin="*" />
<allow-intent href="*" />
Also tried building it with this CSP and without
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *">
which I got from here: https://github.com/apache/cordova-plugin-whitelist
I took a look at this and replicated your Ajax request in my own PhoneGap Build project.
What I noticed was that the URL you are using http://reddit.com/.json seems to get redirected on Android devices at least to https://www.reddit.com/.json
I discovered this by doing a PhoneGap Build build with debug turned on, running the .apk on a Nexus 7 with Chrome remote debugger tools attached, and seeing this in the JS Console:
"Refused to connect to 'https://www.reddit.com/.json' because it violates the following Content Security Policy..."
I fixed this by amending the Content Security Policy meta tag in index.html to include both https://www.reddit.com and http://reddit.com in the connect-src clause. Rebuilt on PhoneGap Build using this CSP and it works fine on the Nexus 7 now:
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; connect-src http://reddit.com https://www.reddit.com">
So my PhoneGap application now looks like this and works:
var app = {
initialize: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
onDeviceReady: function() {
var parentElement = document.getElementById('deviceready');
var listeningElement = parentElement.querySelector('.listening');
var receivedElement = parentElement.querySelector('.received');
listeningElement.setAttribute('style', 'display:none;');
receivedElement.setAttribute('style', 'display:block;');
$.getJSON('http://reddit.com/.json', function(data){
alert('Success - got ' + data.data.children.length + ' children in JSON');
});
}
};
app.initialize();
For your convenience I put the complete app ready for PhoneGap Build in a Github repo here. Feel free to use this as you need.