Shulou(Shulou.com)06/01 Report--

How to use Wechat developer tools to debug web pages visited on WeChat? for this question, this article introduces the corresponding analysis and solutions in detail. I hope it can help more partners who want to solve this problem to find a simpler and easier way.

Suppose I developed a web application in vue that needs to be accessed and debugged in Wechat and debugged using Wechat developer tools.

So in order to debug in the Wechat developer tool, you need to first go to the official account backend and add my WeChat account in the web developer tool:

Click "bind developer account":

Enter the Wechat account to be bound:

Click bind, and the WeChat account will receive a message asking whether to bind:

Click agree to complete the binding.

Next, put the url of the web application to be debugged into the address bar of the Wechat developer tool. After you enter, the Wechat developer tool will pop up an inquiry window. After clicking Allow, you can step into the interface provided by the Wechat developer tool similar to the Chrome developer tool debugger.

This url pasted to the address bar is very particular.

Https://open.weixin.qq.com/connect/oauth3/authorize?appid=yyyy&redirect_uri=https%3a%2f%2fwww.xxx.com%2fsmart&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect

The value after appid= is the appid copied from the official account console of Wechat:

Redirect_uri, that is, the url generated after the web application we developed is deployed to the server, needs to be processed by url encode: https://www.xxx.com/smart

Once the url is ready, paste it into the Wechat developer's tool address bar, enter, and you will see a conversation window asking for permission to disclose our information:

After clicking Allow, you can step into the Wechat developer tool just like the debugger using the Chrome developer tool:

This is the answer to the question on how to use Wechat developer tools to debug the web pages accessed on WeChat. I hope the above content can be of some help to you, if you still have a lot of doubts to be solved. You can follow the industry information channel for more related knowledge.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.