在微信里如何使用开发者工具(F12)
森遇博客

在微信里如何使用开发者工具(F12)

时迁
1年前发布
广告 广告 广告 广告

图片[1] - 在微信里如何使用开发者工具(F12) - 森遇博客

方法一(手机连接电脑调试)

  1. 将手机开启开发者选项,并开启USB调试模式
  2. 手机微信内点击打开网页http://debugxweb.qq.com/?inspector=true,弹出小提示执行成功且跳转至微信官网首页为检查模式开启成功
  3. 手机用USB连接至电脑,并在电脑端打开浏览器,例如edge、chrome
  4. 浏览器打开以下网址
  5. chrome://inspect/#devices
  6. edge://inspect/#devices
  7. 手机微信内打开所需调试网址, 例如info.arsn.cn
  8. 在点击浏览器里的inspect 直接调试(可以直接用鼠标进行操作)

图片[2] - 在微信里如何使用开发者工具(F12) - 森遇博客
图片[3] - 在微信里如何使用开发者工具(F12) - 森遇博客

方法二(微信PC端)

序:

  1. 不需要指定的微信版本、不用非得你自己的网站!
  2. 建议微信小号去试哈!因为是别人开源的工具,所以我建议你是开小号去试!切记。
  3. 需要安装node版本node 18.15.0,最好是win10、win11。

效果:

图片[4] - 在微信里如何使用开发者工具(F12) - 森遇博客

看图你就知道了,也就是说她不一定是在你的网站里,别人的网站也可以f12。
图片[5] - 在微信里如何使用开发者工具(F12) - 森遇博客

跟版本无关!我截图只是告诉你,我的微信是最新版的桌面端

一、先下DevTools工具

图片[6] - 在微信里如何使用开发者工具(F12) - 森遇博客

没科学上网,或者网速慢的一批的小伙伴,我放网盘了,可以直接下


因为是第三方开源的别人的东西,所以我在强调一遍,你如果有多个微信,最好用小号去试!

二、下载安装并设置好环境变量 node 18.15.0 版本

https://nodejs.org/dist/v18.15.0/

三、关闭微信客户端,并解压WeChatOpenDevTools-main.zip压缩包文件(一定要解压),打开打开公众号F12.bat文件,

图片[7] - 在微信里如何使用开发者工具(F12) - 森遇博客
这一步他会弹出微信桌面端扫码的框,你最好用你的小号去登!!!!!!!(不然后果概不负责哈!)

四、在微信里打开你要调试的网页,右键点击检查打开开发者工具(F12)

图片[8] - 在微信里如何使用开发者工具(F12) - 森遇博客
图片[9] - 在微信里如何使用开发者工具(F12) - 森遇博客
看明白了吗?

对了,他文件夹有一个小程序打开F12,但是我没试过,你们感兴趣在自行去研究,但是后果自负哈!!!

喜欢就支持一下吧
点赞 0 分享 赞赏
评论 抢沙发
取消 登录评论