programing

http 요청을 기반으로 웹 애플리케이션에서 모바일 브라우저를 감지하는 표준 방법

nasanasas 2020. 12. 30. 08:14
반응형

http 요청을 기반으로 웹 애플리케이션에서 모바일 브라우저를 감지하는 표준 방법


엔터프라이즈 전자 상거래 웹앱 (Java / Servlet 기반)을위한 모바일 브라우저 지원의 길을 가고 있습니다. 물론 결정해야 할 사항이 많지만 모바일 브라우저를 안정적으로 감지하고 그에 따라 반환 할 콘텐츠에 대한 결정을 내릴 수있는 것이 초석 인 것 같습니다. http 요청을 기반으로 (빠르게) 이러한 결정을 내리고 이상적으로는 요청을 수행하는 주어진 브라우저 및 장치 (화면 크기, html 기능 등)에 대한 추가 정보를 수집하는 표준 방법이 있습니까?

또한 기존의 대규모 엔터프라이즈 웹앱을 사용하고 개발 측면에서 모바일 브라우저 지원을 설계하는이 길을 걸어온 사람이 제공하는 추가 정보에 감사드립니다.

나는 요청 헤더와 표준 사용자 에이전트의 데이터베이스에 대한 정보를 확실히 이해하고있다. '기타'요청 헤더 속성에 대해 이야기하는 사람들을 위해 유사한 표준화 된 이름 / 값 리소스를 포함 할 수 있다면 큰 도움이 될 것입니다.

몇몇 사용자는 탐지를 수행 할 웹 서비스에 유선을 통한 호출을 포함하는 솔루션을 제안했습니다. 이것이 효과가 있다고 확신하지만, 두 가지 이유로 인해 엔터프라이즈 전자 상거래 사이트에는 좋은 솔루션이 아닙니다. 1) 속도. 제 3 자에 대한 모든 페이지 요청에 대한 유선 호출은 성능에 큰 영향을 미칩니다. 2) 의존성 / 법적. 우리는 웹 사이트 응답 시간과 주요 기능을 서비스에 연결하는데, 이는 법적 및 위험 이유로 끔찍합니다.


표준 방법은 사용자 에이전트를 확인하는 것이 아닐까요? 다음은 모바일 브라우저를 감지하는 데 사용할 수 있는 사용자 에이전트 데이터베이스입니다 .


WURFL을 사용하여 언급 한 @David의 답변-아마도 최선의 선택 일 것입니다. 그러나 성공률은 일반적으로 약 60 % (저와 다른 사람의 경험)입니다. 통신 업체가 UA를 지속적으로 변경하고 존재하는 장치 프로필의 양 (60,000 개 이상?)을 사용하면 원하는 모든 데이터를 얻을 수있는 완벽한 방법이 없습니다.

장치 DB에 크게 의존하기 전에 약간의 경고가 있습니다. 내가 잘못 추측 한 경우 세션 옵션을 변경할 수 있도록 허용하여 사용자 옵션을 열어 두려고합니다.


Modernizer사용 하여 브라우저 기능을 감지 할 수 있습니다.


사용자 에이전트를 통해 모바일 브라우저를 감지 할 수 있지만 PC 플랫폼에서의 브라우저 전쟁은 사용자 에이전트를 스니핑하는 것이 실제로 그렇게 좋은 일이 아니라는 것을 보여주었습니다.

이상적으로는 미디어 유형에 따라 특정 스타일을 적용하거나 브라우저가 선호하는 콘텐츠 종류를 알려주는 Accept-header와 같이 사용자 에이전트가 아닌 헤더를 기반으로 다른 답변을 보내야합니다. .

지금 당장은 브라우저 스니핑을 통해 iPhone 및 Opera와 함께 작동하는 사이트를 코딩하는 것으로 충분할 수 있습니다. 그러나 Google의 Android가 곧 출시 될 예정이며 가까운 장래에 iPhone과 유사한 브라우저 기능을 갖춘 다른 휴대폰이 많이 있습니다. 그런 장치를 처음부터 지원하지 않는 모바일 웹 사이트를 개발하는 것은 낭비 일 것입니다.


