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> |
コメント