Phonegap Iframe IOS 10 not loading but working on android - javascript

I have a simple phonegap app that only have iframe that load external url, but the iframe is not loading. it's blank
i have searched and tried every other possible solution lke whitelisting the url
my config.xml contains this:
<access origin="*" />
<allow-intent href="*" />
<allow-navigation href="*" />
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
<allow-navigation href="data:*" />
and the loaded url contains this csp:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'self' 'unsafe-inline' 'unsafe-eval'; script-src * 'self' 'unsafe-inline' 'unsafe-eval';">
does anybody have an idea about this?

Related

Simplest way to access media files on Android using Cordova

I need to access files in a Cordova app targeting Android. I need to be able to do it by passing a URI (e.g. "file://..." or "https://...") because that's the format I need to pass an API that will open the files (Howler.js to play .mp3 files).
This seems to rule out cordova-plugin-file, as far as I understand it. I have tried both hosting locally and remotely. I have tried installing cordova-plugin-whitelist. My config.xml contains
<access origin="*"/> <allow-navigation href="*"/> and my html contains <meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data:"/>.
I'm thus covering as many bases as I can find mentioned in any documentation, but no joy - permission to access the files is always denied. Suggestions much appreciated.
EDIT -------------------
In response to Eric below I have tried editing my config.xml and it is now as follows:
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="io.cordova.hellocordova" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>HelloCordova</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev#cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<content src="index.html"/>
<access origin="*"/>
<allow-intent href="http://*/*"/>
<allow-intent href="https://*/*"/>
<allow-intent href="tel:*"/>
<allow-intent href="sms:*"/>
<allow-intent href="mailto:*"/>
<allow-intent href="geo:*"/>
<platform name="android">
<allow-intent href="market:*"/>
<access origin="*"/>
<preference name="AndroidInsecureFileModeEnabled" value="true" />
</platform>
<platform name="ios">
<allow-intent href="itms:*"/>
<allow-intent href="itms-apps:*"/>
</platform>
<!-- <hook src="node_modules/cordova-import-npm/scripts/importNpmPackages.js" type="before_prepare"/> -->
</widget>
However my build now crashes with an error message visible here
You can try to add
<preference name="AndroidInsecureFileModeEnabled" value="true" />
to your config.xml, most probably a CORS issue.

Links inside iframe stopped working with PhoneGap iOS 4.1.0

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?

phonegap/cordova app 404 on request "from cache"

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

Cordova InAppBrowser not working via build.phonegap.com

I am working on an simple Phonegap App with Cordova InAppBrowser. I am testing on my Android device.
In the config.xml I got the below code
....
<preference name="phonegap-version" value="cli-5.2.0" />
.....
<plugin name="cordova-plugin-whitelist" source="npm" />
<plugin name="org.apache.cordova.inappbrowser" source="pgb" />
.....
<access origin="*"/>
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
<allow-navigation href="data:*" />
....
In Javascript I got the below code when a button is clicked
....
var ref = cordova.InAppBrowser.open('http://google.com', '_blank', 'location=yes','fullscreen=no');
....
index.html
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=medium-dpi" />
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; img-src * 'self' data:">
I use Phonegap Desktop App for testing purposes. In that when the button is touched a browser window got opened and I could see the google.
But when I build the same via http://build.phonegap.com and install on my device. Nothing opens after I touch the button. Something goes wrong here.
Looks strange for me. Any help is appreciated.
I posted the same question on Adobe Forums and got the solution for my problem.
https://forums.adobe.com/thread/2138992
After changing the below, it started working
<plugin name="org.apache.cordova.inappbrowser" source="pgb" />
to
<plugin name="cordova-plugin-inappbrowser" />

What is the right way of connect to a REST API with content security policy in a Phonegap/cordova Android APP

I have successfully developed a Phonegap hybrid App, it worked well on emulators but unable to post to a remote server when installed on android device. I configured white list plugin and my config.xml contains
<plugin name="cordova-plugin-whitelist" version="1" />
<access origin="*"/>
<allow-navigation href="http://*/*"/>
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
<allow-intent href="market:*" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>
and my index page contains
<meta http-equiv="Content-Security-Policy" content="default-src 'self' gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; img-src *; connect-src *">
I am using Cordova 5.3.3
but yet nothing seems to work.
Please can anybody tell me what I am doing wrong.
Thanks
Try the following
<plugin name="cordova-plugin-whitelist" source="npm" spec="1.1.0" />
<allow-navigation href="*" />
<allow-intent href="*" />
<access origin="*" />
<preference name="permissions" value="none"/>
The white-listing configuration and the Content Security Policy I posted in my question are correct and sufficient to get an hybrid app deployed on android platform connected to a remote API.
The problem was the API itself, as the app does connected well with other API. Initially we are using a play framework to develop our API, which has some issue responding to client request on the hybrid APP.
We then create a PHP proxy script which gets the request from the client and passes same to the play server.
That is it.

Categories

Resources