ユーザーエージェントから電話デバイスかどうか簡易判定するコード

## 追記（2023-06-15）
本記事の内容はやや古くなっています。User Agent文字列のみに頼ったモバイルデバイス判定は将来的に機能しなくなる予定のため、対応した新しい記事を別で書きました。

https://qiita.com/aqril_1132/items/c3be0ef5a72ae6d7c11f


# モバイル判定JavaScriptコード

ブラウザのユーザーエージェント文字列からデバイスが電話かどうか判定するコード
電話系のデバイスのときには`true`、そうでないときには`false`を返す

例えば、androidスマホについては、ユーザーエージェントに`android`,`mobile`の2つの文字列を含むことにより判定している

## コード

```js:
(function(){
  var ua = navigator.userAgent.toLowerCase();
  var sdev = /iphone;|(android|nokia|blackberry|bb10;).+mobile|android.+fennec|opera.+mobi|windows phone|symbianos/; 
  return sdev.test(ua);
})();
```

## コード中の正規表現のレールロードダイアグラム
![image.png](https://qiita-image-store.s3.amazonaws.com/0/103957/69b23e40-9de8-96cd-eb39-8106b1050f22.png)


ブラウザのユーザーエージェント文字列について、たとえば、
「何かの文字列 → `iphone;` → 何かの文字列」
「何かの文字列 → `android` → 何かの文字1文字以上 → `mobile` → 何かの文字列」
「何かの文字列 → `nokia` → 何かの文字1文字以上 → `mobile` → 何かの文字列」


のように表すことができれば`true`が返ってくる。
このとき、ユーザーエージェント情報の大文字小文字は考慮しない。

たとえば、Androidスマートフォン「Galaxy Note 3」のユーザーエージェント文字列は、`Mozilla/5.0 (Linux; U; Android 4.3; en-us; SM-N900T Build/JSS15J) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30`である。

これは、
「何らかの文字列(`Mozilla/5.0 (Linux; U; `) → `Android` → 何らかの文字1文字以上(` 4.3; en-us; SM-N900T Build/JSS15J) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 `) → `Mobile ` → 何らかの文字列(` Safari/534.30`)」と表せる、即ち上記のレールロードダイアグラムに適合できる文字列であるため、この正規表現に合致する。
よってこの関数はGalaxy Note 3のユーザーエージェント文字列に対してtrueを返す。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/103957/2df003ff-8735-b3eb-919c-c5f0d526f804.png)


## 判定について解説
### iPhoneの判定

**iPod**、**iPad**のUAにも`iPhone`の文字列が含まれることがあるため、`iphone;`の文字列によって判定している

```js:iPod_touch
Mozilla/5.0 (iPod touch; CPU iPhone OS 8_1_1 like Mac OS X) AppleWebKit/600.1.4 (KHTML, like Gecko) Version/8.0 Mobile/12B435 Safari/600.1.4
```

```js:iPad
Mozilla/5.0 (iPad; CPU iPhone OS 8_3 like Mac OS X) AppleWebKit/600.1.4 (KHTML, like Gecko) FxiOS/1.0 Mobile/12F69 Safari/600.1.4
```

```js:iPhone
Mozilla/5.0 (iPhone; CPU iPhone OS 9_1 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Version/9.0 Mobile/13B143 Safari/601.1
```

http://www.webapps-online.com/online-tools/user-agent-strings/dv/operatingsystem51849/ios

### アンドロイドスマホの判定
`android`のみだとタブレットを含んでしまうため、`mobile`の文字列があることを同時に確認している

```js:android_Nexus_10(Tablet)
Mozilla/5.0 (Linux; Android 4.3; Nexus 10 Build/JSS15Q) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.81 Safari/537.36
```

```js:android_XPERIA_XZ(Smartphone)
Mozilla/5.0 (Linux; Android 7.0; SO-01J Build/39.2.B.0.244) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.83 Mobile Safari/537.36
```




改善の余地があると思うので、ご指摘頂けると嬉しいですm(_ _)m

**参考**
- [UserAgentからOS/ブラウザなどの調べかたのまとめ - Qiita](http://qiita.com/nightyknite/items/b2590a69f2e0135756dc)
- [userAgent一覧/ユーザーエージェント一覧](http://www.openspc2.org/userAgent/)
- [User-Agent - HTTP | MDN](https://developer.mozilla.org/ja/docs/Web/HTTP/Headers/User-Agent)
- [Gecko ユーザエージェント文字列リファレンス - HTTP | MDN](https://developer.mozilla.org/ja/docs/Web/HTTP/Gecko_user_agent_string_reference)
- [User Agent Strings - WebappsOnline](http://www.webapps-online.com/online-tools/user-agent-strings/dv/)
- [User Agent Strings - Google Chrome](https://developer.chrome.com/multidevice/user-agent)
- [User Agent | Android(TM) 技術情報 | au](http://www3.au.kddi.com/developer/android/kishu/ua/)
- [NTTドコモ 端末・ブラウザスペック](http://spec.nttdocomo.co.jp/spmss/)