iOS 混合應用的關鍵點分析 - 仿 Android 平台 WebView 可注入本機物件方法的功能實現要點

標籤：

iOS 混合應用的關鍵點分析 - 仿 Android 平台 WebView 可注入本機物件方法的功能實現要點

太陽火神的美麗人生 (http://blog.csdn.net/opengl_es)

本文遵循“署名-非商業用途-保持一致”創作公用協議

轉載請保留此句：太陽火神的美麗人生 -  本部落格專註於 敏捷開發及移動和物聯裝置研究：iOS、Android、Html5、Arduino、pcDuino，否則，出自本部落格的文章拒絕轉載或再轉載，謝謝合作。

對於 iOS 和 Android 平台來說，各自的流暢覽器組件 UIWebView 和 WebView 都可以很容易地在本地代碼中調用 WebView 內頁面 JS 指令碼。

然後，從 JS 調用本地方法，只有 Android 平台的 WebView 組件提供了，這也很容易理解，畢竟 Android WebView 組件以 Java 實現，想向其反射注入些功能也時很容易的，但具體實現尚未去分析源碼證實。

對於 iOS 來說，只有一個切入點，那就是通過 UIWebViewDelegate 的頁面載入事件，獲得到頁面內的載入事件。

那麼如何在頁面內很容易地觸發一個頁面載入事件，以便能在本地代理方法中截獲並響應這一 HTML 頁面內事件呢？

這一問題，即已抽象出了函數調用方的事件觸發，和函數被調方的事件響應機制的映射雙方。

1、通過 a 標籤，早些年的 PhoneGap 架構即為這樣實現的，不過感覺有些拘束；

2、加入 input 組件，並設定為隱藏狀態，通過設定其 onClick 事件，動態更新其載入的連結，這個對原頁面有要求，且附屬操作過多；

3、像 img 的頁面二次載入其 src 指定圖片的原理，即不會影響原頁面產生重新整理，又會觸發頁面載入；

    實際測試發現，該組件只在頁面初次載入時，進行串列載入，即使加了 defer 或 async 參數，也無法動態觸發。

    後發現一個開源庫，其採用了 iframe 的 src 來觸發載入，動態將 iframe 添加到頁面，就會觸發載入 src 連結的事件，能被本地捕獲，然後馬上再移除這個 iframe。

這個開源庫能很好地將 iOS 本機物件的所有方法動態載入給當前頁面的 window 對象，可以在頁面內直接調用對應對象的方法。

不過該庫實現者對 iOS 方法簽名的理解有誤，所以，對於多參數方法，並沒有能很好地解決。

iOS 混合應用的關鍵點分析 - 仿 Android 平台 WebView 可注入本機物件方法的功能實現要點