web-dev-qa-db-ja.com

ブラウザでphonegapオープンリンク

<a target="_blank" data-rel="external" href="http://www.kidzout.com">www.kidzout.com</a>

ちょっと専門家私はphonegap 2.9.0を使用していて、私はブラウザでリンクを開くために上記のコードを使っています、しかしそれは同じアプリでそれを開きます......それをサファリブラウザを開くには？

それは同じアプリでウェブサイトを開くし、私はアプリに戻ってくることができないので、私はアプリを削除して再度インストールする必要があります.....

html5cordova
113
ahsan ali

同様の質問 で提案されているように、JavaScriptを使用して、 InAppBrowserドキュメント に従って、target引数をwindow.openに設定して_systemを呼び出します。

<a href="#" onclick="window.open('http://www.kidzout.com', '_system'); return false;">www.kidzout.com</a>

これはうまくいくはずですが、すべてのリンクのclickイベントをインターセプトし、リンクの属性から読み取った引数を使ってwindow.openを呼び出すことがより柔軟で柔軟な解決策になります。

これを機能させるにはInAppBrowserプラグインをインストールする必要があることを忘れないでください。

cordova plugin add cordova-plugin-inappbrowser
216
freejosh

他の記事で答えたように、プラットフォームごとに2つの異なる選択肢があります。私がしているのは：

document.addEventListener('deviceready', onDeviceReady, false);

function onDeviceReady() {

    // Mock device.platform property if not available
    if (!window.device) {
        window.device = { platform: 'Browser' };
    }

    handleExternalURLs();
}

function handleExternalURLs() {
    // Handle click events for all external URLs
    if (device.platform.toUpperCase() === 'Android') {
        $(document).on('click', 'a[href^="http"]', function (e) {
            var url = $(this).attr('href');
            navigator.app.loadUrl(url, { openExternal: true });
            e.preventDefault();
        });
    }
    else if (device.platform.toUpperCase() === 'IOS') {
        $(document).on('click', 'a[href^="http"]', function (e) {
            var url = $(this).attr('href');
            window.open(url, '_system');
            e.preventDefault();
        });
    }
    else {
        // Leave standard behaviour
    }
}

あなたが見ることができるように私はデバイスプラットフォームをチェックしているそしてそれに応じて私は異なる方法を使用している。標準的なブラウザの場合は、標準の動作のままにします。これ以降、ソリューションはAndroid、iOS、ブラウザで正常に機能しますが、HTMLページは変更されないため、URLを標準のアンカーとして表すことができます。

<a href="http://stackoverflow.com">

このソリューションにはInAppBrowserプラグインとDeviceプラグインが必要です

27
krzychu
<a onclick="navigator.app.loadUrl('https://google.com/', { openExternal:true });">Link</a>

Android＆PG 3.0で動作します

26
user2758937

AndroidとiPhoneでURLを開くには2つの方法があります。

FOR IOSは次のコードを使用します。

window.open("http://google.com", '_system');

android OSの場合は次のコードを使用します。

navigator.app.loadUrl("http://google.com", {openExternal : true});
20
Hassan Siddique

ついにこの記事はiOS上で私を助けます： http://www.excellentwebworld.com/phonegap-open-a-link-in-safari-or-external-browser/ 。

「CDVwebviewDelegate.m」ファイルを開き、「shouldStartLoadWithRequest」を検索してから、このコードを関数の先頭に追加します。

if([[NSString stringWithFormat:@"%@",request.URL] rangeOfString:@"file"].location== NSNotFound) {
    [[UIApplication sharedApplication] openURL:[request URL]];
    return NO;
}

navigator.app.loadUrl("http://google.com", {openExternal : true});をAndroidに使用しても問題ありません。

コルドバ経由3.3.0。

10
mytharcher

これらの答えはどれも、各プラットフォームで外部リンクを開くための十分な明示的なものではありません。によると inAppBrowserのドキュメント ：

インストール

cordova plugin add cordova-plugin-inappbrowser

window.openを上書きします（省略可能、簡単にするために推奨）

window.open = cordova.InAppBrowser.open;

window.openを上書きしない場合は、ネイティブのwindow.open関数を使用することになり、クロスプラットフォームで同じ結果になることは期待できません。

デフォルトのブラウザでリンクを開くために使用します

window.open(your_href_value, '_system');

InAppBrowserのターゲット（これはプラグイン名で使用されることを示唆しているものです）が、'_blank'ではなく'_system'であることに注意してください。

上記の手順がないと、クロスプラットフォームのデフォルトのブラウザアプリケーションでリンクを開くことができませんでした。

追加クレジット

これがリンクの（ライブ）クリックハンドラの例です。

document.addEventListener('click', function (e) {
    if (e.target.tagName === 'A' &&
        e.target.href.match(/^https?:\/\//)) {
        e.preventDefault();
        window.open(e.target.href, '_system');
    }
});
8
bozdoz

たまたまjQueryを使っているのなら、このようにリンクをクリックするのを阻止することができます。

$(document).on('click', 'a', function (event) {
    event.preventDefault();
    window.open($(this).attr('href'), '_system');
    return false;
});

こうすれば、html内のリンクを変更する必要がなくなり、多くの時間を節約できます。デリゲートを使用してこれを設定しました。それが、2番目の引数として 'a'タグを使用して、ドキュメントオブジェクトに関連付けられていることがわかる理由です。この方法では、いつ追加されても、すべての 'a'タグが処理されます。

もちろん、InAppBrowserプラグインをインストールする必要があります。

cordova plugin add org.Apache.cordova.inappbrowser
7
Michel Reij
window.open('http://www.kidzout.com', '_system');

アプリケーションブラウザプラグインがインストールされている場合にのみ機能します。インストールするには、terminalを使用して、プロジェクト内のwwwフォルダに移動して次のように入力します。

phonegap plugin add org.Apache.cordova.inappbrowser

または

cordova plugin add org.Apache.cordova.inappbrowser

それからあなたのリンクはブラウザで開くでしょう。

3
Dev01

Cordova 5.0以降では、プラグインInAppBrowserはCordovaプラグインレジストリで名前が変更されているため、次のコマンドを使用してインストールする必要があります。

cordova plugin add cordova-plugin-inappbrowser --save

それから使う

<a href="#" onclick="window.open('http://www.kidzout.com', '_system');">www.kidzout.com</a>
2
codevision

私はiOSを中心にPhoneGap Build（v3.4.0）を使用しています。PhoneGapがInAppBrowserプラグインを認識するためには、config.xmlにこのエントリを含める必要があります。

<gap:plugin name="org.Apache.cordova.inappbrowser" />

その後、window.open（url、target）を使用すると、ドキュメントに記載されているように期待どおりに動作するはずです ここ 。

1
contactmatt

私はまた、リンクがブラウザで開かないという問題に直面しています。

1：このcordovaプラグインをインストールしてください。

cordova plugin add cordova-plugin-inappbrowser

2：以下のようにHTMLにオープンリンクを追加します。

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

3：これが最も手間のかかるステップです。私は多くの問題に直面しました。cordova.jsファイルをダウンロードし、それをwwwフォルダーに貼り付けます。それからindex.htmlファイルでこれを参照してください。

<script src="cordova.js"></script>

このソリューションは、AndroidとiPhoneの両方の環境で機能します。

1
Tabish

このような ：

<a href="#" onclick="window.open('https://www.nbatou.com', '_system'); return false;">https://www.nbatou.com</a>
0
OussamaChaib