Help us understand the problem. What is going on with this article?

無料でiOSとAndroidのストアにリダイレクトする

More than 3 years have passed since last update.

はじめに

個人ゲームを作っていてTwitterなんかを始めると、iOSとAndroidのストアページのリンクを両方貼っていたら140文字になんか収まらなくなりますね。
本来ならランディングページを作って、AppStoreとGooglePlayのバナーを貼るのがベストなんでしょうが、デザインを作る余裕もないし、サーバーなんか持っていない!
だけど、とりあえず1つのURLでAppStoreとGooglePlayのストアに飛ばしわけたいというケースはそこそこあるんじゃないでしょうか。

技術的には端末のUserAgentをみてリダイレクトするだけなんですが、無料という縛りが入ると、意外と選択肢は少なかったです。今回はクライアントサイドのJavaScriptで実現しました。

検討した候補

  • Heroku
    • 無料だとスリープするのが必須とかで、スリープしないためにCronでジョブ実行するとか本末転倒な感じだったので断念
  • 無料のレンタルサーバー
    • 意外と使えるのが見つけられず。お名前ドットコムでドメイン運用してますが、さすがに無料のサーバーは提供していないんですね。
  • Google Site
    • 任意のJavaScriptが実行できませんでした。。。
  • Google Apps Script
    • これでいけました

実装方法

Google Apps Script をWebアプリケーションとして一般公開することで無料で実現できます。まずはGoogle Driveからスクリプトを作成しましょう。

コード

コード.gs
function doGet(e) {
  var t = HtmlService.createTemplateFromFile('index.html');
  return t.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME);
}
index.html
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>

  <form action='https://itunes.apple.com/app/idxxxxxx' method='GET' id='ios'>
    <input type="hidden" name="mt" value="8">
  </form>
  <form action='https://play.google.com/store/apps/details' method='GET' id='android'>
    <input type="hidden" name="id" value="com.example.xxxxx">
  </form>  

<script
  src="https://code.jquery.com/jquery-3.1.1.min.js"
  integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
  crossorigin="anonymous"></script>

<script type="text/javascript">

$(document).ready(function() {
if((navigator.userAgent.toLowerCase().indexOf("iphone") > -1) || (navigator.userAgent.toLowerCase().indexOf("ipod") > -1) || (navigator.userAgent.toLowerCase().indexOf("ipad") > -1)) {
  $("#ios").submit();

} else if ((navigator.userAgent.toLowerCase().indexOf("android") > -1)) {
  $("#android").submit();

} else {
  $("#ios").submit();
}
});
</script>
</body>
</html>

com.example.xxxxはGoogle Play、idxxxxxxはAppStoreのidに変更してください。

あとは公開→Webアプリケーションとして公開にてユーザー全員に公開すれば完了です。
GASだとURLが長くなってしまうので、短縮URLを使うのが良いです。
https://goo.gl/
Googleならアクセス履歴も確認できます。

実際の挙動はこんな感じです

https://goo.gl/bbYGWh

kbysta1
ゲーム開発者。普段の仕事ではC++(cocos2d-x), JavaScript, Perl, GASあたりを使います。モチベーション維持のために宝くじを買うような感覚で個人ゲームをUnityで作ったりしてます。
https://twitter.com/kbysta1
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした