web-dev-qa-db-ja.com

YouTubeやマップなどのiPhoneアプリ用にhttp + domainベースのURLスキームを登録することはできますか？

アプリを携帯電話にインストールするたびにアプリでiOSを使用してドメインからURLを開きます（例： http://martijnthe.nl ）。ありません。

このために一意のプロトコルサフィックスを作成してInfo.plistに登録することは可能ですが、アプリがインストールされていない場合、Mobile Safariでエラーが発生します。

回避策は何ですか？

一つのアイデア：

1）デスクトップブラウザーで開くhttp：// URLを使用し、ブラウザーを介してサービスをレンダリングする

2）User-Agentを確認し、Mobile Safariの場合は、myprotocol：// URLを開いて（試行）iPhoneアプリを開き、試行が失敗した場合にモバイルiTunesを開いてアプリをダウンロードします

これがうまくいくかどうかわからない...提案はありますか？ありがとう！

iphoneiosurl
222
Martijn Thé

これを行う最も邪魔にならない方法は次のとおりだと思います。

  1. ユーザーエージェントがiPhone/iPod Touchのユーザーエージェントかどうかを確認します。
  2. appInstalled Cookieを確認する
  3. Cookieが存在し、trueに設定されている場合は、window.locationをyour-uri://に設定します（またはリダイレクトサーバー側で行います）
  4. Cookieが存在しない場合は、「サイト名にiPhoneアプリケーションがあることをご存知ですか？」を開きます。 「はい、すでに持っています」、「いや、でも試してみたい」、「そのままにしておきます」ボタンでモーダル。
    1. 「はい」ボタンはCookieをtrueに設定し、your-uri://にリダイレクトします
    2. 「Nope」ボタンは「 http://iTunes.com/apps/yourappname 」にリダイレクトし、デバイス上のApp Storeを開きます
    3. 「Leave me alone」ボタンは、Cookieをfalseに設定し、モーダルを閉じます

私が遊んだが、少し不格好だった他のオプションは、Javascriptで次のことをすることでした：

setTimeout(function() {
  window.location = "http://iTunes.com/apps/yourappname";
}, 25);

// If "custom-uri://" is registered the app will launch immediately and your
// timer won't fire. If it's not set, you'll get an ugly "Cannot Open Page"
// dialogue prior to the App Store application launching
window.location = "custom-uri://";
240
Nathan de Vries

フォールバックが別のアプリリンクである限り、JavaScriptでこれを行うことは非常に可能です。構築 ネイサンの提案 ：

<html>
  <head>
    <meta name="viewport" content="width=device-width" />
  </head>
  <body>

    <h2><a id="applink1" href="fb://profile/116201417">open facebook with fallback to appstore</a></h2>
    <h2><a id="applink2" href="unknown://nowhere">open unknown with fallback to appstore</a></h2>
    <p><i>Only works on iPhone!</i></p>    

  <script type="text/javascript">

// To avoid the "protocol not supported" alert, fail must open another app.
var appstorefail = "itms://iTunes.Apple.com/us/app/facebook/id284882215?mt=8&uo=6";

function applink(fail){
    return function(){
        var clickedAt = +new Date;
        // During tests on 3g/3gs this timeout fires immediately if less than 500ms.
        setTimeout(function(){
            // To avoid failing on return to MobileSafari, ensure freshness!
            if (+new Date - clickedAt < 2000){
                window.location = fail;
            }
        }, 500);    
    };
}

document.getElementById("applink1").onclick = applink(appstorefail);
document.getElementById("applink2").onclick = applink(appstorefail);

</script>
</body>
</html>

ここでライブデモをご覧ください 。

95
jb.

IOS 6デバイスの場合、オプションがあります。 スマートアプリバナーを使用したアプリのプロモーション

26
ohho

選択した答えはブラウザアプリで機能することがわかりましたが、UIWebViewを実装する非ブラウザアプリで動作するコードに問題がありました。

私にとっての問題は、TwitterアプリのユーザーがTwitterアプリのUIWebViewを介して私のサイトに移動するリンクをクリックすることでした。それから、彼らが私のサイトからボタンをクリックすると、Twitterは空想を出し、サイトが到達可能な場合にのみwindow.locationを完了しようとします。ですから、UIAlertViewのポップアップが表示され、続行してよろしいと言ってから、2番目のポップアップなしですぐにApp Storeにリダイレクトされます。

私のソリューションにはiframeが関係しています。これにより、UIAlertViewが表示されなくなり、シンプルでエレガントなユーザーエクスペリエンスが実現します。

jQuery

var redirect = function (location) {
    $('body').append($('<iframe></iframe>').attr('src', location).css({
        width: 1,
        height: 1,
        position: 'absolute',
        top: 0,
        left: 0
    }));
};

setTimeout(function () {
    redirect('http://iTunes.Apple.com/app/id');
}, 25);

redirect('custom-uri://');

Javascript

var redirect = function (location) {
    var iframe = document.createElement('iframe');
    iframe.setAttribute('src', location);
    iframe.setAttribute('width', '1px');
    iframe.setAttribute('height', '1px');
    iframe.setAttribute('position', 'absolute');
    iframe.setAttribute('top', '0');
    iframe.setAttribute('left', '0');
    document.documentElement.appendChild(iframe);
    iframe.parentNode.removeChild(iframe);
    iframe = null;
};

setTimeout(function () {
    redirect('http://iTunes.Apple.com/app/id');
}, 25);

redirect('custom-uri://');

編集：

Iframeに絶対位置を追加します。挿入すると、ページの下部に空白のランダムなビットがなくなります。

また、Androidでのこのアプローチの必要性を発見していないことに注意することも重要です。 window.location.hrefを使用すると問題なく動作するはずです。

23
cnotethegr8

IOS9では、Appleが最終的に特定のhttp:// URLを処理するアプリを登録する可能性を導入しました： niversal Links 。

仕組みの非常に大まかな説明：

  • アプリで特定のドメイン（Web URL）のhttp:// URLを開くことに関心があることを宣言します。
  • 指定されたドメインのサーバーで、サーバーのドメインからURLを開くことに関心があると宣言したアプリで開くURLを指定する必要があります。
  • IOS URL読み込みサービスは、上記で説明したように、セットアップのためにhttp:// URLを開こうとするすべての試行をチェックし、インストールされていれば正しいアプリを自動的に開きます。最初にSafariを経由せずに...

これは、iOSでディープリンクを行う最もクリーンな方法です。残念ながら、iOS9以降でのみ機能します。

20
severin
window.location = appurl;// fb://method/call..
!window.document.webkitHidden && setTimeout(function () {
    setTimeout(function () {
    window.location = weburl; // http://iTunes.Apple.com/..
    }, 100);
}, 600);

document.webkitHiddenは、アプリが既に起動されているかどうかを検出し、現在のサファリタブをバックグラウンドに移動することです。このコードはwww.baidu.com

9
zyanlu

ネイサンとJBの答えを再び構築：

追加のクリックなしでURLからアプリを起動する方法リンクをクリックする暫定的なステップを含まないソリューションを希望する場合は、以下を使用できます。このjavascriptを使用して、Django/PythonからHttpresponseオブジェクトを返すことができました。これは、インストールされている場合はアプリを正常に起動し、タイムアウトした場合はアプリストアを起動します。注：これをiPhone 4Sで機能させるには、タイムアウト期間を500から100に調整する必要もありました。状況に合わせてテストして調整します。

<html>
<head>
   <meta name="viewport" content="width=device-width" />
</head>
<body>

<script type="text/javascript">

// To avoid the "protocol not supported" alert, fail must open another app.
var appstorefail = "itms://iTunes.Apple.com/us/app/facebook/id284882215?mt=8&uo=6";

var loadedAt = +new Date;
setTimeout(
  function(){
    if (+new Date - loadedAt < 2000){
      window.location = appstorefail;
    }
  }
,100);

function LaunchApp(){
  window.open("unknown://nowhere","_self");
};
LaunchApp()
</script>
</body>
</html>
9
BFar

iframeをアプリのカスタムスキームに設定してsrcをWebページに追加すると、iOSはアプリ内のその場所に自動的にリダイレクトします。アプリがインストールされていない場合、何も起こりません。これにより、アプリがインストールされている場合はアプリにディープリンクでき、インストールされていない場合はApp Storeにリダイレクトできます。

