混合開發(fā)經(jīng)歷總結(jié)
作為iOS開發(fā),native的一些缺陷,確實(shí)使得一些業(yè)務(wù)無法保證,混合開發(fā)目前來說,毫無疑問是最符合當(dāng)前移動端的一種方式.混合開發(fā)無非是native與JS交互的問題,第一版本我們以WKWebView為主,native作為框架,考慮到web微信端(公眾號)已經(jīng)完成,盡量做到代碼復(fù)用.
Web數(shù)據(jù)共享的問題
web存儲主要為LocalStorage,SessionStorage這兩種存儲方式,我們方案是把數(shù)據(jù)緩存在本地,我目前用的plist文件,而這種方式,在iOS端get數(shù)據(jù)時無法同步返回,這里用的是WKWebView與JS交互的方式.
- 業(yè)務(wù)需要我們要在JS開始執(zhí)行之前注入JS
WKWebViewConfiguration * configuration = [[WKWebViewConfiguration alloc] init];
WKUserContentController * userContent = [[WKUserContentController alloc] init];
[userContent addScriptMessageHandler:self name:@"login"];
NSString * js = [NSString stringWithFormat:@"window.localStorage.setItem('%@','%@')",key,value];
WKUserScript * userScript = [[WKUserScript alloc]initWithSource:js injectionTime:WKUserScriptInjectionTimeAtDocumentStart forMainFrameOnly:NO];
[userContent addUserScript:userScript];
configuration.userContentController = userContent;
self.wkWebView = [[WKWebView alloc]initWithFrame:CGRectMake(0,0, kWindowWidth, kWindowHeigth) configuration:configuration];
//JS端調(diào)用方法
window.webkit.messageHandlers.login.postMessage({body: 'login'});
可以通過addScriptMessageHandler添加需要的set,remove方法,通過上述代碼與JS交互后,native實(shí)現(xiàn)WKScriptMessageHandler協(xié)議方法,實(shí)現(xiàn)JS調(diào)用native,其實(shí)只有一個...
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message;
目前是中這種思路去做的,但是這種方式無法實(shí)現(xiàn)同步給js返回值,而且數(shù)據(jù)變化時只能重新加載一遍WebView去注入數(shù)據(jù),效果不好,解決思路:
- 用JavaScriptCore去做數(shù)據(jù)共享這方面,但是實(shí)踐發(fā)現(xiàn)依舊不能實(shí)現(xiàn)同步,有時會拿不到值.
- WKWebView的坑確實(shí)很煩,在文章末尾會舉例說明.
- 比較Weex或RN,主要是微信端用的是Vue.js,最終選擇Weex.
- 追求60分的前提下,完全可以做到三端復(fù) ,但是在追求90分的情況下,追求三端復(fù)的結(jié)果,未必分開編寫來的效率宾符。
Weex
第二版本只是首頁和地址選擇的一些界面用Weex,首先性能方面確實(shí)要比WebView強(qiáng)大,而且最后Weex也會轉(zhuǎn)換為native去渲染.后面會慢慢過渡到weex.
- weex中Storage也是用plist文件存儲,但是weex中Srorage也是異步,這里通過weex的Module擴(kuò)展weex數(shù)據(jù)與web數(shù)據(jù)共享
- 包括weex跳轉(zhuǎn)原生webView同理
// set等其他方法同理
WX_EXPORT_METHOD(@selector(getStorageItem: callback:))
-(void)getStorageItem:(NSString *)key callback:(WXModuleKeepAliveCallback)callback
WKWebView的坑
- 目前在WebView中JS第一次發(fā)送請求時失敗,導(dǎo)致界面需要重新刷新.有解決的或遇到這些問題的人歡迎一起討論交流.
- WKWebView內(nèi)存泄漏的問題,記得在控制器銷毀時,移除所有添加的ScriptMessageHandler
- (void)removeScriptMessageHandlerForName:(NSString *)name;