web-dev-qa-db-ja.com

モバイルWebサイトのFacebook URLスキーム、インストールされている場合はアプリを開く、そうでない場合はWebページに移動する

デスクトップとモバイルのハイブリッドWebサイトを作成していますが、すべて同じページを共有しています。つまり、デスクトップとモバイルの2つの別々のURLを持っていません。可能であれば、ネイティブFacebookアプリでFacebookリンクを開くようにしています。それ以外の場合は、通常のURLに移動します。それを自動的に処理するFacebookスキームには何かありますか？

基本的に、モバイルアプリがインストールされていない場合、またはユーザーがデスクトップを使用している場合は、https：//www.facebook.com/pages/ [pageid]にアクセスしてください。

モバイルアプリがインストールされている場合は、ここに移動します。

fb：// page/[pageid]

htmlfacebookmobile-website
13
user1795832

簡単な方法は、CSSメディアクエリです。

デバイス幅が小さい場合はfb：//リンクを表示します。より大きな画面サイズの通常のhttp：//リンク。

[〜＃〜]編集[〜＃〜]

<a href="https://facebook.com/page" class="large-screen">Clicky</a>
<a href="fb://page/mypage" class="small-screen">Clicky</a>

次に、CSS Mediaクエリを使用すると、画面のサイズに応じてリンクの1つが非表示になります。

[〜＃〜]更新[〜＃〜]

CSSを使用する代わりに、タイムアウトでX秒後にHTTP URLを開いた直後にディープリンクURLを開こうとすることにより、JavaScriptでより満足のいくユーザーエクスペリエンスを作成できます。

setTimeout(function () { window.location = "https://www.facebook.com"; }, 25);
window.location = "fb://";

HTTP URLは常に読み込まれますが、ディープリンクが使用できない場合、ディープリンクを開こうとすると、警告なしに失敗し、Webバージョンにフォールバックします。

出典： https://www.quora.com/How-does-Bitlys-Deep-Linking-detect-if-the-user-already-has-the-app-installed

14
Connor Finn McKelvey