모바일 장치를 감지하는 올바른 방법을 며칠간 검색 한 후 저는 간단하게 유지하기로 결정했고 [멍청한] 색인 페이지에 '모바일 장치 사이트'버튼을 추가하겠습니다 .... 클릭 한 번이면됩니다 !!


이 기사 (및 후속 기사 )는 멋져 보입니다.


모바일 브라우저 감지 -다양한 프로그래밍 언어로 된 스 니펫.


다음의 가벼운 Apache 구성은 꽤 잘 작동하며 PC 버전을 선호하는 경우 사용자 선호도를 기억합니다.

<VirtualHost (your-address-binding)>   

  (your-virtual-host-configuration)       

  RewriteEngine On     
  RewriteCond %{QUERY_STRING} !ui=pc
  RewriteCond %{HTTP_COOKIE} !ui=pc
  RewriteCond %{HTTP_USER_AGENT} "^.*(iphone|ipod|ipad|android|symbian|nokia|blackberry| rim |opera mini|opera mobi|windows ce|windows phone|up\.browser|netfront|palm-|palm os|pre\/|palmsource|avantogo|webos|hiptop|iris|kddi|kindle|lg-|lge|mot-|motorola|nintendo ds|nitro|playstation portable|samsung|sanyo|sprint|sonyericsson|symbian).*$" [NC,OR]

  RewriteCond %{HTTP_USER_AGENT} "^(alcatel|audiovox|bird|coral|cricket|docomo|edl|huawei|htc|gt-|lava|lct|lg|lynx|mobile|lenovo|maui|micromax|mot|myphone|nec|nexian|nook|pantech|pg|polaris|ppc|sch|sec|spice|tianyu|ustarcom|utstarcom|videocon|vodafone|winwap|zte).*$" [NC] 

  RewriteRule /(.*) http://bemoko.com/$1 [L]

  RewriteCond %{QUERY_STRING} "ui=pc"
  RewriteRule ^/ - [CO=ui:pc:(your-cookie-domain):86400:/]
  RewriteCond %{QUERY_STRING} "ui=default"
  RewriteRule ^/ - [CO=ui:default:(your-cookie-domain):86400:/]
</VirtualHost>

이 @ http://bemoko.com/training.team/help/team/pc-to-mobile-redirect 에 대한 더 많은 배경


uaprof와 사용자 에이전트를 기반으로하는 무료 탐지 시스템을 제안합니다. http://www.mobilemultimedia.be UAprof는 일반적으로 동일한 uaprof에 대해 여러 사용자 에이전트가 있으므로 사용할 수있을 때 탐지를위한 기본 키가되어야합니다. 이를 직접 관리하려면 전체 데이터베이스를 다운로드하고 직접 로컬에서 관리 할 수 ​​있으므로 Wurfl을 선택해야합니다.


내가 최근에 비슷한 필요가 있었을 때, 나는 발견 이 코드 가 사용하는 것을 HTTP_X_WAP_PROFILE, HTTP_ACCEPT그리고 HTTP_USER_AGENT모바일 또는 비 모바일로 브라우저를 식별 할 수 있습니다. 그것은 PHP이지만 당신이 필요로하는 것으로 상당히 쉽게 변환 될 수 있습니다 (나는 고전적인 ASP를 위해 VBScript로 구현했습니다).

아이러니하게도 모바일 및 비 모바일 사용자를위한 특정 URL을 제공하기로 결정했기 때문에 코드를 사용하지 않은 것으로 밝혀졌지만 테스트 할 때는 확실히 작동했습니다.


요청 헤더에서 브라우저, 장치, 허용 언어, ​​허용 형식 등과 같은 대부분의 정보를 얻을 수 있습니다. 위에서 언급 한 사용자 에이전트는 요청 헤더의 일부입니다.


