[JS]자바스크립트로 user agent를 통해 모바일 인식하기

대부분의 사이트에서 모바일 환경을 인식하기 위해 user agent 정보를 활용합니다.

User agent란 원래 사용자를 대신하는 소프트웨어입니다.

Http에서는 user agent header를 통해 사용자의 환경을 인식하게합니다.

예를들어 스마트폰에서 티스토리 링크를 클릭하면 ~~tistory.com/m/ 으로 시작하는 모바일웹 사이트로 Redirect됩니다.

티스토리서버가 사용자의 user agent정보를 읽어서 모바일환경임을 인식하면 모바일웹으로 이동시키게 되는 것이죠.

아래에 현재 당신의 User agent정보가 나타날 것입니다.

.

UserAgent를 통한 모바일 인식 자바스크립트

if(navigator.userAgent.match(/Mobile|iP(hone|od)|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/)){

  //스마트폰일 때 실행 될 스크립트

}

User agent에는 사용자 기기에대한 정보도 들어있기 때문에, 모바일환경을 인식할 수 있습니다.

위의 코드를 사용하면 태블릿을 제외한 스마트폰에서만 스크립트를 실행할 수 있습니다.

if(navigator.userAgent.match(/Android|Mobile|iP(hone|od|ad)|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/)){

  //모바일(스마트폰+태블릿)일 때 실행 될 스크립트

}

이 코드는 안드로이드 태블릿과 아이패드 정보가 추가된 스크립트입니다.

만일 모바일을 제외한 PC에서만 실행할 스크립트는 다음처럼 작성하면 됩니다.

if(!navigator.userAgent.match(/Mobile|iP(hone|od)|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/)){

  //태블릿,PC에서만 실행 될 스크립트

}

if(!navigator.userAgent.match(/Android|Mobile|iP(hone|od|ad)|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/)){

  //PC에서만 실행 될 스크립트

}