そもそもの発端は、デバイス非依存(除くガラケー)なWebページを作ってみようというものだった。iOSの場合は320×480を基準に設計すれば良いので話しは簡単だ。厄介なのはAndroidで、機種により画面サイズもアスペクトも異なっている。これに対応するためには、まず機種判定し、JavaScriptなどで画面サイズを取得して…ということになる。
機種判定はブラウザのUser Agentで判断するのが簡単だ。たとえばPHPでは、
echo $_SERVER['HTTP_USER_AGENT'];
で取得することができる。返ってきた値から、iPhoneとか、Androidという文字列を探し出せば良い。
ちなみに、コレがおたくが今使っているブラウザでの表示結果だ。
echo $_SERVER[‘HTTP_USER_AGENT’];
[/insert_php]
ところがなぜか、愛用のlenovo A1 AndroidタブレットがiPadだと判定されてしまう。User Agentを見て驚いた。確かに我是iPad了!と言い張っている。
lenovo A1:
Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B367 Safari/531.21.10
ちなみにiPadならぬiPhoneでの実行結果は次のとおり。
iPhone 4S:
Mozilla/5.0 (iPhone; CPU iPhone OS 6_1_3 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Version/6.0 Mobile/10B329 Safari/8536.25
こちらはモノホンのiPad。
iPad:
Mozilla/5.0 (iPad; CPU OS 6_1_3 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Version/6.0 Mobile/10B329 Safari/8536.25
そこで快獣使いの102Pで試してみた。確かにAndroidである。
Softbank 102P:
Mozilla/5.0 (Linux; U; Android 2.3.5; ja-jp; 102P Build/GRJ90) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1
ひょっとしてUser Agentを欺いているのではないだろうか。ブラウザの設定を見ると、「Support HTML5 user agent / Support play some videos of HTML5 webpage」という項目にチェックが入っている。他の項目は日本語で表記されているのに、これだけ英語だ。試しにチェックを外してみた。
lenovo A1: Support HTML5 user agent OFF
Mozilla/5.0 (Linux; U; Android 2.3.4; ja-jp; A1_07 Build/GRJ22) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1
期待通りの結果だ。察するところ、iPad用に書かれたオンラインビデオサイトで、「わたしゃiPadだよ」と偽って表示しようとしたのではないだろうか。
最後に、Firefoxでの実行結果はこうなった。設定にヘンなオプションは見当たらない。
lenovo A1: FireFox
Mozilla/5.0 (Android; Mobile; rv:21.0) Gecko/21.0 Firefox/21.0
あ、そういえばデバイス非依存なWebページを作るのを忘れていた。
P.S. User Agent は以下のサイトに詳しく出ていた。
http://www.openspc2.org/userAgent/