I am facing problem while opening the Android native dialer through JS. Using "tel:XXXXXXXXXX" to open a default dilaer and following is the code
HTML
<div class="phoneLinkDiv" onclick="javascript:openNativeDialer('tel:9291808586');" data-rel="external"></div>
JS
function openDialer(num) {
window.location.href = num;
}
The above code working as expected in Chrome/Firefox but it is not working Web#Work enabled android device.
More Info:
I got to know that ionicframework not allowing because of CORS. Is there anyway to enable CORS for particular web page through HTML or JS or any other ideas to open native dialer
Please try a tag for redirection. eg <a href="tel:555-999-8888">
I am creating an Ionic 3 application, I need to get the URL from the frame generated from inAppBrowser.
The frame is created here :
var browser = this.inAppBrowser.create("http://apache.org", "_blank", "location=no,clearsessioncache=yes,clearcache=yes");
browser.on('loadstop').subscribe(function(event) {
browser.show();
console.log(event.url);
});
I use the apache website for testing purposes but the url is meant to change as the user goes through the webpage, that is why I'm trying to retrieve it through an event.
My problem is that the "event.url" property keeps returning "null".
Version : IONIC 3.2.0 ; Cordova 8.0.0
Many thanks for whoever will help me!
FIX : I found the solution, the desktop browser is always returning null, I tried on a android simulator and it works !
Thanks for your answers.
Its working in my current 3.7.1 version, but when I upgraded to 4.x, the back button is not working, to reproduce (working with non http source) :
cordova create test
cd test, change the index.js :
onDeviceReady: function() {
app.receivedEvent('deviceready');
document.addEventListener("backbutton", function() {
alert('back');
});
},
cordova platform add android
cordova build android
but if the config.xml was changed for example :
and rebuild again,the back button is not alerting, what I try to resolve :
#index.html add
Try inspect device using chrome and there's no error, and device ready event is fired
Anybody can help ?
Thanks
#polymerAngular,
I've got some demo Apps, that are exclusively for testing Phonegap Events. You can test all in pairs or singularly. The Backbutton works with 3.5.0.
All Events: https://github.com/jessemonroy650/Phonegap-Events-test
Backbutton: https://github.com/jessemonroy650/Phonegap-PhysicalButton-test
2nd response for #polymerAngular
Apparently Phonegap Build does NOT support 4.x from Cordova. I have asked Phonegap Support for verification and clarification on this forum post at nitboi
Need verification and clarification on phone-gap-version
http://community.phonegap.com/nitobi/topics/need-verification-and-clarification-on-phone-gap-version?rfm=1
I will update after they respond.
TIA
Jesse
I have a requirement to show a pdf in inappbrowser when user clicks on a link. It is working fine in ios but not working on android. I am using IBM worklight for my project. Below is the code I have used:
window.open("pdfURL","_blank","location=yes");
In ios the inappbrowser launches and displays the pdf but in android the inappbrowser is launches but no content is displayed
Unlike iOS, which has a built-in PDF viewer - Android's webview does not have PDF viewer built-in.
This is why it is going to fail in Android.
You have 2 choices in Android:
View the file using Google Docs by storing the file at a remote server and redirecting the user like so: window.open(encodeURI('https://docs.google.com/gview?embedded=true&url=http://www.your-server.com/files/your_file.pdf'), '_blank', 'location=yes,EnableViewPortScale=yes');
Or use a Cordova plug-in. For example this one (you can search in Google for more). For this, you'll need to learn how to create Cordova plug-ins in Worklight.
You can read more options here: Phonegap InAppBrowser display pdf 2.7.0
Try using
window.open('pdfURL',"_system","location=yes,enableViewportScale=yes,hidden=no");
where using _system will download the file and open it in the system's application like Chrome or other PDF viewers.
Use uriEncodeComponent(link) and https://docs.google.com/viewer?url= link
Doc, Excel, Powerpoint and pdf all supported.
Use the cordova in app browser.
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
window.open = cordova.InAppBrowser.open;
}
$("body").on("click",function(e){
var clicked = $(e.target);
if(clicked.is('a, a *'))
{
clicked = clicked.closest("a");
var link = clicked.attr("href");
if(link.indexOf("https://") !== -1)
{
if(true) //use to be able to determine browser from app
{
link = "http://docs.google.com/viewer?url=" + encodeURIComponent(link) + "&embedded=true";
}
window.open(link, "_blank", "location=no,toolbar=no,hardwareback=yes");
return false;
}
}
});
Using google drive viewer seems like a good quick option.
But moving forward they may change or depreciate their API and you will have to find a new way to support this.
Also security is another consideration here as your file is publicly available and downloadable.
I had a similar situation in a recent project and we solved it by using: pdf.js
This is a JS based PDF parser with a good set of reader functionalities.. its not as smooth as a native one but did the job for us.
It's main advantage is that we had the control over the codes and were able to open files from the device file system.
If you want to go for a more native like in-app route, then as #Idan Adar mentioned a native library + cordova plugin is the way to go.
Try this code it's working fine for me.
var inAppBrowserRef;
var target = "_system";
var options = "location=yes,hidden=no,enableViewportScale=yes,toolbar=no,hardwareback=yes";
inAppBrowserRef = cordova.InAppBrowser.open(url, target, options);
It's working for me
window.open(link, "_blank","location=yes");
im using cordova 2.5.0 and I have problems to communicate a new window with my app with the InAppBrowser. It is possible to send back information from a page opened with InAppBrowser plugin to my cordova app.
This used to be a little involved (like polling or custom urls), but since inAppBrowser 3.0.0 you can use AllowedSchemes with the customscheme event. This is not documented yet, but can be used as follows.
To your config.xml, add
<preference name="AllowedSchemes" value="myscheme" />
with the following code in your Cordova app:
function onCustomScheme(e) {
if (e.url.match(/^myscheme:\/\/message\b/)) {
var q = parseQueryString(e.url);
console.log("Got foo message: " + q.text);
}
}
url = "https://my.example.com/";
app = cordova.InAppBrowser.open(url, "_blank");
app.addEventListener("customscheme", onCustomScheme, false);
Then from the website opened in the inAppBrowser, you can embed a link like this, which shows the message hi there in the console if you follow it.
Test
This won't work with Cordova 2.5 (it looks like you'll need at least 3.1), but as 8 is out now, it's probably a good idea to upgrade anyway.