HTML5新特性之行動裝置API

為了更好地為行動裝置服務，HTML5推出了一系列針對行動裝置的API。

1、Geolocation API

Geolocation介面用於取得使用者的地理位置。它使用的方法是基於GPS或其他機制（如IP位址、WIFI熱點等）。

下面的方法，可以檢查瀏覽器是否支援這個介面。

if (navigator.geolocation) {    // 支持} else {    //不支持}

1.1 getCurrentPosition方法

getCurrentPosition方法，用來取得使用者的地理位置。使用它需要得到使用者的授權，瀏覽器會跳出一個對話框，詢問使用者是否許可當前頁面取得他的地理位置。必須考慮兩種情況的回呼函數：一種是同意授權，另一種是拒絕授權。如果使用者拒絕授權會拋出一個錯誤。

navigator.geolocation.getCurrentPosition(geoSuccess, geoError);

上面程式碼指定了處理目前位址位置的兩個回呼函數。

（1）同意授權

如果使用者同意授權，就會呼叫geoSuccess。

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);    //每秒的速度（单位：米）}

geoSuccess的參數是一個event物件。 event.coords屬性指向一個對象，包含了使用者的位置訊息，主要是以下幾個值：

• coords.latitude：緯度

• #coords.longitude：經度

• coords.accuracy：精確度

• ##coords.altitude：海拔

• coords.altitudeAccuracy：海拔精度（單位：米）

• coords.heading：以360度表示的方向

• #coords.speed：每秒的速度（單位：公尺）

• （2）拒絕授權
• 如果使用者拒絕授權，就會呼叫geoError。

  function geoError(event) {
      console.log('Error code ' + event.code + '. ' + event.message);
  }

  geoError的參數也是一個event物件。 event.code屬性表示錯誤類型，有四個值：

0：未知錯誤，瀏覽器沒有提示出錯的原因，相當於

常數

event.UNKNOWN_ERROR 。

1：使用者拒絕授權，相當於常數event.PERMISSION_DENIED

• 2：沒有得到位置，GPS或其他定位機制無法定位，相當於常數event.POSITION_UNAVAILABLE。

• 3：逾時，GPS沒有在指定時間內傳回結果，相當於常數event.TIMEOUT。

• event.message為錯誤提示訊息。

  （3）設定定位行為

getCurrentPosition方法也可以接受一個物件作為第三個參數，用來設定定位行為。

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

navigator.geolocation.getCurrentPosition(geoSuccess, geoError, option);

這個參數物件有三個成員：

enableHighAccuracy：如果設為true，就要求客戶端提供更精確的位置信息，這會導致更長的定位時間和更大的耗電，預設為false。

timeout：等待客戶端回應的最大毫秒數，預設值為Infinity（無限）。

maxinumAge：客戶端可以使用

快取資料
的最大毫秒數。如果設為0，客戶端不讀取快取；如果設為infinity，客戶端只會讀取快取。

1.2 watchPosition方法和clearWatch方法

watchPosition方法可以用來監聽使用者位置的持續改變，使用方法與getCurrentPosition方法一樣。

var watchID = navigator.geolocation.watchPosition(geoSuccess, geoError);

一旦使用者位置改變，就會呼叫回呼函數。

如果要取消監聽，則使用clearWatch方法。

navigator.geolocation.clearWatch(watchID);

2、Vibration APIVibration介面用於在瀏覽器中發出指令，使得裝置振動。由於此操作很耗電，在低電量時最好取消此操作。

###使用下面的程式碼檢查該介面是否可用。目前，只有Chrome和Firefox的Android平台最新版本支援它。 ############

navigator.vibrate = navigator.vibrate ||
                               navigator.webkitVibrate ||
                               navigator.mozVibrate ||
                               navigator.msVibrate;if (navigator.vibrate) {    // 支持}

###vibrate方法可以使得裝置振動，它的參數就是振動持續的毫秒數。 ###

navigator.vibrate(1000);

###上面的程式碼使得裝置震動1秒鐘。 ######vibrate方法也可以接受一個###陣列###作為參數，表示振動的模式。偶數位置的陣列成員表示振動的毫秒數，奇數位置的陣列成員表示等待的毫秒數。 ###

navigator.vibrate([500, 300, 500]);

###上面程式碼表示，裝置先震動500毫秒，然後等待300毫秒，再接著震動500毫秒。 ######vibrate是一個非阻塞式的操作，也就是手機震動的同時，###JavaScript###程式碼繼續往下運作。要停止振動，只有將0毫秒傳入vibrate方法。 ###

navigator.vibrate(0);

3、亮度调节

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

window.addEventListener('devicelight', function(event) {
    console.log(event.value + 'lux');
})

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

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

以上是HTML5新特性之行動裝置API的詳細內容。更多資訊請關注PHP中文網其他相關文章！