如果你是一個SitePoint的老讀者并且是我的粉絲的話,那么你已經知道我寫了很多關于HTML5以及JS API的文章。到目前為止,我已經發布了一些介紹你現在就可以馬上使用的API,盡管可能會用到polyfill的方式。(譯注:不知道什么是polyfill請點擊這里。)
但是今天我可能要打破這個常規來給大家介紹一些仍然還處在初期階段的API。大家必須知道這些API是非常新的,在這三個里面有兩個都是在幾天之前剛剛發布的。正因如此,這些API現目前都還無法使用。但是如果你有興趣了解它們具體是用來做什么的,你可以繼續閱讀下面關于它們的詳細介紹,同時也歡迎留下你的看法和回應。
廢話不多說,現在開始!
Web Alarms API
Web Alarms API讓你可以配置設備的鬧鈴設置,從而能夠安排通知消息或讓某個特定的應用在指定的時間點啟動。這個API最典型的用法會涉及到像鬧鐘,日歷,或其他任何需要在特定時間進行特定操作的程序。
自從去年開始,這個API剛剛成為了一個W3C的設計草案。因此所有有待成為W3C官方推薦的相關細節都還在初期階段。這個API需要通過window.navigator對象下的alarms屬性來使用。alarms屬性會提供三個函數:
- getAll():?從設備獲取全部已有的鬧鈴并以包含Alarm對象的數組形式返回。
- add():?注冊一個基于Date對象的鬧鈴并返回一個AlarmRequest對象。
- remove():?通過唯一ID移除一個之前注冊的鬧鈴(唯一性僅針對應用本身)
為了向大家演示理想情況下這些函數應當如何使用,這里有一個添加鬧鈴的例子(請記住現目前任何瀏覽器都不支持這段代碼)
var alarmId; var request = navigator.alarms.add( new Date("June 29, 2012 07:30:00"), "respectTimezone", ); request.onsuccess = function (e) { alarmId = e.target.result; }; request.onerror = function (e) { alert(e.target.error.name); };
然后,如果你想要移除之前添加的鬧鈴,可以這樣寫:
var request = navigator.alarms.remove(alarmId); request.onsuccess = function (e) { alert("alarm removed"); }; request.onerror = function (e) { alert(e.target.error.name); };
如果你想要了解更多關于Web Alarms API,請參閱相關細節文檔。
Presentation API
Presentation API的目標就是讓投影儀或TV這樣的第二顯示設備能夠被Web使用,包括所有通過有線(HDMI,DVI等)連接以及通過無線(MiraCast, Chromecast, DLNA, AirPlay等)的設備。這個API所做的就是在請求頁面與第二顯示設備上的演示頁面之間實現消息互通。
請注意該API細節并不屬于W3C標準,也不在W3C標準計劃當中。這個API需要通過window.navigator對象下的presentation屬性來使用。該屬性提供了一個叫requestSession()函數,以及present和availablechange兩個事件。requestSession()函數可以用來啟動或恢復第二顯示設備上的演示。它會返回一個session對象指代當前的演示。當通過requestSession()傳入的url里面的演示內容被加載完成后,演示屏幕的頁面會收到present事件。最后,在第一張演示出現后或者最后一張演示完成后會發出availablechange事件。
舉個例子,來自細節文檔,該API的用法如下所示:
<button disabled>Show</button> <script> var presentation = navigator.presentation, showButton = document.querySelector('button'); presentation.onavailablechange = function(e) { showButton.disabled = !e.available; showButton.onclick = show; }; function show() { var session = presentation.requestSession('http://example.org/'); session.onstatechange = function() { switch (session.state) { case 'connected': session.postMessage(/*...*/); session.onmessage = function() { /*...*/ }; break; case 'disconnected': console.log('Disconnected.'); break; } }; } </script>
如果你想要了解更多關于Presentation API的消息,可以看看最終報告。
Standby API
Standby API讓你可以在頂層瀏覽器頁面中請求屏幕持續顯示鎖。這可以防止設備進入省電狀態(例如屏幕自動關閉)。這個功能對有些web應用來說至關重要。例如,想像一下你正在駕車并在手機上使用基于web的導航軟件(非本地應用)。如果你不去觸碰屏幕的話,你的手機的屏幕會自動關閉,除非你事前在手機上進行過相關的設置。在這樣的情況下,通常你是想要讓屏幕保持顯示狀態的。這恰恰是這個API適用的地方。
這個API需要通過window.navigator對象下的wakeLock屬性來使用。它會提供兩個函數:
- request(): 使當前應用能讓屏幕保持顯示狀態。
- release():?釋放持續顯示鎖,這樣屏幕就不會再被強制要求顯示。
這兩個函數都只接受一個參數,其只能是“screen”或“system”。前者表示操作針對的是設備屏幕,而后者針對的是除屏幕之外如CPU或廣播之類的其他設備資源。
以下例子會演示如何適用該API讓設備屏幕保持顯示狀態:
navigator.wakeLock.request("display").then( function successFunction() { // do something }, function errorFunction() { // do something else } );
要讓設備允許屏幕關閉,我們可以用以下方法:
navigator.wakeLock.release("display");
如果你想要了解關于Standby API的更多信息,可以參考這個非官方草案。
總結
在這篇文章里我給大家介紹了一些嶄新的JS API。我要再次強調因為它們都還處在非常早期的階段,所以目前沒有瀏覽器支持。因此我們也沒法實際地操作它們。然而正因為它們如此之新大家現在都有機會跟進它們接下來的發展甚至參與幫助它們的細節設計的完善。
Web開發的未來一片光明,加入進來吧!