자바 스크립트 브라우저 감지?

Question

현재 프로젝트의 터치 장치에 대해 특정 종류의 지원을 추가해야합니다. 이런 식으로해야만하는 것은 이번이 처음인데, 나는 그들이 잘하는 웹 사이트의 코드를 살펴 보았습니다.

한 페이지는 다음과 같이 수행합니다

if(document.querySelectorAll && (navigator.platform == "iPad" || navigator.platform.substring(0, 6) == "iPhone" || navigator.platform == "iPod" || navigator.userAgent.indexOf('Android') > -1)) {...}

가 내가 손에있는 모든 장치에 테스트를하고 그것을 작동하지만, 제발 말해, 그것은이 방법을 수행하는 괜찮아? 그것을 할 수있는 "올바른"방법이 있습니까?

내가 묻는 이유는 브라우저 검색을 피하고 대신 객체 감지를 사용해야한다는 것입니다. 이제 나는 그들이 또한 객체 감지 인 document.querySelectorAll을 테스트하고 있다는 것을 알았습니다. 그래서 그것은 아마도 안전망의 일종 일 것입니다.

Answer 1

사용하는 코드는 매우 유용합니다. 처음에는 간단한 문자 삽입으로 인해 실패하게됩니다.

당신은

if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|Mini/i.test(navigator.userAgent)) { ... 

처럼 뭔가를 대체 할 수하지만 당신은 그들이 하나가 무엇을 생각하는 것이 더 다양 할 수와 같은 장치를 감지하는 것은 위험하다 알고 있어야합니다 일부는 몇 가지보다 더 나은 CPU, 네트워크 액세스 또는 화면이 데스크톱 브라우저. 따라서 대부분의 경우 필요한 기능을 감지하는 것이 좋습니다.

사용 가능한 장치에 따라 사이트를 유지 관리하려는 경우이 검색은 합리적으로 내 생각에 터치 스크린을 감지하는 데 사용할 수 있습니다 (예 : Modernizr 또는 specific tests과 같은 라이브러리).

Answer 2

브라우저 검색은 피해야합니다. 브라우저가 변경 될 수 있기 때문입니다.

오늘 Google은 기능을 지원하지 않을 수 있습니다. 그러나 내일 Chrome을 업데이트하고 지원해야합니다.

따라서 Chrome을 업데이트 한 날인 if (!isGoogleChrome())과 같은 작업을하면 코드를 업데이트해야합니다.

개체 검색을 수행해야합니다. 당신이 함수/객체가 여기에 있는지 확인하려면 예를 들어, 그냥 테스트 :

if (document.querySelectorAll !== undefined) { 
    //... 
} 

또한 사용할 수 http://modernizr.com/

, 그것은 현재 브라우저가 당신을 위해 기능을 감지 할 수 있습니다.