行業動態

您現在的位置:網站首頁 >> 行業動態>> HTML5移動web應用程序開發步驟闡述

目前互聯網的發展正處在歷史性的轉折點,移動平臺和應用正在逐漸超越固定的客戶端/服務器模式。隨著4G甚至5G/LTE技術的商用化和智能移動終端的大規模應用,移動互聯網正處于迅猛發展當中。而移動應用作為移動互聯網的主角,對最終用戶、網絡運營商、應用開發商、平臺提供商、投資商都有巨大影響,是推動未來移動互聯網發展的主要力量。

為支持豐富多樣的互聯網應用,國際標準組織W3C于2007年成立新的HTML工作團隊,2008年發布了HTML5的第一份草案。基于HTML5系列標準的應用憑借其良好的跨平臺性,能很好地解決目前Native操作系統割裂的問題,將為移動互聯網產業鏈帶來全新的商業模式,為產業鏈各方帶來全新的平等競爭機會,引導移動互聯網產業鏈的新模式發展。將HTML5的技術優勢廣泛地運用于移動互聯網中,基于HTML5的跨平臺特性,面向越來越豐富的智能終端提供移動Web應用,是加速HTML5應用成熟、引導互聯網應用產業良性發展的捷徑。

1、HTML5應用技術

HTML5應用技術指面向HTML5應用開發的主要關鍵技術,包括Offline Application技術、Sever-sentEvents技術、Websocket技術、Web Workers技術、HTML5視頻和音頻技術以及Device API技術。下文將對上述關鍵技術進行簡單的介紹與分析。


     (1)Offline Application,即離線應用。

在開發支持離線的Web應用程序時,要使用以下三個方面的功能。
①離線資源緩存。需要一種方式來指明應用程序離線工作時所需的資源文件。這樣,瀏覽器才能在在線狀態時,把這些文件緩存到本地。此后,當用戶離線訪問應用程序時,這些資源文件會自動加載,從而讓用戶正常使用。HTML5中,通過Cache Manifest文件指明需要緩存的資源,并支持自動和手動兩種緩存更新方式。

②在線狀態檢測。開發者需要知道瀏覽器是否在線,這樣才能夠針對在線或離線的狀態,做出對應的處理。在HTML5中,提供了兩種檢測當前網絡是否在線的方式。

③本地數據存儲。離線時需要把數據存儲到本地,以便在線時同步到服務器上。為了滿足不同的存儲需求,HTML5提供了DOM Storage和Web SQL Database兩種存儲機制。在應用中可以考慮將用戶的一些數據存儲在本地,供離線模式下應用。

(2)Sever-sent Events,即服務器推送技術。

客戶端使用EventSource對象實現。服務端也有相應的要求,表現在如下兩方面:一是要求網頁的MIME類型為text/event-stream,這個MIME類型定義了事件框架格式,二是text/event-stream有一定的格式。主要內容是根據需要在應用中向用戶推送通知等信息。

(3)Websocket,也叫套接字技術。

當存在和服務器頻繁數據交流的時候,就有了如何進行通信的問題。正常情況下,瀏覽器訪問Web頁面時,一般會向頁面所在的Web服務器發送一個HTTP請求;Web服務器識別請求,然后返回響應。大多數情況下,當內容呈現在瀏覽器頁面上時,可能已經沒有時效性。如果用戶想要獲得最新的實時信息,就需要不斷地手動刷新頁面,這顯然不是一個明智的做法。目前實時Web應用的實現
方式,大部分是圍繞輪詢和其他服務器端推送技術展開的,包括輪詢、長連接、流解決等方案。

(4)Web Workers技術。

可以讓一部分JavaScript程序代碼運行在客戶端操作系統的線程中,而非瀏覽器的線程中,從而可以實現多線程。Web Workers在JavaScript代碼執行復雜運算的過程中起到優化效果。每一個運行在客戶端操作系統線程中(非瀏覽器線程)的JavaScript程序代碼被稱為一個Worker,分為專職Worker和共享Worker兩種。

(5)HTML5視頻和音頻。

在HTML5網頁中不再需要插件播放音頻或視頻多媒體文件,只需要加入video和audio標簽并使用JavaScript代碼開發操作面板,即可實現在網頁靈活播放多媒體,同時可以結合Canvas技術增加對多媒體文件的效果與控制操作。

(6) Device API。

HTML5異軍突起,在Web應用中表現突出,通過調用終端本地上的軟硬件(比如攝像頭、話筒、GPS、各種傳感器等)在移動設備上的WebApp能與Native App相媲美。但是這需要一套統一完善的API,Device API工作組就針對HTML5制定了一套API,主要包括以下幾點。

①The Media Capture API和HTML Media CaptureAPI都是針對攝像頭和話筒硬件,前者是對攝像頭和話筒的可編程訪問,后者是通過HTML表單交互來調用攝像頭和話筒。
②Device Orientation Event提供了對設備物理方向和運動信息的事件處理,主要關注運動和方位傳感器,它并不提供對基本傳感器數據的訪問或者對傳感器的控制,而是高層次的封裝。

③Sensor API提供所有已知傳感器的訪問,并且提供的是原始的傳感器數據。

④HTML5 Geolocation API用于將用戶當前地理位置信息共享給信任的站點,但這會涉及用戶的隱私安全問題,所以當一個站點需要獲取用戶的當前地理位
置,瀏覽器會提示用戶是“允許”還是“拒絕”。獲取地理位置在應用中將會得到非常廣泛的使用。

