概要
アプリを作った後に、アプリのストアURLをシェアしたりしますよね?
もしそのリンクを開いた時に
- PCユーザーならアプリの公式HPへ飛ばす
- Androidユーザーかつアプリが入っていたらアプリを起動
- Androidユーザーかつアプリが入っていなかったらアプリのストアを表示
- iOSユーザーかつアプリが入っていたらアプリを起動
- iOSユーザーかつアプリが入っていなかったらアプリのストアを表示
というのを実現出来たら便利じゃないですか?
事前準備
まず、Android、iOSのアプリはURLスキームを使えるようにしておいてください。
このあたりの説明は割愛します。
あとは、アプリの公式HPとかを作ってください。
ココらへんも頑張ればできるよ!頑張れ!
プログラム
以下のプログラムを書いてサーバーにアップします。
あとは、シェアするときに下記のファイルを開くURLをシェアすればおk。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>アプリ起動サンプル</title>
</head>
<body>
<div style="width: 0; height: 0; overflow: hidden;">
<iframe id="launch_frame" name="launch_frame"> </iframe>
</div>
<a href="公式サイトのURLとかここに入れるべし!">サイトを開く</a>
<script>
// アプリを開く。アプリがインストールされていなければサイトを開く。
function launchApp() {
var IOS_SCHEME = 'iOSのURLスキームをここに入れるべし!';
var IOS_STORE = 'iOSのストアURLをここに入れるべし!';
var ANDROID_SCHEME = 'AndroidのURLスキームをここに入れるべし!';
var ANDROID_PACKAGE = 'Androidのパッケージ名をここに入れるべし!';
var PC_SITE = '公式サイトのURLとかここに入れるべし!'
var userAgent = navigator.userAgent.toLowerCase();
// iPhone端末ならアプリを開くかApp Storeを開く。
if (userAgent.search(/iphone|ipad|ipod/) > -1) {
launch_frame.location.href = IOS_SCHEME + '://';
setTimeout(function() {
location.href = IOS_STORE;
}, 500);
}
// Android端末ならアプリを開くかGoogle Playを開く。
else if (userAgent.search(/android/) > -1) {
document.location = 'intent://#Intent;scheme=' + ANDROID_SCHEME
+ ';package=' + ANDROID_PACKAGE + ';end';
}
// その他・不明・PCなどの場合はサイトを開く。
else {
document.location = PC_SITE;
}
}
// ページ読み込み時に実行
window.onload = function() {
launchApp();
}
</script>
</body>
</html>
最後に
もし、きちんと動かなかったらごめんなさい。
その時はコメントとかください!