web-dev-qa-db-fra.com

Méthode standard de détection des navigateurs mobiles dans une application Web basée sur la requête http

Nous commençons à suivre la voie de la prise en charge par les navigateurs mobiles d’une application Web de commerce électronique d’entreprise (basée sur Java/Servlet). Bien sûr, il y a beaucoup de décisions à prendre, mais il me semble que la pierre angulaire est de pouvoir détecter de manière fiable les navigateurs mobiles et de décider en conséquence du contenu à restituer. Existe-t-il un moyen standard de prendre cette décision (rapidement) en fonction de la requête http et, idéalement, de collecter davantage d'informations sur le navigateur et le périphérique donnés à l'origine de la requête (taille de l'écran, capacités HTML, etc.).

J'apprécierais également toute information supplémentaire qui pourrait être utile de la part de quelqu'un qui s'est engagé dans cette voie en prenant une webapp d'entreprise à grande échelle existante et en architecturant le support des navigateurs mobiles du point de vue du développement.

[edit] Je comprends certainement l'en-tête de la requête et les informations sur une base de données d'agents utilisateurs standard sont d'une grande aide. Pour ceux qui parlent d’autres propriétés d’en-tête de requête, si vous pouviez inclure un nom/ressource normalisé similaire de valeurs, ce serait très utile.

[edit] Plusieurs utilisateurs ont proposé des solutions impliquant un appel filaire à un service Web qui effectuera la détection. Bien que je sois sûr que cela fonctionne, ce n'est pas une bonne solution pour un site de commerce électronique d'entreprise pour deux raisons: 1) la rapidité. Un appel filaire pour chaque demande de page à une tierce partie aurait des conséquences énormes sur les performances. 2) dépendance/légal. Nous associons le temps de réponse de notre site Web et ses fonctionnalités clés à leur service, ce qui est horrible pour des raisons juridiques et de risque.

56
Peter

La méthode standard ne serait-elle pas de vérifier l'agent utilisateur? Voici une base de données d'agents utilisateurs que vous pouvez utiliser pour détecter les navigateurs mobiles.

42
David

La réponse de @ David mentionnait l'utilisation de WURFL - ce qui est probablement votre meilleure option. Soyez prévenu, cependant, le taux de réussite est généralement d'environ 60% (d'après mon expérience personnelle et celle des autres). Avec les opérateurs qui changent constamment d'AU et le nombre de profils d'appareils existants (plus de 60 000?), Il n'y a pas de moyen infaillible d'obtenir toutes les données que vous souhaitez.

Juste un petit avertissement avant de s’appuyer fortement sur une base de données de périphérique. J'essaierais de laisser les options de l'utilisateur ouvertes en leur permettant de modifier les options de session au cas où je me serais trompé.

20
jmccartie

Vous pouvez utiliser Modernizer pour détecter les capacités du navigateur.

8
Adam

Alors que vous pouviez détecter un navigateur mobile via son agent utilisateur, la guerre des navigateurs sur la plate-forme PC a montré que le sniffing des agents utilisateurs n’était pas vraiment une bonne chose à faire.

L’idéal serait d’appliquer des styles spécifiques en fonction du type de média ou d’envoyer une réponse différente en fonction d’un en-tête autre que l’agent utilisateur, tel que l’en-tête Accept qui spécifie le type de contenu que le navigateur préfère. .

Pour le moment, il suffirait peut-être de coder un site fonctionnant avec l'iPhone et Opera avec le renifleur de navigateur - mais Google google va bientôt arriver et il existe de nombreux autres téléphones mobiles qui disposeront d'une fonctionnalité de navigateur proche de celle de l'iPhone et ce serait un gaspillage de développer un site Web mobile qui ne supporterait pas ces appareils aussi bien que possible.

6
VoxPelli

Après des jours de recherche de la bonne façon de détecter un appareil mobile, j'ai décidé de garder les choses simples [stupide] et je mettrai un bouton "Site d'appareil mobile" sur ma page d'index .... il ne vous faudra qu'un clic!!

5
Paul

Détecter les navigateurs mobiles - extraits dans divers langages de programmation.

4
ripper234

Cet article (et son suivi ) semble bien.

4
Milen A. Radev

La configuration Apache légère suivante fait très bien son travail et rappelle les préférences des utilisateurs s’ils préfèrent la version 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>

Plus d'informations sur cette @ http://bemoko.com/training.team/help/team/pc-to-mobile-redirect

3
ian

Je propose un système de détection gratuit basé sur uaprof et un agent utilisateur: http://www.mobilemultimedia.be UAprof devrait être la clé principale de la détection lorsque celle-ci est disponible, car il existe généralement plusieurs agents utilisateurs pour le même uaprof. Si vous souhaitez gérer cela vous-même, vous devriez alors opter pour Wurfl, car vous pouvez télécharger la base de données complète et la gérer localement par vous-même.

2
Klint

Lorsque j’ai eu un besoin similaire récemment, j’ai trouvé ce code qui utilise HTTP_X_WAP_PROFILE, HTTP_ACCEPT et HTTP_USER_AGENT pour identifier un navigateur mobile ou non mobile. C'est PHP mais pourrait être converti assez facilement en tout ce dont vous avez besoin (je l'ai implémenté dans VBScript pour ASP classique). 

