Maison > interface Web > Tutoriel H5 > API pour appareils mobiles : nouvelles fonctionnalités HTML5

API pour appareils mobiles : nouvelles fonctionnalités HTML5

黄舟
Libérer: 2017-03-30 11:47:00
original
1965 Les gens l'ont consulté

Afin de mieux servir les appareils mobiles, HTML5 a lancé une série d'API pour les appareils mobiles.

1. API de géolocalisation

GéolocalisationInterface est utilisée pour obtenir la localisation géographique de l'utilisateur. La méthode qu'il utilise est basée sur le GPS ou d'autres mécanismes (tels que l'adresse IP, le hotspot WIFI, etc.).

La méthode suivante permet de vérifier si le navigateur prend en charge cette interface.

if (navigator.geolocation) {    // 支持} else {    //不支持}
Copier après la connexion

1.1 méthode getCurrentPosition

la méthode getCurrentPosition est utilisée pour obtenir la localisation géographique de l'utilisateur. Son utilisation nécessite l'autorisation de l'utilisateur. Le navigateur affichera une boîte de dialogue demandant à l'utilisateur s'il autorise la page actuelle à obtenir sa localisation géographique. La fonction de rappel doit être considérée dans deux situations : l'une consiste à accorder une autorisation et l'autre à refuser l'autorisation. Une erreur sera générée si l'utilisateur refuse l'autorisation.

navigator.geolocation.getCurrentPosition(geoSuccess, geoError);
Copier après la connexion

Le code ci-dessus spécifie deux fonctions de rappel qui gèrent l'emplacement de l'adresse actuelle.

(1) Accepter d'autoriser

Si l'utilisateur accepte d'autoriser, geoSuccess sera appelé.

function geoSuccess(event) {    var coords = event.coords;
    console.log('latitude: ' + coords.latitude);    //纬度
    console.log('longitude: ' + coords.longitude);    //经度
    console.log('accuracy: ' + coords.accuracy);    //精度
    console.log('altitude: ' + coords.altitude);    //海拔
    console.log('altitudeAccuracy: ' + coords.altitudeAccuracy); //海拔精度(单位:米)
    console.log('heading: ' + coords.heading);    //以360度表示的方向
    console.log('speed: ' + coords.speed);    //每秒的速度(单位:米)}
Copier après la connexion

Le paramètre de geoSuccess est un événementobjet. event.coords attribut pointe vers un objet, y compris les informations de localisation de l'utilisateur, principalement les valeurs suivantes :

  • coords.latitude : latitude

  • coords.longitude : Longitude

  • coords.accuracy : Précision

  • coords.altitude : Altitude

  • coords.altitudeAccuracy : Précision de l'altitude en mètres

  • coords.heading : Direction à 360 degrés

  • coords.speed : Vitesse par seconde (unité : mètres)

(2) Autorisation refusée

Si l'utilisateur refuse l'autorisation, geoError sera appelé.

function geoError(event) {
    console.log('Error code ' + event.code + '. ' + event.message);
}
Copier après la connexion

Le paramètre de geoError est également un objet événement. L'attribut event.code représente le type d'erreur et a quatre valeurs :

  • 0 : Erreur inconnue, le navigateur ne demande pas la cause de l'erreur, équivalente à la constanteévénement.UNKNOWN_ERROR .

  • 1 : L'utilisateur refuse l'autorisation, équivalent à l'événement constant.PERMISSION_DENIED

  • 2 : Aucune localisation n'est obtenue, GPS ou autres mécanismes de positionnement Impossible de localiser, équivalent à l'événement constant.POSITION_UNAVAILABLE.

  • 3 : Timeout, le GPS ne renvoie pas le résultat dans le délai spécifié, équivalent à l'événement constant.TIMEOUT.

event.message est le message d'erreur.

(3) Définir le comportement de positionnement

La méthode getCurrentPosition peut également accepter un objet comme troisième paramètre pour définir le comportement de positionnement.

var option = {
    enableHighAccuracy: true,
    timeout: Infinity,
    maximumAge: 0};

navigator.geolocation.getCurrentPosition(geoSuccess, geoError, option);
Copier après la connexion

Cet objet paramètre comporte trois membres :

  • enableHighAccuracy : s'il est défini sur true, le client doit fournir des informations de localisation plus précises, ce qui entraînera Informations de localisation plus précises. Temps de positionnement long et consommation d'énergie plus élevée, le paramètre par défaut est faux.

  • timeout : Le nombre maximum de millisecondes à attendre avant que le client réponde. La valeur par défaut est Infinity.

  • maxinumAge : le nombre maximum de millisecondes qu'un client peut utiliser pour mettre en cache les données. S'il est défini sur 0, le client ne lit pas le cache ; s'il est défini sur l'infini, le client lit uniquement le cache.

1.2 Méthode watchPosition et méthode clearWatch

La méthode watchPosition peut être utilisée pour surveiller les changements continus dans la position de l'utilisateur. La méthode d'utilisation est la même que la méthode getCurrentPosition.

var watchID = navigator.geolocation.watchPosition(geoSuccess, geoError);
Copier après la connexion

La fonction de rappel est appelée une fois que l'emplacement de l'utilisateur change.

Si vous souhaitez annuler la surveillance, utilisez la méthode clearWatch.

navigator.geolocation.clearWatch(watchID);
Copier après la connexion

2. API Vibration

L'interface Vibration est utilisée pour émettre des commandes dans le navigateur pour faire vibrer l'appareil. Cette opération étant très consommatrice d’énergie, il est préférable d’annuler cette opération lorsque la batterie est faible.

Utilisez le code ci-dessous pour vérifier si l'interface est disponible. Actuellement, seules les dernières versions de Chrome et Firefox pour la plateforme Android le prennent en charge.


navigator.vibrate = navigator.vibrate ||
                               navigator.webkitVibrate ||
                               navigator.mozVibrate ||
                               navigator.msVibrate;if (navigator.vibrate) {    // 支持}
Copier après la connexion

La méthode de vibration peut faire vibrer l'appareil, et son paramètre est le nombre de millisecondes que dure la vibration.

navigator.vibrate(1000);
Copier après la connexion

Le code ci-dessus fait vibrer l'appareil pendant 1 seconde. La méthode

vibrate peut également accepter un tableau comme paramètre, représentant le mode de vibration. Les membres du tableau en positions paires représentent le nombre de millisecondes à vibrer, et les membres du tableau en positions impaires représentent le nombre de millisecondes à attendre.

navigator.vibrate([500, 300, 500]);
Copier après la connexion

Le code ci-dessus indique que l'appareil vibre pendant 500 millisecondes, puis attend 300 millisecondes, puis vibre pendant 500 millisecondes.

vibrer est une opération non bloquante, c'est-à-dire que pendant que le téléphone vibre, le code JavaScript continue de s'exécuter vers le bas. Pour arrêter de vibrer, passez simplement 0 milliseconde dans la méthode de vibration.

navigator.vibrate(0);
Copier après la connexion

3、亮度调节

当移动设备的亮度传感器,感知外部亮度发生显著变化时,会触发devicelight事件。目前,只有Firefox布署了这个API。

window.addEventListener('devicelight', function(event) {
    console.log(event.value + 'lux');
})
Copier après la connexion

下面代码表示,devicelight事件的回调函数,接受一个事件对象作为参数。该对象的value属性就是亮度值。

这种API的一种应用是,我们可以针对亮度的强弱来改网页背景和文字颜色。

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal