时光

时光的时光轴

寄以时间,予以文字
telegram
github
微信公众号

URLスキームはどのようにジャンプすべきですか?

URL スキームとは何ですか#

現代の URL プロトコルでは、ブラウザでよく見かける「http」プロトコル以外にも、「URL スキーム」と呼ばれる URL があります。以下のようなリンクの例があります:

  • alipayqr://platformapi/startapp?saId=10000007 アリペイのスキャンを開く
  • weixin://scanqrcode WeChat のスキャンを開く

一般的な URL スキームはインターネットで検索することができますが、ここでは一般的な iOS アプリの URL スキームを見つけました。

これらの「プロトコルヘッダ」はアプリ自体で定義されています。これらの URL は正しく処理されると、URL の内容を持って対応するアプリに開かれ、渡されます。一般的な方法は、ブラウザやスマートフォンに組み込まれたスキャン機能を使用することです。

URL スキームは URL ですか?もちろんです、それは http URL とほぼ同じ特性を持っています。たとえば、GETパラメータをサポートすることができます。これにより、パラメータを対象のアプリに渡して処理させることができます。

ブラウザで URL スキームにアクセスすると開くことができます

ブラウザで URL スキームにアクセスすると開くことができます

それは何に使われますか?#

それを利用することで、異なるアプリ間での移動が可能になります。ウェブ技術は非常に成熟していますが、Nativeアプリを直接ブラウザで実行することはできません。いくつかの API はサポートされていないため(たとえば、ウェブ上で NFC 情報を読み取る)、または別のプラットフォームを運営するコストが高すぎるためです。

したがって、他の人が共有するアプリのリンクを開くと、最初の質問は「このページを「App」で開きますか?」です。そうしないと、使用できないウェブバージョンが表示される可能性があります。

image

image

今日はこのアプリを開いてください!!

国の規制により、強制的にアプリを使用する場面は減りました。機能を制限するための目くらましに過ぎず、1 つの画像に 3 つの場所がアプリを開くことを示唆しています。

それまではどうでしたか?悪質な行為で、画像を検索すると App を使用して結果を表示する必要がありました...(具体的な名前は挙げませんが、使用したことがある人はわかるでしょう)


それほど悪いですか?それなら、このものは何のためにあるのでしょうか?それは間違いなく需要があるために作られたものです。たとえば、ウェブページで商品を購入して支払うとき、ウェブページに簡単なログインをするときなど、ウェブページはスマートフォンのアプリに保存されている情報を取得することはできません。また、いつも忘れてしまうパスワードをウェブページで再入力したり、セキュリティ情報を尋ねられたりすることも望ましくありません。

したがって、このものは利点と欠点の両方を持っています。国の介入後、私はこの利点が徐々にバランスを取ると考えています。

相互作用での最適な移動方法は何ですか?#

では、この「URL スキーム」を使用する必要がある場合、ウェブページで実現できない機能をユーザーにアプリを開いて使用させるにはどうすればよいでしょうか?

URL スキームの移動方法のいくつか#

前述したように、「URL スキーム」は本質的には「URL」ですので、通常のリンクの開き方が使用できます:

  • a タグ
  • JavaScript を使用して iframe を作成する方法
var iframe = document.createElement('iframe');
iframe.style.display = 'none';
iframe.src = url;
document.body.appendChild(iframe);
  • JavaScript を使用して移動する方法
window.location.href = url;

ただし、前述のように、「URL スキーム」はアプリがアクティブに登録する必要があります。アプリがインストールされていない場合はどうなりますか?その場合、次のようになります:

image

成功したかどうかをどのように判断するか#

余談ですが、もう 1 つの「Universal Link」は、システムやブラウザが対応するアプリが開かれたかどうかを自動的に判断することができます。ただし、これはApple デバイスでのみ使用できます。

URL にアクセスすることは一方向の操作であり、プログラムにフィードバックを提供しません。したがって、成功したかどうかを判断するためには、他のいくつかの現象から判断する必要があります:
image

出典:各種シナリオでのアプリの起動方法

一般的な方法はタイマー法です。原理は、アプリに移動した後、ブラウザの JavaScript スレッドが一時停止される可能性があるため、「時間が進まなくなる」ことです。アプリがインストールされていない場合、元のウェブページにとどまる可能性があるため、URL スキームの開き方が成功しなかったことを判断し、その後のロジックを実行します。

ただし、コードは非常に複雑で、互換性が非常に高くなっています。もう少し簡単にできないでしょうか?


var work = false;
window.location.href = "URLスキーム"
window.onblur=function(){work = true;}
window.setTimeout(function(){
  if(!work){
    失敗時のロジック、例えば:
    window.location.href = "次のリンク"
  }
},1000)

これは私が試しに書いてみたものですが、上記の記事にも述べられているように、異なる機種の起動速度を考慮する必要があります。ここでは固定の1 秒にしましたが、視覚的にはページが進行するまでにそれほど長くは感じません。

ただし、同じページがフォーカスを失っているかどうかを判断する方法は同じですが、URL スキームが無効な場合、Safari ブラウザでもポップアップウィンドウが表示されるため、このような処理を行うと、アプリがインストールされていないユーザーも正しいフィードバックを得ることができなくなります。

もちろん、これは異なるプラットフォームによるものですが、私の実際のテストでは、かなりの数のアプリの内蔵ブラウザ / Android 標準ブラウザは、認識できない URL スキームに遭遇した場合には何のフィードバックも提供しません。

したがって、**「1000 人を誤射しても 1 人を逃さない」** という原則に基づいて、実際のビジネスでは次のように使用する必要があります:

window.location.href = "URLスキーム"
window.setTimeout(function(){
  失敗時のロジック、例えば:
  window.location.href = "次のリンク"
},1000)

まだ待つ必要がありますが、アクティブになれるユーザーにとっては視覚的には割れ目が少なくなります(ポップアップウィンドウの下にはまだ読み込むものがあります)

Universal Link のサポートを大いに発展させましょう!

悪質な行為を拒否し、基本的な機能のためにアプリに強制的に移動しましょう!

読み込み中...
文章は、創作者によって署名され、ブロックチェーンに安全に保存されています。