28

私はウェブページを持っています。それを と呼びましょうentry.html。

ユーザーがこのページに入ると、JavaScript コード (以下を参照) がユーザーをネイティブの iOS / Android アプリにディープリンクしようとします。

ディープリンクが失敗した場合 (おそらくアプリがデバイスにインストールされていない場合)、ユーザーは別のページに「フォールバック」する必要がありますfallback.html。

で実行されている JavaScript コードは次のentry.htmlとおりです。

$(function(){
    window.location = 'myapp://';
    setTimeout(function(){
        window.location = 'fallback.html';
    }, 500);
});

これは、ネットワーク全体で推奨される標準のディープリンク方法です。ディープリンクを試み、タイムアウトが発生した場合は、ディープリンクが発生しなかったことを意味するため、フォールバックします。

アプリがデバイスにインストールされている限り、これは正常に機能します。

ただし、アプリがインストールされていない場合、これはディープリンクを試みるときの動作です。

Mobile Safari : 「Safari ではこのページを開けません...」という警告メッセージがしばらく表示された後、適切にフォールバックしますfallback.html- これは予期された動作です。

モバイル Chromeが問題です。

アプリがインストールされていない場合、ブラウザは実際にmyapp://URL にリダイレクトされますが、これはもちろん無効です。そのため、「見つかりません」というページが表示され、フォールバックは発生しません。

最後に- 私の質問は次のとおりです。

モバイルChromeでもフォールバックが発生するようにコードを修正するにはどうすればよいですか? モバイルSafariのように？

注：アプリがインストールされているかどうかに関係なく、SafariとChromeを使用して、LinkedInモバイルWebサイトがこれを適切に実行していることがわかりますが、それを担当するコードを追跡できませんでした:(

iframe注 2: の代わりに を追加しようとしましたがwindow.location = url、これは Safari でのみ機能し、アプリがインストールされていても iFrame を追加するときにモバイル Chrome はディープリンクしません。

皆さんありがとう！

アップデート：

私はまともな解決策を見つけ、自分の質問に答えました。私の解決策については、受け入れられた回答を参照してください。

4

7 に答える 7

17

興味のある人は誰でも、Android で Chrome をディープリンクすることでこれらの問題を解決する適切な解決策を見つけることができました。

私はアプローチを放棄しmyapp://、iOS デバイスの場合にのみ機能するようにしました。

Android デバイスの場合、プロトコルintentsとは概念的に異なるものを使用しています。myapp://

私は主に Web 開発者であり、Android 開発者ではないため、概念を理解するのに少し時間がかかりましたが、非常に単純です。ここで MY ソリューションを説明し、デモンストレーションしようとします ( で実装できる他のアプローチがあることに注意してくださいintents。ただし、これは私にとっては完全に機能しました)。

これは、Android アプリ マニフェストの関連部分であり、インテント ルールを登録しています (注意してくださいandroid:scheme="http"- これについては後ほど説明します)。

<receiver android:name=".DeepLinkReceiver">
    <intent-filter >
        <data android:scheme="http" android:host="www.myapp.com" />
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.BROWSABLE"/>
        <category android:name="android.intent.category.DEFAULT"/>
    </intent-filter>
</receiver>

これがアプリのマニフェストで宣言された後、メッセージに「http://www.myapp.com」を含むメールを自分に送信しています。

Android デバイスでリンクをタップすると、「chooser」ダイアログが表示され、次のどのアプリケーションで開くかを尋ねられますか? [クローム、マイアプリ]

「通常の」URL をタップしたときにこのダイアログが表示された理由は、httpスキームでインテントを登録したためです。

このアプローチでは、Android アプリ マニフェストで定義された既存のインテント ルールへの一致するリンクをタップすると、ディープリンクは Web ページで処理されず、デバイス自体で処理されます。

はい、私が言ったように、このアプローチは、Web ページ内からディープリンクを呼び出す iOS アプローチとは概念が異なりますが、問題を解決し、魔法のように機能します。

注:アプリがインストールされていない場合、選択ダイアログは表示されず、指定されたアドレスの実際の Web ページに移動するだけです (複数のブラウザーを使用していない限り、1 つを選択する必要があります.. . しかし、ささいなことはありません)。

これが同じことに直面している誰かを助けることができることを本当に願っています..そのような説明があればいいのに;-)

乾杯。

于 2015-03-15T12:40:59.407 に答える
1

このコードをディープリンクに使用しています。アプリがインストールされている場合、アプリが開きます。アプリがインストールされていない場合、これはそのまま残ります。アプリのインストールなしの他の条件を追加する場合は、setTimeout コードのコメントを外してください。

<script>

var deeplinking_url = scootsy://vendor/1;
$(document).ready(function(){
    call_me_new(deeplinking_url);
});

var call_me_new = function(deeplinking_url){

    if(deeplinking_url!=''){
        var fallbackUrl ='http://scootsy.com/';
        var iframe = document.createElement("iframe");
        var nativeSchemaUrl = deeplinking_url;
        console.log(nativeSchemaUrl);

        iframe.id = "app_call_frame";
        iframe.style.border = "none";
        iframe.style.width = "1px";
        iframe.style.height = "1px";
        iframe.onload = function () {
            document.location = nativeSchemaUrl;
        };
        iframe.src = nativeSchemaUrl; //iOS app schema url
        window.onload = function(){
            document.body.appendChild(iframe);
        }

        //IF the App is not install then it will remain on the same page.If you wish to send the use to other page then uncomment the below code and send a time interval for the redirect.
        /*
        setTimeout(function(){
            console.log('Iframe Removed...');
            document.getElementById("app_call_frame").remove();

        window.location = fallbackUrl; //fallback url
        },5000);*/
    }
};
</script>
于 2015-09-03T13:50:59.733 に答える
1

モバイルで最新のブラウザのほとんどをサポートする Javascript プラグインを作成しました。ただし、ユニバーサル リンクを使用して ios9 Facebook で動作するには、クロス ドメイン (ユニバーサル リンク URL とは異なる) でホストされるディープ リンク ランディング ページが必要です。Facebook SDK を使用して Facebook iOS9 で動作させる別の方法もあります。誰かがこれが役立つと思うかもしれない場合、私はこれを共有しています. 現在、フォールバック オプションはありませんが、App Store にフォールバックする場合。

https://github.com/prabeengiri/DeepLinkingToNativeApp

于 2016-02-09T23:08:30.390 に答える