為何要使用混合式開發？
要說為什么使用Hybrid App 【混合式開發】，就要先了解什么是Native App【原生程序】， Web App【網站程序】。
Native App
是專門針對某一類移動設備而生的，它們都是被直接安裝到設備里，而用戶一般也是通過應用商店來獲取應用 。 如安裝在 iOS 和 Android 設備上的客戶端。
Native App
體驗效果很好，但是有一個缺點，如果新增或更改某個功能的話，需要頻繁的升級，導致版本維護很難。
Web App
一般說來，移動Web App都是都是需要用到網絡的，它們利用設備上的瀏覽器(比如iPhone的Safari)來運行，而且它們不需要在設備上下載后安裝。
Web App
如果升級一個功能，只需要后台更新即可，不需要用戶端做什么事情，但是它的缺點是權限很低，不能操作用戶端設備的信息。
Hybrid App
是指介於web-app、native-app這兩者之間的app,它雖然看上去是一個Native App，但只有一個WebView，里面訪問的是一個Web App，如掌上百度和淘寶客戶端Android版，走的也是Hybrid App的路線，不過掌上百度里面封裝的不是WebView，而是自己的瀏覽內核，所以體驗上更像客戶端，更高效。
結論
“Hybrid App同時使用網頁語言與程序語言開發，通過應用商店區分移動操作系統分發，用戶需要安裝使用的移動應用”。總體特性更接近Native App但是和Web App區別較大。只是因為同時使用了網頁語言編碼，所以開發成本和難度比Native App要小很多。因此說，Hybrid App兼具了Native App的所有優勢，也兼具了Web App使用HTML5跨平台開發低成本的優勢。
項目開發
開發中用到的關鍵技術
AngularJS：js框架，用於開發網站應用，詳細的請看之前寫過的文章。
PhoneGap：用於js和客戶端交互，詳細原理請看 phonegap 框架詳解
調試流程及工具（安卓系統）
- 初步調試，適用於功能開發階段，調試工具：Chrome瀏覽器
- 查看AngularJS數據，工具：Chrome插件 -> AngularJS Batarang
- 集成到客戶端中調試，使用Chrome自帶功能，chrome://inspect ，此功能需要翻牆，且安卓系統版本大於4.4
- 低版本兼容性問題，使用weiner庫
問題解答
問題： 在chrome://inspect中不顯示我連接的手機
原因： 檢查一下，手機是否連接成功，是否已經安裝了adb調試工具，是否開啟開發者模式，啟用usb調試功能 。具體調試操作可以看 移動端Web開發調試之Chrome遠程調試(Remote Debugging)
問題： 怎么開啟usb調試功能
原因： 原版手機系統請查看 如何打開USB調試模式，如果是華為或小米 需要先點擊版本號，開啟“開發者模式”，每個品牌的手機，開發者模式選項的位置都不相同，如果找不到，請自行百度【百度關鍵字：小米 開啟usb調試模式】
問題： 使用chrome://inspect點擊inspect按鈕，頁面出現空白
原因： 第一次使用此功能時，谷歌瀏覽器會向服務器發送請求，獲取相應數據，由於請求被牆了，導致數據加載不了，導致空白頁面，怎么解決，你懂得。
問題： 使用chrome://inspect有時調試不了
原因： 只有debug版本才能調試，看你打的包是不是release版本的apk。
問題： js添加了PhoneGap之后，和客戶端交互的功能沒有響應
原因： 一、確認代碼確實走到調用客戶端的代碼那里並且執行了相關代碼，二、看一下是否是js寫的有問題，如本地客戶端的函數名和js調用的函數名不同，三、是否是客戶端的權限沒有配置
問題： 集成了PhoneGap后，如果程序立即執行，客戶端交互程序有時會直接報錯
原因： 這是因為你在PhoneGap還沒初始化好的時候就調用PhoneGap插件了，解決此問題需要，把 <html ng-app="mainApp"> 改為 <html id="mainApp" > 並且需要在js修改為手動初始化AngularJS
///// deviceready之后在開始執行angular
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
var domElement = document.getElementById('mainApp');
angular.bootstrap(domElement, ["mainApp"]);
}
問題： 修改成 deviceready 之后，在頁面中就調試不了了，怎么辦
原因： 在網頁中調試時，你把ng-app="mainApp"加上就可以了
問題： 程序員哥哥，再問最后一個問題，你為什么那么帥，那么有氣質呢
原因： 很多人也都說我漂亮的不像實力派，我只想說：當才華與美貌並存的時候，我希望你看重的是才華！
如果你的視野只局限於技術，你也許是一個好的開發者，但也僅僅是一個好的開發者