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

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Need to open link from inappbrowser in default system browser