たとえば、Twitterアプリをインストールしていて、次のマークアップを含むWebページに移動すると、すぐにアプリに移動します。

<!DOCTYPE html>
<html>
    <head>
    <title>iOS Automatic Deep Linking</title>
    </head>
    <body>
        <iframe src="Twitter://" width="0" height="0"></iframe>
        <p>Website content.</p>
    </body>
</html>

以下は、アプリがインストールされていない場合にアプリストアにリダイレクトするより完全な例です。

<!DOCTYPE html>
<html>
    <head>
    <title>iOS Automatic Deep Linking</title>
    <script src='//code.jquery.com/jquery-1.11.2.min.js'></script>
    <script src='//mobileesp.googlecode.com/svn/JavaScript/mdetect.js'></script>
    <script>
      (function ($, MobileEsp) {
        // On document ready, redirect to the App on the App store.
        $(function () {
          if (typeof MobileEsp.DetectIos !== 'undefined' && MobileEsp.DetectIos()) {
            // Add an iframe to Twitter://, and then an iframe for the app store
            // link. If the first fails to redirect to the Twitter app, the
            // second will redirect to the app on the App Store. We use jQuery
            // to add this after the document is fully loaded, so if the user
            // comes back to the browser, they see the content they expect.
            $('body').append('<iframe class="Twitter-detect" src="Twitter://" />')
              .append('<iframe class="Twitter-detect" src="itms-apps://iTunes.com/apps/Twitter" />');
          }
        });
      })(jQuery, MobileEsp);
    </script>
    <style type="text/css">
      .Twitter-detect {
        display: none;
      }
    </style>
    </head>
    <body>
    <p>Website content.</p>
    </body>
</html>
5
q0rban

私の知る限り、OS全体にhttp: + domain URLを理解させることはできません。新しいスキームのみ登録できます（アプリでx-darkslide:を使用しています）。アプリがインストールされている場合、Mobile Safariはアプリを正しく起動します。

ただし、アプリが「まだここにありますか？このリンクをクリックしてiTunesからアプリをダウンロードします」でアプリがインストールされない場合に対処する必要があります。あなたのウェブページで。

2
Fraser Speirs

解決策があります。

ぼかしとフォーカスを使用してブール型シテシエーションを設定します

//see if our window is active
window.isActive = true;
$(window).focus(function() { this.isActive = true; });
$(window).blur(function() { this.isActive = false; });

このようなものを呼び出すjqueryクリックハンドラーでリンクをバインドします。

function startMyApp(){
  document.location = 'fb://';

  setTimeout( function(){
    if (window.isActive) {
        document.location = 'http://facebook.com';
    }
  }, 1000);
}

アプリが開くと、ウィンドウへのフォーカスが失われ、タイマーが終了します。それ以外の場合は何も取得せず、通常のFacebookのURLを読み込みます。

2
Dane Macaulay

User-Agentを確認し、Mobile Safariの場合は、myprotocol：// URLを開いて（試行）iPhoneアプリを開き、試行が失敗した場合にアプリをダウンロードするためにMobile iTunesを開きます

これは理にかなっているように思えますが、モバイルiTunesを2番目の手段として開くことができるとは思わないでしょう。どちらかを選択する必要があると思います-アプリまたはiTunesにリダイレクトします。

つまり、myprotocol：//にリダイレクトし、アプリが電話にない場合は、iTunesにリダイレクトする機会が二度とありません。

おそらく最初に（iphoneに最適化された）ランディングページにリダイレクトし、ユーザーにアプリをクリックするか、iTunesがなければアプリを取得するためのiTunesをクリックするオプションを与えることができますか？しかし、あなたはユーザーが正しいことをするのを頼りにするでしょう。 （編集：Cookieを設定することはできますが、これは初めてのことですか？）

0
frankodwyer

ポップアップの問題を解決しようとして、Appleがこの懸念を回避する方法があることを発見しました。

実際、 このリンク をクリックすると、アプリケーションをインストールした場合、アプリケーションに再ルーティングされます。それ以外の場合は、ポップアップなしでWebページにリダイレクトされます。

0
Titignes