由于项目是Hybrid开发，作为前端一直需要和Native端的离场供应商联调。项目初期联调繁琐并且由于各种Pr审批以及devops流程等纵使调试困难。最后我把原生代码都要来了，进行一下本地联调，效率的确提升很多。 接下来就介绍一下H5如何本地和Native进行联调。
一、H5准备部分
普遍前端框架脚手架跑起来项目之后会有2个地址
这2个都是本机地址，External的地址是可以在同一个局域网环境下供其他设备访问的（没有网络策略的前提下）。
比如自己的手机可以调试和另一台电脑或者是电视及都是可以打开的。
Ps:如果有一些脚手架没有2个都起的话可以使用命令
npm run dev -- host 192.168.x.x
或者Npm start & ng 等。
（如果开了梯子，动态变化的话可以使用ifconfig 或者 ipconfig 进行查看自己的本地External IP）
准备好了这一步，就可以保证我们H5的改动已经是实时的是最新的代码了。
二：AnDroid准备部分
1）首先，在安卓代码里设置 WebView 调试模式。WebView 类包含一个公共静态方法，作为 Debug 开关：
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
WebView.setWebContentsDebuggingEnabled(true);
}
2）然后Android Studio 模拟器起起着或者USB连接的前提下，打开 PC 中的 Chrome 浏览器，输入网址，打开页面：（科学上网）
chrome://inspect/#devices
而后点击对应网页下方的 inspect 选项便可以进入开发者工具页：
如果是真机，通过 USB 连接手机设备的话，检查开启 Remote devices 页面左侧 Settings 菜单中的 Discover USB devices 选项：
3）然后通过代码里中加载H5的external Ip 就可以对原生和H5交互的各种回调进行console和接口参数的联调了。
三：Ios准备部分
1）首先，Xcode的苹果开发者账号申请完毕之后，在有了代码之后如果只是本机调试。 可以直接起模拟器或者是改动一下Bundle Id 进行真机模拟。
2）打开safari 如果是MacOS > 12.1 可以安装紫色的Safari Technology preview版本 ，据说会减少闪退。
然后选择偏好设置（perferences）-> 高级（advanced）->勾选 在菜单栏中显示“开发”菜单（Show develop menu in menu bar）
3)然后打开苹果模拟器或者usb链接上手机信任设置统一一下之后用app打开需要联调的webview，然后打开Safari选择开发（develop）
然后dang dang ~~
4）最后通过代码里中加载H5的external Ip 就可以对原生和H5交互的各种回调进行console和接口参数的联调了。
这些调试方法可能只是适用于一个人需要和多个壳子对接的时候需要，如果你有清晰的对接文档和牛逼的原生同事，那这些就都不是事了，最后祝大家天天没bug~~
