ユーザーエージェントによってスマートフォンとPCを振り分ける方法3つ

いまどきはPC版とモバイルデバイス版のサイトを分けずにレスポンシブデザインで作ってワンソースマルチユースなものを作るべきなんでしょうけど、もろもろの事情でワンソースにできない場合もあると思います。
ということでユーザーエージェントによってスマートフォンとPCを振り分ける方法3つ、「.htaccess」「PHP」「JavaScript」のそれぞれの方法を。

.htaccessによる振り分け

サーバー側で「mod_rewrite」機能が有効になっていないとこの方法は使えないけど、一番手軽な方法ですね。
ルートドメイン直下に「.htaccess」を設置して「sp」等の名前をつけたスマートフォン用のディレクトリを用意しておく場合はこんな感じです。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_URI} !/sp/
RewriteCond %{HTTP_USER_AGENT} (iPhone|Android.*Mobile|Windows.*Phone) [NC]
RewriteRule ^(.*)$ sp/$1 [R,L]
</IfModule>

PHPによる振り分け

PHPだと振り分け機能をつけたいページ全てにコードを書かなきゃいけないので面倒ではありますが、普通はトップページに書いておけば充分ですし、PHPさえ動けばユーザー側がJavaScriptをオフにしていても機能するので便利ですね。

<?php
	$ua = $_SERVER['HTTP_USER_AGENT'];
	if (preg_match('/(iPhone|Android.*Mobile|Windows.*Phone)/', $ua)) {
		header('Location: ./sp/');
		exit();
	}
?>

JavaScriptによる振り分け

ユーザー側がJavaScriptを無効に設定していたらこの方法は使えませんが、サーバーの制約がないので気軽に使えるという気もしますね。

<script type="text/javascript">
	var ua = navigator.userAgent;
	if (ua.indexOf('iPhone') > 0
			|| (ua.indexOf('Android') > 0) && (ua.indexOf('Mobile') > 0)
			|| ua.indexOf('Windows Phone') > 0) {
		location.href = './sp/';
	}
</script>