Here is a few ways to check if user is browsering from a mobile browser.
1. Check userAgent
(not recomended)
const isMobile = /Android|BlackBerry|iPad|iPod|iPhone|webOS/i.test(navigator.userAgent);
I don't recommend this approach because the server can send a fake user agent.
2. Use feature detection
Check if the browser supports the pointer:coarse
media query:
const isMobile = function () {
const match = window.matchMedia('(pointer:coarse)');
return match && match.matches;
};
We can't rely on the screen size because the mobile devices are getting bigger.
See also