移動開發的捷徑：3種方式輕鬆建立webapp

移動開發行業發展迅速，爲迎合用戶的需求，大多數傳統互聯網公司在主導web網站的同時還需兼顧移動開發方向。在已有PC端網站的基礎上，考慮到人力、成本和技術、開發週期等因素，許多公司會選擇開發快速、維護便捷且成本更低的webapp 。

AppCan與webapp

移動雲平臺AppCan在爲開發者提供簡單高效的Hybrid混合模式App開發服務的同時，也兼備了webapp 開發模式，且在分辨率適配方面，已經支持大部分主流機型。

若是你的apk存在適配問題，請先檢查下：
1.3.0在線打包（IDE本地打包的引擎不能保證版本最新）；
2.保證啓動圖按照要求的分辨率上傳；
3.網頁中增長標準屬性：

<metaname="viewport" content="target-densitydpi=device-dpi,width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0,maximum-scale=1.0">
4.註釋掉本身寫的修改分辨率的代碼；
5.建立一個新項目，使用官方提供的模版打包，解壓後對比一下關於適配的代碼。

下面爲你們介紹如何在AppCan平臺建立webapp的3種方式：

1.在線自動建立webapp

註冊AppCan開發賬號，建立一個項目，選擇webapp通道，在網址一欄中輸入須要生成webapp的web網址，配置app相關選項，從啓動icon、啓動圖、狀態欄到插件選擇、證書選擇等，最後點擊生成安裝包，便可下載安裝（支持安卓&iOS平臺）。

注意事項：

(1) Web網址填寫要按照規範加上http協議，且不支持二級目錄。

(2) 此方式符合一個網址可建立一個項目app標準，一旦建立不可修改。

(3) 安裝生成的webapp，須要用戶在有網的狀況下才能正常瀏覽，不然提示頁面無鏈接。

2.配置config.xml文件爲web網址

在線建立一個項目，選擇Hybird模式，而後打開IDE本地開發工具，使用在線同步項目功能，具體參考使用文檔《IDE開發流程之同步AppCan項目》：

http://newdocx.appcan.cn/newdocx/docx?type=1480_1234

選擇剛建立的hybrid項目，同步到本地IDE，提示簽出代碼成功後，說明你操做基本正常。

打開config.xml文件能夠編輯，這裏有2處涉及到webapp配置：

NO.1：起始頁替換成你的web網址，表明你生成的App打開的是你的web網址

NO.2：<webapp>false</webapp> 此選項能夠配置true 和 false ，true表明生成的App啓動不帶loading進度條，false表明表明生成的App啓動帶loading進度條。

如圖： 

3.使用Hybird模式代碼建立webapp

具體參考文檔《建立一個AppCan應用》，這裏不作過多陳述：

http://newdocx.appcan.cn/newdocx/docx?type=1353_1291，

打開IDE，在起始頁修改代碼：

appcan.ready(function() {  

var titHeight = $('#header').offset().height;

appcan.frame.open("content","http://www.appcan.cn」,0,titHeight); window.onorientationchange = window.onresize = function() {

                appcan.resizePopoverByEle("content", 0, $("#header").offset().height);

            }

}

以上代碼中，appcan.frame.open("content","http://www.appcan.cn」,0,titHeight);

第二個參數url爲窗口要加載的頁面的網頁地址。

配置config.xml文件：

添加 <webapp>false</webapp> ，此選項能夠配置true 和 false，同方法2中說明。

最後幾點須要注意：

(1)以上webapp都是須要確保適配移動端的，如何適配在AppCan論壇中有不少開發者分享的教程，這裏再也不敘述；

(2)AppCan封裝的基礎框架已經適配移動端，採用上述描述的方法3便可。

(3)使用AppCan平臺開發，都支持調用AppCan原生功能插件，前提是你的web網址中有調用集成的AppCan原生插件接口，可參考各插件文檔配置。

以上3種方法供各位參考。爲進一步提升用戶體驗，建議使用AppCan混合模式開發移動App，一樣簡單高效，大大下降開發成本。