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.
Related
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. :)
We have a PhoneGap application using Ionic framework. In this app we can have an iframe containing links with any target: _parent, _top, _self, ...
We capture the clicks with target _parent, _top and _blank to open them in a browser. We don't capture links with target _self or no target because we want them to be opened inside the iframe.
This worked fine when we were using version 3.9.1 for platform-ios, but when we updated to 4.1.0 the links with _self or no target stopped working for some reason. We click them and nothing happens. Nothing is written in the console either.
We have the following in the config.xml:
<allow-navigation href="*" />
<allow-intent href="*" />
<access origin="*"/>
And the CSP in index.html:
<meta http-equiv="Content-Security-Policy" content="default-src * filesystem: gap: https://ssl.gstatic.com; img-src * filesystem: gap: data: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline' filesystem: cdvfile: file:; script-src 'self' 'unsafe-inline' 'unsafe-eval' http://localhost:* filesystem: cdvfile: file:">
Are we missing something in order to make it work?
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
I am building an app with Meteor for a couple of weeks now, without any problems. Yesterday I didn't had any problems either.
Today I wanted to continue building my app, and the terminal gives me this error every 10 seconds:
I20151208-11:19:04.463(1) (android:file:///android_asset/www/plugins/cordova-plugin-whitelist/whitelist.js:25) No Content-Security-Policy meta tag found. Please add one when using the cordova-plugin-whitelist plugin.
So I tried running another Meteor project, and got the same error.
I have googled this error, and it says I have to change the config.xml in my project. I dont know where config.xml is located in a Meteor project, but since the error is showing to ALL projects I'm trying to run, I dont think that's the solution.
Can anyone help me solve this problem?
EDIT:
I added this line in the <head> tag of my Meteor project, and in the <head> tag of my .meteor/local/cordova-build/www/index.html file:
<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 *">
Also, I added this to my .meteor/local/cordova-build/config.xml:
<allow-navigation href="*" />
And this to my mobile-config.js file:
App.accessRule('*');
Without success :(
Please add this code to your index.html header
<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 *">
Solved! Restarted my phone, and that solved the problem!
The app gets json data from a php script on some server. it workes fine on my laptop, but does not work on the android phone.
I have this in my config.xml file
<access origin="*"/>
<allow-intent href="*"/>
<allow-navigation href="*"/>
It looks like the whitelist does not work.. What am i doing wrong?
Firstly remove whitelist plugin by cordova plugin remove cordova-plugin-whitelist, then install by cordova plugin add cordova-plugin-whitelist. Finally, add these tag in your index.html file
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
A while ago cordova changed to a more restrictive whitelisting method.
Since then you need to install cordova-plugin-whitelist to be able to access external resources.
The fact that things are working on your labtop and not on the mobile points in this direction as well.