这个问题在我看网易的h5案例的时候萌生的。因为想看他的源码,但是手机微信打开肯定看不了。

以下几种看代码的方法:(页面案例用网易大大刷屏的h5《二零一六娱乐圈画卷》,真的是一个值得我等众生摩拜的项目!)

一、麻烦一点的配代理在手机端添加控制台看

这个材料需要:

Fiddler抓包工具(自己下载一个,使用教程见https://www.cnblogs.com/padding1015/p/9004742.html

vconsole.min.js(npm上下载一个,或者github里搜索下载一个。安装方法:https://www.cnblogs.com/padding1015/p/9228696.html)。

手机配完fiddler代理后,重开页面,然后抓到index.html,然后down到本地,添加上vconsole的代码。

再将线上的index.html指向到本地文件(这种教程去百度词条搜索“fiddler 代理线上页面指向到本地文件”)。

然后手机上就有这个控制台可以看了:

总结:虽然麻烦,但是适用于设置了必须微信环境打开的项目。

二、简单一点的直接在电脑F12控制台查看

其实有时候,你直接将项目链接贴到浏览器会发现这种提示:

哈哈,还是得手机看。还是得返回第一种情况看源码吗?

no,我发现个小技巧:

具体操作:

  • 浏览器粘贴地址,出现上边静态图二维码效果
  • F12打开控制台
  • 控制台左上角点击后,切换成模拟器效果
  • F5重刷页面

这一套操作下来,基本上百分之90%的页面都出来了!

三、站在大佬的肩膀上看大佬的源码

哈哈哈,要知道微信有微信开发者工具啊,

更值得庆幸的是他还有网页调试模式啊:

可以新建项目时选择右边这个“公众号网页项目”就行了。

或者在菜单栏更改调试模式:

然后正常输入网页的链接,页面就出来啦:

工具 - 怎么看微信h5的源码?的更多相关文章

  1. 分享微信h5支付源码

    类库代码 wechatH5Pay.php <?php //use Flight; /** * 微信支付服务器端下单 * 微信APP支付文档地址: https://pay.weixin.qq.co ...

  2. 微信h5支付源码DEMO参考

    类库代码 wechatH5Pay.php <?php //use Flight; /** * 微信支付服务器端下单 * 微信APP支付文档地址: https://pay.weixin.qq.co ...

  3. H5传奇源码,附带微信支付,商城系统,新增了元宝交易商城系统源码

    源码说明:传奇游戏是80年底的经典游戏,传奇源码,H5游戏源码下载,附带微信支付,商城系统,新增了元宝交易商城系统源码,内置很多任务,比如首冲任务,修复了很多BUG.[架设要求]游戏名称:H5传奇世界 ...

  4. 如何找回微信小程序源码?2020年微信小程序反编译最新教程 小宇子李

    前言:在网上看了找回微信小程序源码很多教程,都没法正常使用.微信版本升级后,会遇到各种报错, 以及无法获取到wxss的问题.查阅各种资料,最终解决,于是贴上完整的微信小程序反编译方案与教程. 本文章仅 ...

  5. iOS 即时通讯 + 仿微信聊天框架 + 源码

    这些你造吗? 即时通讯(IM),在IOS这片江湖里面已经算是一个老者了,我这小旋风也是在很早以前巡山的时候,就知道有即时通讯这个妖怪,以前也多多少少接触过一些,在造APP的时候用过,哎呀,说着说着就感 ...

  6. 复用微信小程序源码包后仍然有原小程序的版本管理怎么处理

    前言: 复用微信小程序源码包后,重新创建项目导入源码包,会发现开发者工具版本管理中仍然有原来小程序的版本,这样就不太好了.毕竟是一个新的小程序,需要有新的版本控制的.那么这个问题怎么处理呢? 解决方案 ...

  7. 反编译获取线上任何微信小程序源码(转)

    看到人家上线的小程序的效果,纯靠推测,部分效果在绞尽脑汁后能做出大致的实现,但是有些细节,费劲全力都没能做出来.很想一窥源码?查看究竟?看看大厂的前端大神们是如何规避了小程序的各种奇葩的坑?那么赶紧来 ...

  8. 【转】反编译获取任何微信小程序源码(完)

    一.前言最近在学习微信小程序开发,半个月学习下来,很想实战一下踩踩坑,于是就仿写了一个阿里妈妈淘宝客小程序的前端实现,过程一言难尽,差不多两周时间过去了,发现小程序的坑远比想象的要多的多!!在实际练手 ...

  9. 转载:微信小程序源码提取反编译

    转载来源:www.51xuediannao.com/xiaochengxu/019c08cc.html 一.前言 微信小程序源码提取反编译,听起来很屌,其实还是简单的,基本是傻瓜式操作.要想拿到微信小 ...

随机推荐

  1. 在latex或者mathtype中如何输入花体,如拉式量L

    这个问题困扰我很久,知道我找到这个答案: 把  \mathcal{L} 直接黏贴到mathtype的编辑框中就可以产生花体L了

  2. JAVA自学笔记04

    JAVA自学笔记04 1.switch语句 1)格式:switch(表达式){ case 值1: 语句体1; break; case 值2: 语句体2; break; - default: 语句体n+ ...

  3. Aizu0189 Convenient Location(多源最短路)

    https://vjudge.net/problem/Aizu-0189 题意:求某一点到其他所有点的最短路径之和,输出该点与和. 注意Floyd可以求多源最短路径,而Dijkstra只能求单源. # ...

  4. django之模型层(model)--建表、查询、删除基础

    要说一个项目最重要的部分是什么那铁定数据了,也就是数据库,这篇就开始带大家走进django关于模型层model的使用,model主要就是操纵数据库不使用sql语句的情况下完成数据库的增删改查.本篇仅带 ...

  5. 对类的理解(c++)

    介绍目录: 1.类成员 1.1 成员函数 1.2 构造函数 1.2.1 对构造函数的理解 1.2.2成员初始化列表 1.2.3必须使用成员初始化列表的几种情况 1.2.4对于拷贝构造函数的参数是一个引 ...

  6. HOWTO: Avizo/Amira使用前的显卡设置(Volume Rendering,Volren不显示)

    关于Avizo或Amira中体渲染不显示的问题,常常有人在问,有人甚至怀疑软件有问题,今天就这个话题总结如下: 首先我们要清楚像Avizo或Amira之类的三维可视化软件,必须是在配有专业显卡的工作站 ...

  7. SpringBoot乱码

    第一步: 第一步,约定好传参编码格式 不管是运用httpclient,还是原生http,都要设置传参的编码,为了统一,这儿全部设置为utf-8 第二步,修正application.properties ...

  8. codevs 2033 邮票

    洛谷 P2725 邮票 Stamps codevs 2033 邮票 题目链接 http://codevs.cn/problem/2033/ https://www.luogu.org/problemn ...

  9. 【ThinkPHP】ThinkPHP环境的安装与配置

    ThinkPHP是一个免费开源的,快速.简单的面向对象的轻量级PHP开发框架. 严格来说,ThinkPHP无需安装过程,这里所说的安装其实就是把ThinkPHP框架放入WEB运行环境(前提是你的WEB ...

  10. 面经 cisco

    1. 优先级反转问题及解决方法 (1)什么是优先级反转 简单从字面上来说,就是低优先级的任务先于高优先级的任务执行了,优先级搞反了.那在什么情况下会生这种情况呢? 假设三个任务准备执行,A,B,C,优 ...