Web production note

 【更新日 :

【JavaScript】ユーザーエージェントによる端末判別

Category:
JavaScript

ユーザーエージェントによる各端末判別のサンプルコードです。

var device = navigator.userAgent;
if (device.indexOf('iPhone') > 0 || device.indexOf('iPod') > 0) {
	//iPone iPod touch
} else if ( device.indexOf('iPad') > 0 ) {
	//iPad
} else if (device.indexOf('Android') > 0 && window.matchMedia('(min-width:641px)').matches) {
	//Android タブレット(641px以上)
} else if(device.indexOf('Android') > 0 && window.matchMedia('(max-width:640px)').matches){
	//Android スマホ(640px以下)
} else {
	//PC
}

完璧に振り分けられるのかは未検証ですが、iPone、iPad、Androidのタブレット、Androidのスマホの振り分けサンプルです。
Androidのタブレットかスマホの判別は画面サイズで判別しています。

PCか端末かの判別例

var userAgent = window.navigator.userAgent.toLowerCase();
var device = navigator.userAgent;
if (
	device.indexOf('Android') > 0
	|| device.indexOf('iPhone') > 0
	|| device.indexOf('iPod') > 0
	|| device.indexOf('iPad') > 0
	|| device.indexOf('Windows Phone') > 0
	|| device.indexOf('Windows Touch') > 0
	|| device.indexOf('Mobile') > 0
	|| device.indexOf('Tablet') > 0
	|| device.indexOf('BlackBerry') > 0
) {
// モバイルOSの場合
	console.log('mobile');
} else {
//PCの場合
	console.log('pc');
}

参考リンク