1

ドキュメントを見ても分からなかったので質問させて頂きます。

Monacaアプリ内で<a href="URL">でwebページを表示した場合、アプリ内でwebページが開かれると思います。

この表示されたwebページから、ローカル側のindex.htmlに戻る事は可能でしょうか?

webページに遷移した後、Androidの物理バックボタンを押すと戻る事ができましたが、やりたい事はwebページ内にボタンを設置して、それをタップしたらローカルファイルに戻る、という動作をしたいと考えております。

ご存知の方がいらっしゃいましたら、どうかご回答をお願いいたします。

1
  • InAppBrowserプラグインを使用すれば解決すると思います。
    – otak-lab
    Commented 2016年10月22日 8:31

1 件の回答 1

1

InAppBrowserプラグインを使用しますので、Cordovaプラグインの管理よりInAppBrowserプラグインを追加する必要があります。

aタグをクリックした場合、_blankwindow.open()を実行するように処理を変更します。
InAppBrowserloadstopイベントで、ブラウザに表示されたページの下部に[CLOSE]ボタンを設置し、そのボタンをクリックした場合、about:blankを開く処理をexecuteScript()で設定します。
URLabout:blankが含まれる場合、ref.close()を実行してブラウザを閉じます。
※Web側でボタンをクリックした場合にabout:blankを開く処理を組み込んでおけば、executeScript()は不要です。

下記のページも参考にしてください。
cordova-plugin-inappbrowser

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, 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">
    <script>
        "use strict";
        window.addEventListener("load", function(e) {
console.log("load");
            var elem = document.getElementById("jump_url");
            elem.addEventListener("click", function(e) {
console.log("click");
                var ref = window.open("http://ja.stackoverflow.com/", "_blank", "location=no");
                ref.addEventListener("loadstop", function(e) {
console.log("loadstop " + e.url);
                    if (e.url.search(/about:blank/) > -1) {
                        ref.close();
                    } else {
                        ref.executeScript({
                            code: "var btn=document.createElement('button');var t=document.createTextNode('CLOSE');btn.appendChild(t);btn.addEventListener('click', function(e) { window.open('about:blank'); }, false);document.body.appendChild(btn);"
                        });
                    }
                }, false);
                ref.addEventListener("exit", function(e) {
console.log("exit");
                    alert("close browser");
                });
            }, false);
        }, false);
    </script>
</head>
<body>
    <br />
    <a id="jump_url" href="#">StackOverFlow</a>
</body>
</html>

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。