微信开发者工具 调试微信页面_微信开发者工具如何调试微信页面、 - CSDN
  • 1 下载 微信web开发者工具:https://mp.weixin.qq.com/wiki?t=resource/res_main&...3 打开微信web开发者工具 ,选择如下图PS:我使用了很多手机,小米max ,iphoneX,小米5sp等等。。。没有一个能使用 X5Blin...

    1 下载 微信web开发者工具:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1455784140

    下载一个自己能用的版本:


    2 手机开启  USB调试,不赘述了。每个版本显示方法不一样。

    手机通过数据线连接PC端


    3 打开微信web开发者工具 ,选择如下图

    PS:我使用了很多手机,小米max ,iphoneX,小米5sp等等。。。没有一个能使用 X5Blink调试。。。我也开启了TBS 内核 Inspector 调试功能。但是没用。。。。

    选择移动调试,选择普通调试




    4 手机连接wifi,确保wifi和pc端在同一个网段。(这个问网管就行了)

    连接玩后,进入wlan,设置: 

    代理:手动

    主机名:上面步骤1的网卡地址,我这里是192.168.1.88


    5 微信开启一个页面,然后点击微信web开发者工具的 开始调试。

    PS: 必须先开启页面,再点击开始调试!!!

    本机访问地址: http://192.168.1.88:804/controller/action  这样的iis发布地址


    6 成功的样子:


    失败的样子,就是黑色字体。Targets:none


    具体可以参考:https://www.jianshu.com/p/13d3c2fa5412

    展开全文
  • 假设我用vue开发了一个web应用,需要在手机微信里访问并调试, 可以按照本文介绍的步骤,使用微信开发者工具调试. 假设我的web应用的访问入口是如下公众号菜单的"预约"按钮: 那么为了能够在微信开发者工具调试,...

    假设我用vue开发了一个web应用,需要在手机微信里访问并调试, 可以按照本文介绍的步骤,使用微信开发者工具来调试.

    假设我的web应用的访问入口是如下公众号菜单的"预约"按钮:

    那么为了能够在微信开发者工具里调试,需要首先进入该公众号的后台,在web开发者工具里,将我本人的微信号添加进去:

    点击"绑定开发者账号":

    输入待绑定的微信账号:

    点击绑定,该微信号会收到一条消息,询问是否绑定:

    点击同意操作完成绑定.

    接下来,把要调试的web应用的url放到微信开发者工具地址栏里,回车之后,微信开发者工具就会弹出一个询问窗口,点击Allow之后,就可以在微信开发者工具提供的类似Chrome开发者工具调试器一样的界面里进行单步调试了.

    这个粘贴到地址栏的url很有讲究。

    https://open.weixin.qq.com/connect/oauth2/authorize?appid=yyyy&redirect_uri=https%3a%2f%2fwww.xxx.com%2fsmart&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect
    其中appid=后面的值,是从微信公众号控制台里拷贝出来的appid:

    redirect_uri, 即为我们开发的web应用,部署到服务器之后生成的url,需要经过url encode处理:https://www.xxx.com/smart

    这个url准备好之后,将其粘贴到微信开发者工具地址栏里,回车,即可看到一个对话窗口,要求获得我们公开信息的许可:

    点击Allow之后,就可以像使用Chrome开发者工具的调试器一样,在微信开发者工具里进行单步调试了:

    要获取更多Jerry的原创文章,请关注公众号"汪子熙":

    展开全文
  • 由于小程序的火爆,于是去开源中国接了个私活,开发...第一步:打断点,我们必须在我们想要它停下来的地方打上调试断点,点击微信开发者工具的左侧的“调试”tab,然后选择中间窗口中的”Sources”Tab,在Sources页中点...

    由于小程序的火爆,于是去开源中国接了个私活,开发一个小程序。于是开始学习微信小程序开发文档,下载微信开发者工具,进行开发了。开发过程中需要调试,开始只是打日志或者断言,觉得很不方便,希望跟IDEA一样的调试器,于是摸索如下:

    第一步:打断点,我们必须在我们想要它停下来的地方打上调试断点,点击微信开发者工具的左侧的“调试”tab,然后选择中间窗口中的”Sources”Tab,在Sources页中点开”Top”根节点,层层打开,找到自己想要调试的js文件,一般是打那种.js后面带[sm],如index.js[sm],非index.js,当然这里之后想修改内容不能在”调试”模式下修改,而要转到”编辑”模式,之前我老容易犯这个错误,打开index.js[sm]文件后,点击左边的行上的数字,就会由灰色背景变成蓝色背景,这样断点就打好了,(如果不想要了,也可以点击就会取消)如下图所示:

     

    第二步:运行,首先点击编译上面的那个运行小图标(或者快捷键ctrl+b),然后操作到你想要的那个界面或者触发某个动作,程序自动会跑到断点处代码,如下图所示:

     

    第三步:单步调试,按调试器窗口(debugger)的向下箭头(step into nextfunction call),一步步的可以往下调试,如果想跳到下一个断点,就按调试器窗口的类似于播放的小按钮,英文叫resume script execution,快捷键为F8或者Ctrl+\,如下图所示

     

    如果想看调试中变量的运行值怎么办?有许多办法,这里以查看上个界面传来的options变量值为例

    办法1:让鼠标指针放在变量上,他会有提示框,框内就是变量值,如下图所示

     

    办法2:使用console.log(options);打印出来,在console窗口可以查看,如下图所示

     

    方法3:在调试器窗口,点开Scope标签,然后再点开相应变量,如下图所示

     

    如果我们的断点过多或者不想它们调试了,怎么让它们失效呢?

    办法就是点击调试器窗口中的图标,英文叫deactive breakpoints(或者快捷键:Ctrl+F8)

    展开全文
  • h5页面需要获取微信用户信息,参考微信开发者文档: 新的改变 我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客: 全新的界面设计 ,...

    微信开发者工具调试微信网页授权,点击‘登录’按钮无效

    问题描述

    h5页面需要获取微信用户信息,参考 微信开发者文档,一步步走到用开发者工具调试页面,却发现点击登录按钮没有反应!如下
    微信授权页面
    看日志信息
    在这里插入图片描述
    好吧,说这个图片路径是http,而应该是https,可是这是微信自己的页面啊,怎么改???
    然鹅不是这个原因,偶然发现点击按钮上边缘是有效的,点击之后重定向页面,跟文档描述的一模一样。为什么点击上边缘有效,而点击按钮无效?如果你也是这样,那么请打开电脑设置—字体大小–看看是不是125%???
    现在,把字体设置成100%,重新打开微信开发者工具,再去调试上面的页面,你会惊喜地发现,点按钮可以了。

    原因

    电脑设置的字体大小(非100%)的时候,会影响微信开发者工具dom节点事件绑定的位置,根据表现来看,并不影响渲染。

    补充一下

    过程中call_me_small_pure的博客 给了很大帮助,感谢!

    展开全文
  • 由于小程序的火爆,于是去开源中国接了个私活,开发...第一步:打断点,我们必须在我们想要它停下来的地方打上调试断点,点击微信开发者工具的左侧的“调试”tab,然后选择中间窗口中的”Sources”Tab,在Sources页中点...
  • 之前下载了微信开发者工具,最近一直提示下载更新。因为嫌麻烦,就没有更新。结果今天微信开发者工具竟然打不开了!好吧!以后还是经常更新比较好!  遇到了微信开发者工具打不开的问题,就重新下载了最新版的微信...
  • 微信开发者工具使用教程 如何上传、发布、审核等 2020年3月31日录 - 微信开发者工具使用教程 01-微信开发者工具的下载和安装 02-微信小程序账号的注册、登录、appid的获取 03-微信小程序开发和公众号开发模式的切换 ...
  • 微信手机端调试工具[下载地址] ...如果安装调试工具-微信Web开发者工具需要卸载以前安装过的微信Web开发者工具(比如小程序-微信Web开发者工具),建议使用腾讯管家之类的清理干净。2.安装好后,选择移动调试,X5 Blin
  • 今天新弄了个企业微信,在使用微信开发者工具调试的时候,遇到了如下的问题: 在网上找了下教程,发现全都是旧版本的解决方法不适用。这里介绍下新的企业微信的解决方案:1.首先,你必须是这个企业微信的管理员。这...
  • 微信开发者工具调试小程序 webview 页面白屏,但是 date 里面数据一切正常 微信开发者工具不能调试公众号网页,但是打开百度正常 解决方案 这个原因真是微信的锅,让人搞了一上午。微信开发者工具在2019年4月份之后...
  • 强调一下:微信开发者工具可以调试企业微信的自建应用,暂时还不支持调试第三方应用。调试第三方应用时同样也会提示未绑定企业号开发者。 下面将针对如何调试自建应用出现的企业号未绑定问题。 1、首先,将自己...
  • 使用微信开发者工具, 选择微信网页授权, 微信团队为广大的开发者提供了一个测试账号。该帐号无需公众账号,快速申请接口测试,直接体验和测试公众平台所有高级接口。这么好用的功能,只需要要你有一个手机,手机上...
  • 使用微信web开发者工具调试微信企业号页面(前端页面,已发布在服务器上的)前几天写了一篇使用fiddler调试微信页面的,然后博友评论说使用fiddler太麻烦了,推荐使用微信web开发者工具调试微信页面,这两天弄着玩...
  • 更改本机默认localhost域名来进行微信开发者工具调试等 1、打开C:\Windows\System32\drivers\etc下的hosts文件 2、然后更改对应的域名即可 例子: 3、对于vue项目:在vue项目里的vue.config.js文件里的devServer...
  • 1.将安装好的 微开发者工具移动到没有中文路径的地址,然后将 微信开发者工具.exe 更改为英文名字,然后发送到桌面快捷方式 2,按照谷歌配置可跨域的方法配置 配置方法(配置的时候请保证 你的软件在关闭状态) ...
  • 微信开发者工具-调试调试器常用的 6 大功能模块有:Console、Sources、Network、Appdata、Storage、Wxml Console Console有两大功能: 1)开发者可以在此输入和调试代码  2)小程序的错误输出,会显示...
  • 亲身经历解决方案:1.电脑重启。...上周微信开发者工具一直没有办法打开页面,本来打算写一篇关于小程序的文章,结果等了半天试了好几次都是这样的界面,临近下班就没有在意了,今天来打开电脑还是...
  • 最近几天没关电脑,发现微信开发者工具非常卡顿,于是重启了一下,这一重启不要紧,打开了好几次都打不开,查看任务管理器,发现有一大堆微信开发者工具的进程,所以程序是运行了,但是界面没打开..上网查了一下,重启系统,重...
  • 打开微信开发者工具 创建第一个小程序 步骤: 打开微信开发者工具 使用微信扫码登录 点击小程序-创建小程序 项目名 项目路径 appid 不使用云服务器 语言: javascript...
  • 然后我们还研究学习了微信开发者工具的用法,关于.js/.json/.wxml/.wxss这四种文件的用法介绍。还有其中一些页面的创建、代码的编辑调试等功能。今天的主要工作就是学习微信开发者工具的使用。明日计划将具体进行...
1 2 3 4 5 ... 20
收藏数 23,804
精华内容 9,521
关键字:

微信开发者工具 调试微信页面