前端 | 本地调试H5页面方案总结

最新推荐文章于 2025-02-17 16:33:53 发布

程序媛Sherry

最新推荐文章于 2025-02-17 16:33:53 发布

阅读量1k

点赞数 1

分类专栏：前端好些事儿文章标签：前端开发开发经验调试 chrome safari

本文链接：https://blog.youkuaiyun.com/u012496505/article/details/73604219

版权

这里写图片描述
背景

大学毕业快要一年了,用leader的话说我也是有一年开发经验的前端开发工程师了,输出是检验输入的最好方法,那我就慢慢来总结这一年来在工作中总结的经验教训,分享给大家,有不专业和不完善的地方,请大家多多指点反馈,比心~

做过一段时间的运营需求,一些主要在手机上浏览的页面,遇到的最大问题是调试的问题:

对于简单的网络、APP环境的调试,我们可以通过Chrome调试安卓机上的H5页面,通过Safari调试iPhone上的H5页面
对于一些复杂的网络、App环境的调试,如需要调试 HTTPS协议的接口，或必须要在某些 App 中才能调用的jsBridge 接口(如微信)，导致难以在本地建立开发环境，需要将代码发到测试环境等之后才能调试，导致开发效率低下

本文将介绍一些可用的本地开发调试方法,提高你的开发效率,嘿哈~。

一.简单网络、APP环境的调试

需求:

调试嵌入App(Webview组件处于可调试状态)的H5页面,此H5页面调用了jsBridge接口(例如jockey接口)

难点:

H5调用了App的jsBridge接口,则此H5页面只能在此App里打开

1.通过Chrome调试安卓机上的H5页面

解决方案:

(1)安装Chrome 32或者之后的版本

(2)使用USB线将安卓机和Mac连接起来

(3)打开 USB 调试选项

在安