2024.10.01
【勉強】ミドルウェア・アプリケーションのEOL・EOSLについて学んでみた
2014.10.14
プログラミングURLスキームからのアプリ起動・アプリが無ければショップサイトを開く(iOS/Android)
こんにちは、JTです。
【動作概要】
・UAからiOS/Androidを判定してそれぞれの処理へ
・URLスキームを利用して、facebookアプリで該当のページ(ディープリンク)を開く。
・アプリがインストールされていなければAppStore/GooglePlayのアプリダウンロードサイトを開く。
【メモ】
・iOS側の処理は古くから利用されているもので、アプリが起動していなければ300ミリsec後にショップサイトへ遷移するというもの。
・Androidでは上記処理をiframe内で実行する必要があるが、Chrome・標準ブラウザ(バージョン25(2013年2月)以降)では以下の様な書式で呼び出すことを推奨している。こっちの方が簡単。
intent:
HOST/URI-path // Optional host
#Intent;
package=[string];
action=[string];
category=[string];
component=[string];
scheme=[string];
end;
例)
<a href="intent://profile/341219895930508#Intent;scheme=fb;package=com.facebook.katana;end">facebookでテクノモバイルのページを開く</a>
【サンプルコード】
<html> <head> <title>インストール判定テスト(iOS/Android共存)</title> </head> <body> <a href="#" onclick="launchApp()">[facebookでテクノモバイルのページを開く]</a> <script> function launchApp() { if ( navigator.userAgent.indexOf('iPhone') > 0 || navigator.userAgent.indexOf('iPad') > 0 || navigator.userAgent.indexOf('iPod') > 0 ) { document.location = "fb://profile/341219895930508"; var time = (new Date()).getTime(); setTimeout(function(){ var now = (new Date()).getTime(); if((now-time)<400) { document.location = "https://itunes.apple.com/jp/app/facebook/id284882215?mt=8&uo=4"; } }, 300); } else if(navigator.userAgent.indexOf('Android') > 0) { document.location = "intent://profile/341219895930508#Intent;scheme=fb;package=com.facebook.katana;end"; } }; </script> </body> </html>
【参考サイト】
# iOS部分
http://iphone-dev.g.hatena.ne.jp/laiso/20120625/1340615723
# Android部分
https://developer.chrome.com/multidevice/android/intents
# スマートフォン(iPhone/Android)のページ内振り分け
http://rfs.jp/sb/javascript/js_lab/smartphone_user-agent.html
【記事への感想募集中!】
記事への感想・ご意見がありましたら、ぜひフォームからご投稿ください!【テクノデジタルではエンジニア/デザイナーを積極採用中です!】
下記項目に1つでも当てはまる方は是非、詳細ページへ!Qangaroo(カンガルー)
【テクノデジタルのインフラサービス】
当社では、多数のサービスの開発実績を活かし、
アプリケーションのパフォーマンスを最大限に引き出すインフラ設計・構築を行います。
AWSなどへのクラウド移行、既存インフラの監視・運用保守も承りますので、ぜひご相談ください。
詳細は下記ページをご覧ください。
最近の記事
タグ検索