Open certain links in external browser using Nativescript - nativescript

I am working on a simple app written in Nativescript.
The app has a login form that authenticates against an API, and on success loads a webview. So not that complicated.
But I would like to be able to open certain links in the default browser on the phone, and not in webview, like links to external sites.
Is it possible to "capture" all link clicks, and if the link has the target attribute set to blank, we make the link open in a external browser?
I need a solution that works both on iOS and Android.
Is this possible to do in Nativescript?

Yes, it's possible to do that in NativeScript but not with the default WebView component. I was exactly in this situation, what I did is writing a plugin that customizes default WebView in NativeScript to override the default WKUIDelegate in iOS webview & idem for Android.
For iOS, the WKUIDelegate allow to detect if any attempt to open link with target _blank with method webViewCreateWebViewWithConfigurationForNavigationActionWindowFeatures, hence, when implementing your custom webview with this delegate allow to open link in external browser / application as you wish.
Take a look at this plugin: https://github.com/Notalib/nativescript-webview-ext to have an idea how to customize default webview.

You may use the nativescript-webview-ext plugin and use the shouldOverrideUrlLoading event to check the URL and cancel the process as needed then use the open url method in utility module to open the given url in default browser.

You can import this
import * as utils from "#nativescript/core/utils";
and then do
utils.openUrl("https://www.youtube.com/");
whenever you want to open a link (in this case youtube) in a default browser.

Related

Are there any changes in the WebView related APIs in UWP or UAP Windows app?

I am having a Windows 8.1 supported app, but now it is updated to the UWP/UAP (i.e. Windows 10) app.
After updating the custom URI scheme is not working, On a button click on the web page, we were using "navto://" custom URI scheme and handling were done in a js file. The button action was bind through the anchor tag.
From this approach, we navigate our web pages forward/backward or used to send a user to a particular web page.
But now this js file is being not called on the click of the same button and a System Popup appear saying "You will need a new app to open this navto link". For reference, please have a look at the attached screenshot of the error popup. If anybody is familiar with the issue, please suggest me the solution.
Actually I followed this page to migrating the app https://learn.microsoft.com/en-us/visualstudio/misc/migrate-apps-to-the-universal-windows-platform-uwp?view=vs-2015#MigrateCSharp
And also tried other options as well by googling but I haven't got any perfect solution yet.
Thanks

High Sierra WebView blocks anchor tag navigation

I have a Mac app that displays info in a WebView. Quite an old app now and in Objective-C which I am rapidly forgetting.
The WebView contains anchor tags to allow navigation within the pages, both by clicking on links in the page displayed, or by clicking tabs in the UI which send Javascript to the WebView. In High Sierra this no longer works although it displays no error.
It appears that I need to implement isKeyExcludedFromWebScript: but my attempts to do so have failed.
Do I need to sub-class WebView? Putting isKeyExcludedFromWebScript: and isSelectorExcludedFromWebScript: in the View Controller containing the WebView doesn't work - they never get called.
If anyone has any advice or examples, I would be most grateful.
I am afraid that the answer will be to upgrade the app to use WKWebView but I was hoping for a quick work-around until I get time to do that.
Answering my own question here as I have worked out a solution.
The problem was that I was loading an HTML string into the WebView and when I tried to use internal navigation links, it didn't have a base URL to use as a prefix and so the anchor navigation never worked.
It used to work, prior to High Sierra, so there must be something new about how WebViews operate.
The solution was to save the HTML string to a temporary file and have the WebView load that file's URL instead of loading the string directly.
This applies to both WebView and WKWebView.

Phonegap and windows phone native frame transition

I'm trying to find some docs to learn how to make phonegap app for windows phone, using native frame transition for HTML pages, but I cannot find such a plugin or code or any helpful doc.
What exactly I want to do is:
when I try to navigate to other page in HTML code using javascript code:
window.location.href = "newpage.html";
I want my app to navigate to different page like native app is doing transition effect, for example when app start we can see this page/frame transition effect.
How to do that transition effect for HTML pages ?
You should look at using jQuery Mobile to build HTML pages for a Phonegap app.
http://jquerymobile.com
It's useful because it has a built-in router, which can detect when you try to change to another HTML page. (either programatically or via a user clicking on links)
It then can hijack that event and make it load the next page asynchronously (which in the case of a Phonegap app, is pretty fast since the pages already exist on the device). It then applies the transitions you speak of when it displays the new page (slide, fade, etc).
It's quite customisable, and most of the behaviour is configured by just creating simple HTML markup and adding data attributes. E.g.
next page
I also like it because if you decide you want to go down the "single page app" route - you can do that too. I personally like the combination of Phonegap + jQuery Mobile + Backbone.js, where Backbone.js is dynamically generating my HTML jQuery Mobile pages, and Phonegap is wrapping them up in an app.

Do I need a Firefox plugin or an extension?

I need to read every url that loads into the navigation bar of firefox (either by type in or by clicking a link), pass them through a filter and decide if allow the url to open or not.
I have some experience on firefox extensions but not with plugins.
Do I need to do it using extensions or plugins for this?
I currently have a BHO for IE that does this, and I get the URLs using the web browser events.
An extension would be just fine. For what you want to do, you need nsIObserverService, and http-on-modify-request observer.
You can use Adblock Plus (See the video)

Right clicking with a Webkit view

I'm working on a project in Ruby right now that is essentially a web-app. We like the format of web-apps and some of the natural agile advantages we have building for the web. However, we want to be able to package our application and distribute it in a standalone format.
Ideally, we would like to essentially make a .app package for Mac and a .exe for Windows that just opens a Webkit view, connects to our server and renders the HTML we serve it.
Not so hard so far, though this is a little beyond our current expertise (especially the Windows development) but all surmountable.
The issue is that we'd like to enable right-clicking, as you can in the iTunes store (which is a Webkit view that has custom events for right-clicks). We want to give our right-clicks special meaning in our application, too, and have it act context sensitive.
What do we do? Where can we even start?
Do you want to do this from your webapp or from your native app side?
If you're doing this from a Cocoa app, you can just implement the webView:contextMenuItemsForElement:defaultMenuItems: WebUIDelegate method and return an array of custom NSMenuItem's corresponding to your custom actions.
If you want to do this from the web app itself, you can add an event listener for the "contextmenu" event like so:
document.addEventListener("contextmenu", function(event) {
event.preventDefault();
console.log("My spiffy custom right click menu here!");
}, false);
You need to be aware though, that if you use the above code in your webapp, you can't modify the browser's native right click menu, just replace it with your own custom creation.

Resources