前提・実現したいこと
ブラウザからタイトル通りの挙動をするJavascriptを組みたいです。
問題はiOS(iPad、iPhone)の場合です。Androidの場合は問題ない挙動をします。
すなわち、Androidの場合はintentを使用すれば、タイトル通りの挙動をします。
Androidでの挙動をiOSの場合でも実現したいというのが、今回の質問です。
Androidの場合の挙動
- 起動したいアプリがインストールされていない場合、アプリストア(Google Play)が起動する。
- 起動したいアプリがインストールされていれば、そのアプリが起動される。このとき、アプリストアは起動されない。
発生している問題・エラーメッセージ
iOSの場合、アプリがなければアプリストアが起動しますが、アプリがある場合でもアプリストアが起動してしまいます。
アプリストアを開くときに、(Androidと違って)ポップアップで「このページを"App Store"で開きますか?」と表示されますが、このポップアップ表示は不問とします。
該当のソースコード
ソースコードのiOSでの挙動確認では、既存インストールされているカレンダーアプリの起動と新型コロナウィルス接触確認アプリcocoaのストアが表示されます。
HTML
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <title>サンプル</title> 6</head> 7<body> 8 9<p>ボタンをクリックしてください。16</p> 10<p id="userAgent">userAgent</p> 11 12<input type="button" value="button" id="btn"> 13 14<script> 15 let button = document.getElementById('btn'); 16 17 button.addEventListener('click', function(event){ 18 let userAgent = document.getElementById('userAgent') 19 const ua = navigator.userAgent 20 userAgent.textContent = ua; 21 if (/android/i.test(ua)) { 22 document.location.href = "intent://post?message=本文#Intent;scheme=twitter;package=com.twitter.android;end;" 23 } 24 else if (/iPad|iPhone|iPod/.test(ua)){ 25 var checkdAt = new Date(); 26 setTimeout(function(){ 27 var t = new Date() - checkdAt; 28 if(t < 20000){ 29 document.location.href = "https://apps.apple.com/jp/app/id1516764458"; // Cocoa 30 } 31 }, 2000); 32 document.location.href = "calshow://"; 33 } 34 else { 35 console.log("Other") 36 console.log(ua); 37 console.log(userAgent.value); 38 } 39 40 }); 41</script> 42 43</body> 44</html>
補足情報(FW/ツールのバージョンなど)
挙動確認方法として、githubの静的ホスティングサービスに上のソースをUPし、iPhoneやAndroidで確認しています。
確認機種
- iPhone 7
- safari:ver 不明
- (Androidは問題としていないので、省略)
あなたの回答
tips
プレビュー