자바스크립트(JS) 브라우저를 통한 PC/Mobile 구분

클라이언트단에서 PC와 모바일 여부에 따라 다른 스크립트 함수를 실행시켜야 해서 찾던 중 추후 작업에 용이 할 것 같아 기록 함

브라우저의 navigator 객체 사용.

검색되는 코드들을 살펴보니, platform정보로 쉽게 구분이 가능한데

web돌이는 원활한 테스트와 개발을 위해 userAgent 정보를 사용햇다.

navigator 객체에 대한 설명은 아래 url에서 자세히 확인가능하며, 브라우저, 운영체제별 제공하는 정보가 다를 수 있으니, 유의해서 사용해야하고.

공통적으로 제공하는 정보만 사용할것을 권장 함.

https://developer.mozilla.org/ko/docs/Web/API/Navigator

https://www.w3schools.com/jsref/obj_navigator.asp

아래 코드들을 가공하면, 특정 브라우저를 확인하는 등의 작업도 쉽게 가능 함

---

1. OS
   navigator.platform 정보를 이용한 구분법이다.
   navigator.platform 정보는 브라우저가 동작하고 있는 OS 정보를 return한다. 

function chk_mobile() {
    var filter = "win16|win32|win64|mac|macintel";
    if (navigator.platform) {
        if (filter.indexOf(navigator.platform.toLowerCase()) < 0) {
            return true;
        } else {
            return false;
        }
    }
}

 

2. userAgent
   navigator.userAgent 정보를 이용한 구분법이다.
   userAgent 정보는 서버측에 보내는 user-agent 헤더정보를 갖고 있다.

function chk_mobile() {
    return /iPhone|iPad|iPod|Android|Mobile|IEMobile|BlackBerry|Windows Phone/i.test(navigator.userAgent);
}

---