Cordova inAppBrowser problems between platforms - android

I have this code to open a browser on an Ionic App
<a href="#" class="button button-block"
ng-click="register()">Registrarse</a>
And in the controller
$scope.register = function () {
window.open('http://my.website.com/register', '_self', 'location:yes');
return false;
};
I tried with this too (after installing inAppBrowser plugin):
$scope.register = function () {
$cordova.inappbrowser.open('http://my.website.com/register', '_self', 'location:yes');
return false;
};
It works in Android, but if I want this to run on iOS I need to install de Cordova inAppBrowser plugin.
The problem? When I install this plugin it works on iOS but not on Android :(
Are there any solution for this issue? I found a lot of "solutions" by searching on google, but without success...
Any idea will be highly appreciated!

Related

Cordova Insomnia plugin not working

I'm developing an app using Cordova, and the Insomnia plugin is perfect for what I need.
But I can't make it work. To make everything as simple as possible, I created a new Cordova project, installed the plugin automatically (using the CLI) and add the following lines in the original Cordova index.html file to call the KeepAwake command:
<script type="text/javascript" src="js/Insomnia.js"></script>
<script>
window.plugins.insomnia.keepAwake()
</script>
But it's not working. The phone still auto-lock after 30s. I'm using an iPhone 5s running iOS 10.3.3 and Cordova iOS version 4.4.0.
What's wrong???
Thank you very much!
Code from comment below:
<script>
function onLoad() { document.addEventListener("deviceready", onDeviceReady, false); }
// Cordova is loaded and it is now safe to make calls Cordova methods //
function onDeviceReady() { window.plugins.insomnia.keepAwake() }
</script>
Did you referred the documentation? Here
You have to Copy Insomnia.h and Insomnia.m to platforms/ios/{ProjectName}/Plugins folder.

Cordova: InAppBrowser working on android emulator but not on android device

I'm trying to get InAppBrowser to launch a browser window from my app. When I try using my code on an Android emulator running from Visual Studio the browser launches as expected, but when I install an apk (built through Adobe PhoneGap build) to my Android device, I push the button and nothing occurs. I've verified that the event is indeed executing through an alert() on the device, but the browser isn't opening up. Any ideas?
HTML:
<div class="app">
<div>
<input type="button" id="launch" value="Launch browser to www.google.com!"/>
</div>
</div>
JS:
(function () {
"use strict";
document.addEventListener( 'deviceready', onDeviceReady.bind( this ), false );
function onDeviceReady() {
// Handle the Cordova pause and resume events
document.addEventListener( 'pause', onPause.bind( this ), false );
document.addEventListener('resume', onResume.bind(this), false);
document.querySelector('input#launch').addEventListener('click', launchGoogle);
};
function onPause() {
// TODO: This application has been suspended. Save application state here.
};
function onResume() {
// TODO: This application has been reactivated. Restore application state here.
};
})();
function launchGoogle() {
alert("launchGoogle()");
cordova.InAppBrowser.open("http://www.google.com", "_blank", "location=yes");
}
I tried wrapping my call using a try statement and get the error "Cannot call method 'open' of undefined". I assume this means the InAppBrowser plugin isn't getting installed.
Turns out the problem was the plugin wasn't being loaded. Reason: the plugins weren't being downloaded.
Turns out the plugins weren't being downloaded by PhoneGap Build. Reason: PhoneGap build needs your config.xml in the www/ directory, not in the root project directory as Visual Studio had it originally.
Copying the config.xml file to the www/ directory fixed the problem.

cordova inappbrowser and input file

I have a iOS and Android application, and I load a external website inside my app (this external website is mine too).
My problem is that this website has a file upload feature and this feature does not work on Android (it works on iOS).
I saw that this behavior is normal on Android, but is there any way to make it work or it's definitely not an option ?
Thank you
EDIT 1
I tried to create a new app with a simple page like this (hosted on AWS) :
<html>
<head>
<title>Upload Test !</title>
</head>
<body>
<div>Upload Test</div>
<div>
<input type="file" id="imgFile" name="files[]" accept="image/x-png, image/gif, image/jpeg">
</div>
</body>
and I added this script in my generated index.html in my Cordova project.
<script type="text/javascript">
document.addEventListener("deviceready", function(event) {
console.log('TEST CONSOLE LOG !');
var url = 'https://s3-eu-west-1.amazonaws.com/***/file-upload.html';
ref = window.open(url, "_blank", "location=no,toolbar=no,zoom=no,hidden=yes");
ref.addEventListener('loadstop', function () {
ref.show();
});
ref.addEventListener('loaderror', function () {
ref.close();
ref = undefined;
});
}, false);
</script>
It doesn't work on my nexus 5 (android M).
There's an issue with both Android and iOS that prevents file uploads when clicking on a file input tag like this within the inappbrowser:
<input type="file">
There's a couple of fixes for both which I've consolidated into a single location to make it easy for anyone else facing this issue. You should be able to modify your config.xml file to use it by including this:
<plugin spec="https://github.com/jverlee/cordova-plugin-inappbrowser-camera.git" version="1.1.0" source="git" />
Instead of the default inappbrowser plugin.
More details can be found here:
https://github.com/jverlee/cordova-plugin-inappbrowser-camera
#Verl's code is pretty good! However, it cannot be installed through his installation guide... So here is mine:
cordova plugin remove cordova-plugin-inappbrowser-camera
cordova plugin add https://github.com/jverlee/cordova-plugin-inappbrowser-camera.git
By the way, if I follow his guide, I only gets:
Error: Cannot read property 'variables' of undefined

Open installed application from the browser

I need to know is if I can, from an HTML web open an application that is installed on the mobile device. Is this possible? I could do with help of plugins can open installed applications from a single application, but from the browser?
I'm also working on Android and iOS with ionic framework
I hope you're talking about the Ionic Framework hybrid mobile application.
It can be done easily using Cordova InAppBrowser plugin. Using this plugin you can execute external app or open link inside a browser if mentioned app don't exist.
You will want to do something like this:
var scheme;
// Don't forget to add the org.apache.cordova.device plugin!
if(device.platform === 'iOS') {
scheme = 'twitter://';
}
else if(device.platform === 'Android') {
scheme = 'com.twitter.android';
}
appAvailability.check(
scheme, // URI Scheme
function() { // Success callback
window.open('twitter://user?screen_name=gajotres', '_system', 'location=no');
console.log('Twitter is available');
},
function() { // Error callback
window.open('https://twitter.com/gajotres', '_system', 'location=no');
console.log('Twitter is not available');
}
);
This example will try to execute Twitter app, if that app don't exist it will open twitter inside a child browser.
Needed Cordova plugins:
cordova plugin add com.lampa.startapp
cordova plugin add cordova-plugin-inappbrowser
cordova plugin add org.apache.cordova.device
Read more about it here: http://www.gajotres.net/how-to-launch-external-application-with-ionic-framework/

Generated links don't open in browser - Phonegap build

I am trying to force the links in my app to open in external browser. I am working with jQuery mobile & Phonegap build.
My app has a page with generated contact details. Among the details there is an link to the person's website:
row+='<div class="accWWW"> '+ data[i].website +'</div>';
I have these 2 functions defined in my code.
//function which forces open in browser
function openBrowser(url){
if(device.platform === 'Android') {
navigator.app.loadUrl(url, {openExternal:true});
} else {
window.open(url, '_system');
}
}
//opens generated URL's
function openGenerated(obj){
var url = obj.getAttribute("href");
console.log(url);
openBrowser(url);
return false;
}
I also have a simple <div class="accWWW"> Google </div> set in my index.html
So... this link to Google opens perfectly in iOS (haven't yet tested on Android because iOS was my biggest problem), but the generated link wouldn't do anything if I hadn't added the openGenerated function. Now there is an action, but it opens inside the app.
Do you have any idea why that is?
Also when checking on the laptop I get these errors in the console( link is my development url):
Uncaught ReferenceError: device is not defined *link*:277 // makes sense probably, because I am not using a mobile device
Uncaught SecurityError: Blocked a frame with origin "http://www.test.com" from accessing a frame with origin "*link*". Protocols, domains, and ports must match.// what is this?
I was thinking maybe it's an access issue, but I added <access origin="*" browserOnly="true" /> in my config.xml, so there shouldn't be a problem with this.
LATER EDIT: On Android the Google link doesn't work at all and the generated one opens inside the app... Apparently device.platform is always null, but the device plugin is added in xml as I can see in phonegap build this list of plugins:
Installed Plugins
Apps will be built with the latest version of a plugin unless you lock the version in your config.xml (see below). -- Plugin installed as a dependency of another plugin
Third Party VERSION LATEST VERSION
com.phonegap.plugin.statusbar 1.1.0 1.1.0
PhoneGap Core
org.apache.cordova.device 0.2.8 0.2.8
org.apache.cordova.inappbrowser 0.3.3 0.3.3
LATER EDIT:
Device.platform doesn't seem to be working, so I modified my function, adding Ved's suggestion, to:
function openBrowser(url){
if(navigator.app)
navigator.app.loadUrl(url, {openExternal:true});
else {
var ref = window.open(url, '_system', 'location=no');
ref.addEventListener('loadstart', function(event) {
});
ref.addEventListener('loadstop', function(event) {
console.log(event.type + ' - ' + event.url);
});
ref.addEventListener('exit', function(event) {
});
}
}
on iOS still opens inside the app. For Android I think it's working fine.
I fixed my issue.
I was adding cordova.js in my html. Apparently this broke things.

Categories

Resources