[solved] how to debug the official account of Wechat locally

Business background

using vue+webpack to develop official account

  1. Local server started localhost:8080 for development and debugging
  2. data is obtained from remote url www.test.com
  3. after directly disabling the cross-domain of chorme locally, you can debug locally

problem description

but when I need to call Wechat-related interfaces, I must debug
under Wechat developer tool , but Wechat developer tool does not set cross-domain function
, so I will report an error

when I use localhost:8080 to get remote www.test.com interface data.

the environmental background of the problems and what methods you have tried

  1. try to download QQ Browser it is said that there is a Wechat debugging tool, but can not find
  2. Native hosts mapping, but mapping always fails

related codes

/ / Please paste the code text below (do not replace the code with pictures)

what result do you expect? What is the error message actually seen?

how can I debug remotely locally without uploading the front-end code to a remote server?

solve

  • right-click developer tool shortcuts-> Click Properties
  • Click Shortcut-> Click destination
  • -- args-- disable-web-security-- user-data-dir paste this line of code after the path
  • reopen developer tools, and cross-domain problems will be eliminated

example:

  1. configure the domain name related to Wechat as home.example.com
  2. DNS resolution service provider resolves domain names to native IP (port mapping is required if intranet is required) or sets hosts home.example.com 127.0.0.1
  3. set port 0.0.0.0 li 80 in vue-cli to debug < / debug >
  4. Wechat developer tool uses home.example.com to access local dev

Wechat developer tools can be set across domains like chomre


excuse me, has the problem of the subject been solved? I used natapp to do the mapping. I can open the local project with the authorized domain name, and I can also get code, but the other interfaces are not working, so I can't call

.
Menu