Ironiquement, il s’est avéré que je n’avais pas fini par utiliser le code car nous avions décidé de fournir des URL spécifiques aux utilisateurs mobiles et non mobiles, mais cela a certainement fonctionné lorsque je l’ai testé ...

2
Dave DuPlantis

Je ne peux pas le voir affiché ici, mais une autre option sur laquelle je me penche actuellement est www.detectmobilebrowser.com

1
rrrr

Le moyen le plus simple consiste à créer un tableau avec des balises régulières associées aux navigateurs mobiles. Au moins la plupart des agents utilisateurs mobiles doivent disposer du Word mobile, mini, Nokia, Java ME, Android, iPhone, système d'exploitation mobile, etc. . Laissez l'utilisateur à choisir. J'aime le site complet car mon navigateur mobile me donne la même expérience, sauf que je dois zoomer ou faire défiler la plupart du temps.

1
9jabooks

OK, voici une réponse très simple - que diriez-vous de laisser l'utilisateur décider? sur votre connexion à votre ap, fournissez un lien vers le site mobile. sur le site mobile, fournissez un lien "vers le site principal" - essayez www.fazolis.com sur votre appareil mobile - ils y parviennent très bien.

puis, sur le lien vers le site mobile à partir du site du navigateur, enregistrez leur "vote" et leur agent utilisateur. Vous pouvez créer votre propre liste fiable deVOSclients qui veulent le site mobile. Utilisez cette option en fonction de la taille de l'écran de ces appareils mobiles, et vous pouvez créer une assez bonne logique pour une expérience utilisateur satisfaisante. Je ne publierais JAMAIS sur une source réseau pour quelque chose d'aussi élémentaire.

Oh, et sur votre "site mobile" - si vous écrivez votre site correctement, vous devriez pouvoir présenter un seul site à la fois pour le mobile et le navigateur, au lieu de devoir écrire deux ensembles de pages distincts. Juste quelque chose à penser - cela vaut la pensée supplémentaire et l'effort de gagner du temps plus tard.

1
Samuel Fullman

Vous obtiendrez la plupart des informations telles que le navigateur, le périphérique, les langues acceptées, les formats acceptés, etc. depuis l'en-tête de la demande. L'agent d'utilisateur mentionné ci-dessus fait partie de l'en-tête de la demande.

1
Vijesh VP

vous pouvez utiliser les API WURFL pour détecter le type de périphérique

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

ou Modernizer pour détecter les capacités du navigateur

0
Prathamesh Rasam

Le fait est qu’il n’est pas suffisant de s’en remettre à l’agent utilisateur pour détecter les navigateurs mobiles.

Bien sûr, il y a des années, vous pouviez rechercher certaines chaînes et deviner qu'il s'agissait d'un Nokia ou quelque chose du genre, mais maintenant, il y a tellement de téléphones et de nombreux téléphones qui prétendent ne pas être plus sophistiqués.

J'ai trouvé un excellent site sur link text qui est basé sur la même solution que MTV utilise pour tous leurs sites Web mobiles. Il est VRAIMENT bon car il a un langage de balisage indépendant du périphérique, mais plus important encore, ils offrent un appel de service Web pour isMobileDevice ().

Il suffit de regarder dans le manuel puis «comment ça marche».

Je l'utilise pour les sites de mes clients et je n'ai pas encore trouvé de navigateur mobile qu'il ne détecte pas avec précision. Totalement aveuglant!

0
Rich Holdsworth

vous pouvez utiliser un service Web pour détecter la navigation mobile, comme Handsetdetection.com. 

0
don

Vous devrez vérifier la chaîne de l'agent utilisateur avec une liste définie précédemment, comme celle-ci

0
hayalci

Je viens de traverser Détection d'appareils et de fonctionnalités sur le Web mobile avec le contenu suivant:

  1. Utilisation de la détection de périphériques et de fonctionnalités pour améliorer l'expérience utilisateur sur le Web mobile
  2. Introduction à la détection de périphérique
  3. Approches de la conception de sites mobiles
    1. Ne fais rien
    2. Fournir un site mobile générique
    3. Concevoir avec le mobile et l'adaptation à l'esprit
  4. Adaptation du contenu et stratégies de regroupement d’appareils
    1. Regroupement d'appareils
    2. Adaptation du contenu
  5. Minimiser le besoin d'adaptation en premier lieu
  6. Approches courantes de la détection de périphériques
    1. Adaptation côté serveur
    2. Adaptation côté client
    3. Agent utilisateur (UA) côté serveur et recherche d'en-tête
    4. Chaîne UA côté serveur associée à la recherche dans la base de données de périphériques
    5. Détection de profils d'agent utilisateur côté serveur (UAProf)
    6. Détection basée sur la technologie JavaScript
    7. Types de média CSS
    8. Requêtes de médias CSS
  7. Pratiques exemplaires supplémentaires
    1. Redirection + lien manuel
    2. Page de destination + lien manuel
  8. Exemple de page téléchargeable
0
Kevin Hakanson