Search code examples
cordovaurlwindows-phone-8.1phonegap-buildinappbrowser

Open external link in cordova with in app for windows

I need to open external link in cordova within app for windows, i used inAppBrowser plugin and tried various way but it not open what i expected. But it worked for both android and iOS.

var app = {
// Application Constructor
initialize: function() {
    this.bindEvents();
},
// Bind Event Listeners
//
// Bind any events that are required on startup. Common events are:
// 'load', 'deviceready', 'offline', and 'online'.
bindEvents: function() {
    document.addEventListener('deviceready', this.onDeviceReady, false);
},
// deviceready Event Handler
//
// The scope of 'this' is the event. In order to call the 'receivedEvent'
// function, we must explicitly call 'app.receivedEvent(...);'
onDeviceReady: function() {
    //app.receivedEvent('deviceready');
    window.open('http://stackoverflow.com/', '_blank');

       },
   };app.initialize();

i tried both _self and _blank like that 

window.open('http://stackoverflow.com/', '_self');
window.open('http://stackoverflow.com/', '_blank');

_self is not open any page but _blank open the page with padding please refer below screen

screen shot

how can i display full screen without like this?

my html page is 

<html>
<head>
    <!--
    Customize this policy to fit your own app's needs. For more guidance, see:
        https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy
    Some notes:
        * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
        * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
        * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
            * Enable inline JS: add 'unsafe-inline' to default-src
    -->
    <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <title>Hello World</title>
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script src="phonegap.js"></script></head>

Thanks.

Solution

  • Based on the InAppBrowser documentation:

    Windows only:

    fullscreen: set to yes to create the browser control without a border around it. Please note that if location=no is also specified, there will be no control presented to user to close IAB window.

    So, in your case :

    window.open('http://stackoverflow.com', '_blank', 'fullscreen=yes');