スマホ・PCを判別してリダイレクトするまとめ
PC用ページとスマホ用ページが別々に存在する場合、
ユーザーエージェントで振り分けるのが一般的です。
方法は.htaccess , javascript , php といくつかあります。
.htaccess で自動的に振り分ける方法
一番よく使います。
<IfModule mod_rewrite.c> RewriteEngine On RewriteCond %{HTTP_USER_AGENT} (iPhone|Android.*Mobile|Windows.*Phone) [NC] RewriteCond %{QUERY_STRING} !mode=pc RewriteRule ^$ /sp/ [R,L] </IfModule>
こちらがとても参考に
AllAboutPC版とスマートフォン版サイトを自動振り分けする方法
http://allabout.co.jp/gm/gc/386483/3/
4行目のRewriteCond %{QUERY_STRING} !mode=pcは
?mode=pc
というパラメーターが付与されていないときだけリダイレクトする
付与されている場合はリダイレクトしない
★スマホ用ページからPC用ページにリダイレクトする場合
使う機会はあまりないと思うが、検索結果でスマホ専用ページが、PC用のページより上位に来ちゃったからスマホページにアクセスしたらPCページに飛ばしたいときなど
その場合、3行目
RewriteCond %{HTTP_USER_AGENT} !(iPod|iPhone|iPad|Android|Windows\ Phone)
に。
Javascript でスマホとPCを振り分ける
<script type="text/javascript"> if ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0) { location.href = '/sp/'; } </script>
indexOf()メソッドは、指定したキーワードの発見位置を返す。
発見できなければ「-1」を返すので、0より上であればキーワードが発見できたことになります。
navigator.userAgentでユーザーエージェントを取得し値が「iPhone」だった場合
iPhoneだったときの処理
<script type="text/javascript"> if ((navigator.userAgent.indexOf('iPhone') > 0{ //iPhoneだったときの処理 } </script>
iPhoneじゃなかったときの処理
<script type="text/javascript"> if ((navigator.userAgent.indexOf('iPhone') == -1{ //iPhoneじゃなかったときの処理 } </script>
PHPによるスマホ、PCの振り分け
<?php $ua=$_SERVER['HTTP_USER_AGENT']; if((strpos($ua,’iPhone’)!==false)||(strpos($ua,’iPod’)!==false)||(strpos($ua,’Android’)!==false)) { header(“Location:/sp/index.php”); exit(); } ?>
パラメータ付URLの振り分け
これが
パラメータ付きURLを、パラメータ付きURLへリ
http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q14108068759
参考にさせてもらったサイト
ユーザーエージェントによってPCとスマートフォン(iPhone / Android)を振り分ける方法いろいろ(PHP / JavaScript / .htaccess等)
http://html5-css3.jp/smartphone/pc-iphone-android-php-javascript-htaccess.html
.htaccessでPCサイトとスマートフォンサイト切り替え
http://www.kaasan.info/archives/1409
JavaScript とかによるブラウザ判定方法のまとめ
http://etc9.hatenablog.com/entry/20110927/1317140891
スマートフォン(iPhone/Android)のページ内振り分け
http://rfs.jp/sb/javascript/js_lab/smartphone_user-agent.html