此文章适合快速开发不用明白原理的小白,大佬可一目十行自行跳过。
首先,针对这个WebViewJavascriptBridge,之前做电商时候有接触过这个桥接文件。发扬着搬砖精神,不知其所以然。一直是用的高兴,大家开心就行。然而现在面临着开始做新项目的架构,不得不对其进行新一轮研究。话不多说,进入正题!
普及一波菜鸟知识:WebViewJavascriptBridge:是一个Objective-C与JavaScript进行消息互通的三方库,主要负责OC环境的消息处理,并且把OC环境的消息发送给Javascript环境(PS,码原理累,可耻的拷贝了一波网络文字)。用砸门菜鸟的话来讲,就是美国大哥(OC)需要日本小弟(H5)的帮助,语言不通,这个Bridge就是一翻译器。还有疑问,请自行Google!
写这个文章前找了不少资料,发现网络大神写的很High,很暴力,菜鸟根本不知所云。所以我简单粗暴归纳了三步接入流程:
1、不管其它先显示H5。拉入WebViewJavascriptBridge文件后者pod导入——>初始化WebView,加载HTML。暴力贴图如下:
2、实现H5调用Native
初始化桥接文件——>添加你与H5小哥约定方法的实现——>传参给H5 图如下:这里只写了一个方法,多个方法请自行与H5小哥商定,原理一样,第三步亦如此。
到这一步 总结下,H5已经能自由调用你的功能了。
3、实现native调用H5 ,这里其实就是几个方法的使用了 直接贴图:
总结:WebViewJavascriptBridge接入其实非常容易,难的是对于它的原理理解。这里插入些废话:之前苹果老爸上线iOS9的时候,更新了WebViewJavascriptBridge桥接文件的格式,如果你与H5文件有任何字符串方面的约定,记得一定要规范、规范再规范,切记!
三步集成,快速开发,这篇文章献给初识H5与Native交互的小伙伴。如有时间,希望大家多深入了解其原理。
我们项目后期会用WKWebview(这应该对于以后是主流),但webview在使用步骤,集成方法其实大同小异,再一个就是他们的优劣势,不过这篇文章的重心不在这,遂不做过多介绍。
创作不易,如有不足和错误之处,跪谢指正!