Open link in device's default browser. Crosswalk android application - javascript

I am creating an app for Android devices using HTML and JavaScript. I am using Crosswalk (15.44.384.12) to bundle this into an Android application, which pretty much creates an android app with a web browser built in, to run my application.
I have everything working on the Android device, but I am struggling to find out how to open a link from my app in the device's default browser using JavaScript.
If I use window.open(), it will just load within my app, which is not what I want.
I have tried using window.open('http://example.com', '_blank'), I have also tried '_system', to no avail.

Same here. All hrefs and window.open calls are opened in the WebView.
We can use a workaround that was also possible in Cordova: to intercept URLs in native Java code.
First create a custom XWalkResourceClient to intercept your urls depending on your needs:
XWalkResourceClient myResourceClient = new XWalkResourceClient(xWalkWebView){
...
#Override
public boolean shouldOverrideUrlLoading(XWalkView view, String url) {
if(url.contains("whatever")){
Intent i = new Intent(Intent.ACTION_VIEW);
i.setData(Uri.parse(url));
startActivity(i);
return true;
}
return super.shouldOverrideUrlLoading(view, url);
}
};
and then in your activity, you can set that client to the XWalk view:
myXWalkWebView.setResourceClient(myResourceClient);

Related

how to open android default share dialog in webview

i have created an app using webview and now i want to create a share button (in web and js) to open android default share dialog for user.
But this approach does not work:
const sharePromise = navigator.share(data);
Because this is not supported in Android Web View.
what can i do?
you can open share by calling custom JS bridge function. Like below
#JavascriptInterface
fun share(pMessage: String) {
Intent sharingIntent = new Intent(Intent.ACTION_SEND);
sharingIntent.putExtra(Intent.EXTRA_TEXT, pMessage);
sharingIntent.setType("text/plain");
startActivity(Intent.createChooser(sharingIntent, “ChooserTitle"));
}

is there no way to detect webview (chrome/android) with client side language?

I've figured out how to detect when my page is loaded on mobile in webview, but only for iOS with:
var standalone = window.navigator.standalone,
uerAgent = window.navigator.userAgent.toLowerCase(),
safari = /safari/.test( userAgent ),
ios = /iphone|ipod|ipad/.test( userAgent );
I've researched and it seems like chrome/android has to be done on the server side - do anyone know whether it is possible with JS to detect whether website is opened within webview on chrome/android? For example when your website is opened up within Facebook?
You can set a custom string as user-agent in your app's WebView.So if the user-agent is the custom string,you know that now it's in your app's WebView.
Android:
webView.getSettings().setUserAgentString("your agent");
iOS:
NSUserDefaults.standardUserDefaults().registerDefaults(["UserAgent": "your agent"])

iOS app, link to open website in browser, link in website closes browser

Objective : A button in iOS native app when clicked opens a url (webpage) in native browser (safari or other, not UiWebView as it no longer supports html file control api) then, using javascript in the opened webpage, close that browser window so revealing the app again.
Opening the URL from the native app is not an issue: How to launch safari and open URL from iOS app?
Closing that resultant browser window is an issue, is there a way to accomplish this?
Launching Your Own Application via a Custom URL Scheme and Pass Parameters.
Here is a nice tutorial on Using Custom URL Scheme in iOS
As in the tutorial, you should parse the URL parameters and store them to use in the app in this method:
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url
sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
{
NSLog(#"Calling Application Bundle ID: %#", sourceApplication);
NSLog(#"URL scheme:%#", [url scheme]);
NSLog(#"URL query: %#", [url query]);
return YES;
}

Not able to launch a pdf file in inappbrowser in android

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");

appcelerator - convert windows app to mobile app

I made a great app for windows with appcelerator and I want to convert it to mobile (android).
Problem is, unlike creating an app in windows where the default launcher is "index.html" and I can have all my javascript/css/html mixed in together, the mobile default launcher is app.js.
I've tried the following:
var webview = Titanium.UI.createWebView({
url : 'index.html'
});
var window = Titanium.UI.createWindow();
window.add(webview);
window.open({modal:true});
This works great however none of the api's I'm using inside of index.html are being run, it just alerts an error (undefined).
Does anyone know how to fix this issue?
EDIT:
There are only two API's I'm using in my app:
var db = Titanium.Database.open('app_data');
var device_id = Titanium.Platform.id;
you dont have access to all of the API from the webview, see link below
http://developer.appcelerator.com/question/8991/webview-usage-guideline
you will need to do most of your business logic in the js files and through the event mechanisms move data from you app to the ui level

Categories

Resources