🃏

モバイル判定ライブラリ ismobilejs

2024/09/21に公開

what is ismobilejs?

モバイルかどうかをbooleanを返却する形で判定してくれるライブラリ。
https://www.npmjs.com/package/ismobilejs

developer toolでは、iPad辺りの判定が現状上手くできていない。

今自分が参画しているPJでは、Next.jsにおいてモバイルかどうかを判定するためにismobilejsを使用しているのだが、Chrome等の検証ツールで動作を確認してみると、iPad Air, iPad Proではモバイルであるにも関わらずfalse(モバイルではない判定)を返してくる。しかしiPad MiniではTrueを返す。(モバイル判定)

ismobilejsの中身を少し見てみると、当然横幅のサイズ等での判定ロジックではなく、userAgentを見に行っているようだった。(というかサイズ判定だと、タブレットサイズのPC等もモバイル判定されてしまう。)
https://github.com/kaimallea/isMobile

実機で確認をしてみないとあれだが、自分はブラウザの検証ツールでは上手く判定できないのだと予想している。

(24/09/23 iPad Airにて、モバイル判定となることを確認。やはりブラウザの検証ツール等では上手く動作しない模様。)

ismobilejsの使用用途

使用用途としては、モバイルブラウザとPCブラウザでロジックを分けたいsituationの時に使用するのが基本だろう。

例えばUI上にファイルのDLボタンが存在し、モバイルブラウザではファイルをDLさせたくないが、PCブラウザでのみのDLさせるという仕様を実現したいときはこのライブラリを使用すべきだろう。
モバイルブラウザとPCブラウザでロジックを分けたい時に、横幅サイズ等で判定させてしまうと、上で述べたようにタブレットサイズのPCがモバイル判定されてしまったり、ユーザーがブラウザの幅を変化させたり、検証ツールを使用したりしてわりかしまずいことが予想される。

横幅サイズでの判定は、レイアウトパターンをレスポンシブデザインとして実現したいときに使用すべきだと思います。(ロジック判定には使用してはいけない。)

Discussion