Treadstone
Treadstone

Reputation: 39

Embed another webpage in a Cordova application

I am developing a apache cordova android application. I want to embed a webpage by url in my app with back button. I have already installed Crosswalk Webview plugin in app content. But haven't find a way to use it. Actually I am new in this platform. SO my question is how can i embed another site in my application index.html file?

Upvotes: 0

Views: 2457

Answers (1)

Akintoba
Akintoba

Reputation: 111

USE cordova-plugin-inappbrowser

Cordova InAppBrowser Plugin This plugin provides a web browser view that displays when calling cordova.InAppBrowser.open().

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes'); The cordova.InAppBrowser.open() function is defined to be a drop-in replacement for the window.open()function. Existingwindow.open() calls can use the InAppBrowser window, by replacing window.open:

window.open = cordova.InAppBrowser.open; The InAppBrowser window behaves like a standard web browser, and can't access Cordova APIs. For this reason, the InAppBrowser is recommended if you need to load third-party (untrusted) content, instead of loading that into the main Cordova webview. The InAppBrowser is not subject to the whitelist, nor is opening links in the system browser.

The InAppBrowser provides by default its own GUI controls for the user (back, forward, done).

InAppBrowser is not available until after the deviceready event.

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    console.log("window.open works well");
}

:warning: Report issues on the Apache Cordova issue tracker

Installation cordova plugin add cordova-plugin-inappbrowser If you want all page loads in your app to go through the InAppBrowser, you can simply hook window.open during initialization. For example:

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    window.open = cordova.InAppBrowser.open;
}

cordova.InAppBrowser.open Opens a URL in a new InAppBrowser instance, the current browser instance, or the system browser.

var ref = cordova.InAppBrowser.open(url, target, options);

quick example

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
var ref2 = cordova.InAppBrowser.open(encodeURI('http://ja.m.wikipedia.org/wiki/ハングル'), '_blank', 'location=yes');

read more here at https://www.npmjs.com/package/cordova-plugin-inappbrowser

Upvotes: 1

Related Questions