좋아요, 여기에 아주 간단한 대답이 있습니다. 사용자가 결정하게하는 것은 어떻습니까? AP에 로그인 할 때 모바일 사이트에 대한 링크를 제공하십시오. 모바일 사이트에서 "메인 사이트로 돌아 가기"링크를 제공하십시오. 모바일 장치에서 www.fazolis.com을 시도해보십시오.

그런 다음 브라우저 사이트의 모바일 사이트 링크에서 "투표"와 사용자 에이전트를 등록합니다. 당신은 당신의 자신의 신뢰할 수있는 목록을 구축 할 수 있습니다 귀하의 모바일 사이트를 원하는 고객을. 이러한 모바일 장치의 화면 크기 사양과 결합하여이를 사용하면 만족스러운 사용자 경험을위한 꽤 좋은 로직을 구축 할 수 있습니다. 나는 이것과 같은 기본적인 것을 네트워크 소스에 게시하지 않을 것입니다.

아 그리고 "모바일 사이트"에서-의미 론적으로 잘 작성하면 두 개의 개별 페이지 세트를 작성해야하는 대신 모바일과 브라우저 모두에 대해 단일 사이트를 제공 할 수 있어야합니다. 생각할만한 것-이것은 나중에 시간을 절약하기 위해 추가로 생각하고 노력할 가치가 있습니다.


여기에 게시 된 것을 볼 수 없지만 현재 살펴보고있는 또 다른 옵션은 www.detectmobilebrowser.com입니다.


가장 쉬운 방법은 모바일 브라우저와 관련된 일반 태그로 배열을 만드는 것입니다. 최소한 대부분의 모바일 사용자 에이전트에는 mobile, mini, nokia, java ME, android, iphone, mobile OS 등이 있어야합니다. 사용자 에이전트와 일치하는 단어가있는 경우 php strpos를 사용하여 페이지 상단에 모바일 버튼을 인쇄합니다. . 사용자가 선택하도록 두십시오. 나는 대부분의 시간을 확대 / 축소하거나 스크롤해야한다는 점을 제외하고는 모바일 브라우저가 동일한 경험을 제공하기 때문에 전체 사이트를 좋아합니다.


당신은 이전에 정의 된 목록을 사용자 에이전트 문자열을 확인해야합니다 이와 같은


웹 서비스를 사용하여 handsetdetection.com과 같은 모바일 검색을 감지 할 수 있습니다.


The fact is that just relying on the useragent is not good enough to detect mobile browsers.

Sure, years ago you could search it for certain strings and guess that it was a Nokia or something, but now there are so many phones out there, and so many that pretend to be things that they are not that something more sophisticated is needed.

I found a great site at link textwhich is based on the same solution that MTV use for all their mobile web sites. It is REALLY good as it has a device independent markup language but more importantly they offer a webservice call for isMobileDevice().

Just look in the manual then 'how it works'.

I've been using it for my customers sites and have yet to find a mobile browser that it doesn't detect accurately. Totally blinding!


Just ran across Device and feature detection on the mobile web with these contents:

  1. Using device and feature detection to improve user experience on the mobile web
  2. Introduction to device detection
  3. Approaches to mobile site design
    1. Do nothing
    2. Providing a generic mobile site
    3. Designing with mobile and adaptation in mind
  4. Content adaptation and device grouping strategies
    1. Device grouping
    2. Content adaptation
  5. Minimising the need for adaptation in the first place
  6. Common approaches to device detection
    1. Server side adaptation
    2. Client-side adaptation
    3. Server-side User Agent (UA) and header lookup
    4. Server-side UA string combined with device database lookup
    5. Server-side User Agent Profiles (UAProf) detection
    6. Detection based on JavaScript technology
    7. CSS media types
    8. CSS media queries
  7. Additional best practices
    1. Redirection + manual link
    2. Landing page + manual link
  8. Downloadable sample page

you can use WURFL APIs to detect device type

http://wurfl.sourceforge.net/wurfl_schema.php

or Modernizer to detect browser abilities

ReferenceURL : https://stackoverflow.com/questions/142273/standard-way-to-detect-mobile-browsers-in-a-web-application-based-on-the-http-re

반응형