ブラウザから、「iOSアプリがインストールしてあったら起動・インストールしていない場合はAppStoreへ移動する」サンプル
SaraCameraに CustomURLScheme を組み込んでいただいたのでメモ。
a href="saracamera://" でSaraCameraを直接起動できます。
もしインストールされていない場合は、AppStore に遷移させることができます。
「アプリがインストールしてあったら起動・していない場合はAppStoreへ移動する」htmlサンプル
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 |
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>アプリがインストールされていない時にStoreへ遷移するデモ</title> <meta name="viewport"
content="width=device-width,user-scalable=Yes,maximum-scale=10, initial-scale=1.0"> <script src="https://code.jquery.com/jquery-3.1.0.min.js"
integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s="
crossorigin="anonymous"></script> <!--
Latest compiled and
minified CSS
--> <link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous"> <!--
Optional theme
--> <link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"
integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp"
crossorigin="anonymous"> <!--
Latest
compiled
and
minified
JavaScript
--> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script> <script src="bundle.js"></script> <style media="screen"> body { padding:
16px; } #log { font-size:
24px; padding:
8px; } </style> </head> <body> <form> <div class="form-group"
id="form"> <label for="urlScheme">起動するiPhoneアプリScheme名</label> <input class="form-control"
id="urlScheme"
value="saracamera://"
placeholder="saracamera://"> </div> <div class="form-group"> <label for="fallback">起動しない時の遷移先</label> <input class="form-control"
id="fallback"
value="https://apps.apple.com/jp/app/saracamera/id1459627879"
placeholder="https://apps.apple.com/jp/app/saracamera/id1459627879"> </div> <div class="form-group"> <label for="browserback">ブラウザの戻るボタンを押した時の遷移先</label> <input class="form-control"
id="browserback"
value="https://saracamera.com/"
placeholder="https://saracamera.com/"> </div> <button class="btn btn-default"
id="launch">テスト検証</button> </form> <div id="log"> </div> <script> $('#launch').on('click',
function(e)
{ e.preventDefault(); var
urlScheme
=
$('#urlScheme')[0].value; var
fallback
=
$('#fallback')[0].value; var
browserback
=
$('#browserback')[0].value; if
(!urlScheme)
{ $('#log').text('you must set "urlScheme"'); return; } var
fcs
=
new
window.FallbackCustomScheme({ urlScheme:
urlScheme, fallback:
fallback, browserback:
browserback, onFallback:
function()
{ $('#log').text('fallback: '
+
fallback); }, onBrowserback:
function()
{ $('#log').text('browserback: '
+
fallback); } }); fcs.launch(); }); </script> </body> </html> |