关于H5真机调试

一、让手机和电脑处于同一网段

如何让手机和电脑处于同一网段？

1.如果你所处环境的wifi和电脑网络是同一局域网，当你手机连上wifi后自然很电脑处于同一网段了。

2.电脑发射wifi，手机连接。笔记本电脑可以下载wifi软件，台式电脑只能买个wifi发射器了，所以我买了一个随身wifi。

3.手机开热点，笔记本电脑连接。

二、起一个本地服务器（自用live-server）

三、vConsole、eruda等调试库

这个方法需要在页面中插入一段 JS 脚本，这里以vConsole为例，导入vconsole.min.js，并实例化，注实例化代码最好放在头部，以便能一开始就能劫持内容：

<script src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.11.1/vconsole.min.js"></script>
<script>

        // 初始化

        new VConsole();

    </script>

或者

npm i vconsole
复制代码

import VConsole from 'vconsole';

new VConsole();
复制代码

四、调试

复制浏览器中的地址 http://127.0.0.1:5500/index.html

将 127.0.0.1 改成你电脑的IP地址 http://192.168.1.143:5500/index.html 并复制到手机浏览器中

其他：移动端网页抓包调试工具

https://www.mobiledebug.com/Mobile Debug官方网站(代理抓包/移动端H5调试/请求劫持/HTTPS支持/Hosts管理/WebSocket数据捕获/跨平台免费使用)