WebKit(WKScriptMessageHandler)
上一篇博文《WebKit(展示W(wǎng)eb界面)》講解了顯示W(wǎng)eb頁面钻哩，這一篇博文將講解使用WKScriptMessageHandler完成JS交互街氢。
在WKWebView中OC和JS交互也非常簡單淑趾，WebKit庫中有個代理WKScriptMessageHandler就是專門來做交互的扣泊。
1 WKScriptMessageHandler
1.1 WKScriptMessageHandler協(xié)議
WKScriptMessageHandler其實就是一個遵循的協(xié)議延蟹，它能讓網(wǎng)頁通過JS把消息發(fā)送給OC阱飘。其中協(xié)議方法虱颗。
/*!@abstractInvokedwhena script messageisreceived from a webpage.@paramuserContentController The user content controller invoking the
delegate method.@parammessage The script message received.
*/
- (void)userContentController:(WKUserContentController *)userContentControllerdidReceiveScriptMessage:(WKScriptMessage *)message;
從協(xié)議中我們可以看出這里使用了兩個類WKUserContentController和WKScriptMessage忘渔。WKUserContentController可以理解為調(diào)度器畦粮，WKScriptMessage則是攜帶的數(shù)據(jù)。
1.2 WKUserContentController
WKUserContentController有兩個核心方法瞪浸，也是它的核心功能吏祸。
1. ? - (void)addUserScript:(WKUserScript *)userScript;: js注入犁罩，即向網(wǎng)頁中注入我們的js方法床估，這是一個非常強大的功能含滴，開發(fā)中要慎用。
2. ?- (void)addScriptMessageHandler:(id )scriptMessageHandler name:(NSString *)name;：添加供js調(diào)用oc的橋梁丐巫。這里的name對應WKScriptMessage中的name谈况，多數(shù)情況下我們認為它就是方法名。
1.3 WKScriptMessage
WKScriptMessage就是js通知oc的數(shù)據(jù)递胧。其中有兩個核心屬性用的很多碑韵。
1. ? @property (nonatomic, readonly, copy) NSString *name;：對應- (void)addScriptMessageHandler:(id )scriptMessageHandler name:(NSString *)name; ? 添加的name。
2. ? @property (nonatomic, readonly, copy) id body;：攜帶的核心數(shù)據(jù)缎脾。
js調(diào)用時只需
window.webkit.messageHandlers..postMessage()
這里的name就是我們添加的name祝闻，是不是感覺很爽遗菠，就是這么簡單联喘，下面我們就來具體實現(xiàn)。
2 JS調(diào)用OC
2.1 配置WKUserContentController
要想使用WKUserContentController為web頁面添加橋梁辙纬，只需配置到WKWebViewConfiguration即可豁遭。
下面改造webView方法。
2.2 實現(xiàn)WKScriptMessageHandler
在當前頁面引入WKScriptMessageHandler贺拣，并實現(xiàn)WKScriptMessageHandler協(xié)議即可蓖谢。
2.3 改造index.html頁面
修改index.html的onClickButton()方法。
這里我們?yōu)榱藴y試效果傳入了一個復雜的字典數(shù)據(jù)譬涡，而且字典中還有數(shù)組闪幽。input.value代表用戶輸入的數(shù)據(jù)。
這里使用了window.webkit.messageHandlers.jsCallOC.postMessage(dict);通知oc涡匀，jsCallOC這個屬性就是前面我們通過WKUserContentController注入的沟使。
2.4 測試交互
我們在viewDidLoad使用index.html頁面完成測試。
運行項目后渊跋，在頁面的輸入框中輸入相應信息腊嗡，點擊確定按鈕着倾。即可在xcode中看見相關打印信息。
3 OC調(diào)用JS
3.1 OC通知JS
oc調(diào)用js就特別簡單了燕少，只需WKWebView調(diào)用
- (void)evaluateJavaScript:(NSString *)javaScriptString completionHandler:(void (^ __nullable)(__nullable id, NSError * __nullable error))completionHandler;方法即可卡者。
在上面的打印信息中，我們會發(fā)現(xiàn)我們還沒有實現(xiàn)jsCallOC：方法客们，接下來我們在jsCallOC:方法中實現(xiàn)通知JS崇决，并將用戶輸入的信息發(fā)送給JS。
3.2 JS響應
OC將通知發(fā)送給JS后底挫，JS要響應這個ocCallJS方法恒傻。我們在index.html中的onClickButton()方法下添加ocCallJS方法。
?//WKWebView調(diào)用JS
function ?ocCallJS(params){
? ? ? ? ?show.innerHTML = params;
}
運行項目建邓，在輸入框輸入信息后盈厘，點擊確定按鈕，會發(fā)現(xiàn)輸入的信息在輸入框下面顯示出來官边。如圖所示沸手。
并在控制臺看見如下打印信息。
4 WKUserScript JS注入
4.1 WKUserScript核心方法
在WebKit框架中注簿，我們還可以預先添加JS方法契吉，供其他人員調(diào)用。WKUserScript就是幫助我們完成JS注入的類诡渴，它能幫助我們在頁面填充前或js填充完成后調(diào)用捐晶。核心方法。
4.2 WKUserScriptInjectionTime枚舉
在WKUserScriptInjectionTime枚舉中有兩個狀態(tài)妄辩。
WKUserScriptInjectionTimeAtDocumentStart：js加載前執(zhí)行惑灵。
WKUserScriptInjectionTimeAtDocumentEnd：js加載后執(zhí)行。
4.3 js注入
WKUserScript的運行需依托WKUserContentController恩袱，接下來我們就為WKWebView注入一個js執(zhí)行完畢后執(zhí)行的alert方法泣棋。
改造- (WKWebView *)webView方法胶哲。
其他