綜上所述,HTML5是近十年來Web開發標準中最巨大的飛躍,和以前的版本不同,HTML5并非僅僅用來表示Web內容,它的新使命是將Web帶入一個成熟的應用平臺在基于HTML5的移動應用開發中廣泛使用上述關鍵技術,才能實現移動Web應用達到和Native應用相似的用戶體驗。

 2、HTML5應用開發平臺

對于移動互聯網應用而言,產業生態環境的主要關注點是開發環境和應用發布;前者是為開發者提供API,后者則使得開發者通過應用商店發布應用。生態環境的控制本質就是平臺的控制,平臺決定API。在Native APP中,平臺由智能終端操作系統廠商牢牢控制著,蘋果和谷歌這兩個公司都借助自身的平臺已經形成了自己強大的生態系統。同時,微軟在WindowsPhone投資巨大,并已圍繞平臺創建龐大的生態系統參與競爭,Windows Marketplace在短短10個月內達到了3萬應用。

相對于已經成熟的原生態應用平臺,基于HTML5Web App的生態系統正處于萌芽期。由于HTML5的規范還在制定和討論中,運用Web App開發的過程中仍然會遇到對事件的響應速度及頁面渲染等性能問題、不同機型及Web瀏覽器內核的兼容性問題、對移動設備硬件資源的訪問等眾多問題;因此,搭建HTML5應用開發平臺需要總結目前各大互聯網商提供的HTML5應用開發的優劣勢,結合對今后移動互聯網HTML5的重點業務和應用預測,滿足基于HTML5的移動Web應用對HTML5關鍵特性的需求,以及對移動終端設備能力的調用需求。

另一方面,目前開發者的一大困難就是推出應用的技術障礙高、推出困難用戶接受難度大,或者由于技術能力不足而無法提供一些具有優勢的服務。搭建HTML5應用開發平臺,需要幫助開發者方便、靈活地推出個人應用。例如開發者沒有LBS,應用平臺可以提供LBS的位置;開發者在頁面上想獲得頁面的數據,原來由于沒有插件無法實現,而應用平臺可以用插件的模式做深度合作,幫助其解決面臨的短板。


綜上所述,搭建HTML5應用開發平臺的關鍵就在于實現其技術標準化、接口統一化、流程規范化、提高終端對基于HTML5的移動Web應用的兼容性,更好地為開發者服務。

3、HTML5終端側運行環境

基于HTML5的移動Web應用期望獲得大發展和廣大用戶的認可離不開智能終端對它的支持。為支持基于HTML5的移動Web應用,需要在終端側部署Web運行環境。Web運行環境是Web應用在終端上展現及執行的環境,可以是操作系統Web運行環境、瀏覽器、Widget引擎等。瀏覽器內核是Web運行環境的核心,可分為渲染引擎和JavaScript引擎兩部分:渲染引擎負責HTML、CSS、DOM等網頁標記語言的渲染,JavaScript引擎負責JavaScript腳本的邏輯執行。HTML5終端側運行環境按照實現方式的不同可以分為基于HTML5的終端瀏覽器和基于HTML5的WebOS兩種技術實現模式,下文將分別對兩種方式進行介紹與分析。

1)、基于HTML5的終端瀏覽器技術實現。

基于瀏覽器的方式在目前主流的Native智能終端操作系統上即可實現,只要升級瀏覽器支持HTML5的相關特性即可。基于智能終端的操作系統的瀏覽器可以是操作系統原生的瀏覽器(例如Safari、Android原生瀏覽器等)或者第三方瀏覽器(例如Ucweb、360瀏覽器等)。這種技術實現方式通常是在操作系統層嵌入瀏覽器內核(例如Webkit),在其基礎上擴展Web渲染引擎和JavaScript引擎的功能,并將HTML5特性在引擎中實現,在上層封裝后形成瀏覽器Web運行引擎,并以Web瀏覽器形式向應用層開放,如圖1所示。

 

2) 、基于HTML5的Web OS技術實現。

隨著HTML5應用的興起,在目前的Native智能終端操作系統外,也出現了一種新型的、基于HTML5的操作系統——WebOS,其技術架構如圖2所示。Web OS完全基于HTML5技術開發,以統一的Web API形式對上層應用開放終端能力,能夠避免目前不同Native操作系統提供不同API開發接口的缺陷,能夠很好地支持HTML5應用的跨平臺運行。采用這種技術架構實現的典型操作系統包括Firefox OS、Tizen及Ubuntu。

綜上所述,上述兩種方式從技術實現角度來看是類似的,技術實現機制的核心是依托Web應用運行環境為中間層,對下實現對操作系統的適配和終端能力的封裝,對上提供Web應用 API以支撐Web應用開發。而這兩種實現方式的主要區別為,在為上層應用開發提供Web API的同時,是否還保留原生的應用開發接口和機制,而對于純粹的Web OS,基于操作系統的應用應該全部是Web應用,不會存在其他類型的應用。

体彩7星彩开奖 在美国卖什么好赚钱 新桑塔纳的跑滴滴赚钱吗 什么软件可以赚钱 玩玩就可以 个人经销商赚钱吗 加入传说抢广告赚钱 大空头怎么赚钱 打包纸皮真的赚钱 现在钻井赚钱吗 码头很赚钱 工地上有哪些赚钱办法 学什么有赚钱的方法 gtaol地堡挂机赚钱 做软件的人怎么赚钱 激光刻字机赚钱 养殖竹鼠能不能赚钱 一场演唱会主办方和明星谁赚钱