Need to open link from inappbrowser in default system browser

makstakeda

Hello! Need some help with Monaca please.

Im newbie here) Tryin to build first app.

Look. I need to open link in default system browser from external page that was open at webview inside app.

For example:

I have “index.html” with simple link to “www.example.com”. I’m opening it inside app (like target="_self") and need to open all links from “www.example.com” at default browser. How and where can i do that?

Here is my code of index.html

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
    <script src="components/loader.js"></script>
    <link rel="stylesheet" href="components/loader.css">
    <link rel="stylesheet" href="css/style.css">
    <link href="https://fonts.googleapis.com/css?family=Hind+Vadodara:400,700|Montserrat+Alternates:400,700" rel="stylesheet">

<link href='https://fonts.googleapis.com/css?family=Tinos:400,400italic,700,700italic&subset=latin,cyrillic' rel='stylesheet' type='text/css'>
    <script>
        // PhoneGap event handler
        document.addEventListener("deviceready", onDeviceReady, false);
        function onDeviceReady() {
            console.log("PhoneGap is ready");
            StatusBar.backgroundColorByHexString("ff2e00");
            StatusBar.show();
            $("a[target='_system']").click(function(e){
            e.preventDefault();
            window.open($(e.currentTarget).attr('href'), '_system', '');
            });
        }
    </script>
    





    
</head>
<body>

<div>
<img src="include/images/logo_border.svg" style="width: 170px; margin-top: 20px;">
    
    <a href="https://example.com" class="main">link</a>
    

</div>


</body>
</html>

munsterlander

@makstakeda You will need to add the InAppBrowser plugin, then use:

<a href="#" onclick="window.open('https://www.google.com/', '_system', 'location=yes');" >Google</a>

makstakeda

@munsterlander Nope. I already use it and it doesnt work at external pages that were loaded from app’s webview (inappbrowser). I need to go from “in app browser” (that was opened at app) to default browser by link. Is it possible?

munsterlander

@makstakeda :

 '_system',

That part opens it up in the phones default browser. https://github.com/apache/cordova-plugin-inappbrowser

I just did a debug build to confirm it is working.

jrantala

Hi, this answer may come bit late but the question is still valid and this may help someone.

First, install Cordova InAppBrowser:

cordova plugin add cordova-plugin-inappbrowser

Then replace the window.open (this step is not necessary, but it makes things simplier)

window.open = cordova.InAppBrowser.open;

Then you can call:

<a href="https://google.com" onclick="window.open('https://google.com', '_system'); return false;">Google</a>

I have written more detailed blog article about the issue here