iOS native app interacts with H5 pages

Wen/mikezhangpy (author of Jane's book)
Original link: http://www.jianshu.com/p/4ed3e5ed99c6
Copyright belongs to the author, please contact the author to obtain authorization, and Mark "book author".

Recently in a project to use the native app with H5 interaction, before the simple H5 page directly call the native method example, is to take advantage of the proxy method in UIWebView

WebView calls this method before each load, using the proxy method to intercept the JS href to invoke the native method

-(BOOL) WebView: (uiwebview*) WebView shouldstartloadwithrequest: (nsurlrequest*) Request Navigationtype: ( Uiwebviewnavigationtype) Navigationtype

However, this time the interaction requirements are two-way communication, that is, JS calls the native app method, the native app to tell the relevant parameter information back to the H5 page, H5 page to accept the parameter information to do other processing.

Example: H5 page of the Publish Information button, after clicking on the button to determine whether the user is logged in the original, if not logged in the native login page, log in successfully after the user information back to the H5 page, continue to publish the process.

Here comes the point!

A better third-party library is recommended here:Webviewjavascriptbridge

Address: Https://github.com/marcuswestin/WebViewJavascriptBridge

By using this library, you can easily implement JS and native interactions.

Initialize the Webviewjavascriptbridge method

_bridge= [Webviewjavascriptbridge bridgeforwebview:self. Bookwebview webviewdelegate:self handler:^ (id data,wvjbresponsecallback responsecallback) {

}];

The original and JS convention interface named "Testobjccallback", data is JS passed over the information, Responsecallback to pass the information to JS

[_bridge registerhandler:@ "Testobjccallback" handler:^ (ID data,wvjbresponsecallback responsecallback) {

Responsecallback ("Postinfomationtojs")

}];

UIWebView Offline caching of page information

Recommend a better third-party library Rncachingurlprotocol, only need to add the following method in the Appdelegate.

[Nsurlprotocolregisterclass:[rncachingurlprotocolclass]];

Address: Https://github.com/rnapier/RNCachingURLProtocol

iOS native app interacts with H5 pages