如何本地调试微信登录

Posted by 杨青波 on 2021-01-19

申请微信登录的前置条件

  1. 你必须有一个已经在公网可以访问的域名网址,并且是有内容的,在开发前期可以只有一个 index.html 也是没有关系的,只要网站域名过审了就行.
  2. 你需要在微信开放平台申请创建一个应用,不管你是创建手机应用, 网页, 微信小程序,都需要申请创建.
    申请创建应用过程中你需要注意以下几点:
  • 申请微信开发者账号不能是私人邮箱,必须绑定的是公司邮箱
  • 需要上传一个网站登录表,里面是你公司的一些信息。(如果是个人的话不行,可以借助一些第三方公司注册)
  • 创建应用中以网页举例:你需要填写正确的回调域(即微信登录后跳转的页面,一般为你网站的主页,如果 www.tultuq.com)

以下是最终微信审批通过后的应用详情:

开发一个微信登录的接口

  1. 申请好微信登录后,过个一两天微信会审批通过,你可以拿到 appID 和 appSecret,你可以在应用程序中使用
  2. 开发一个微信登录的功能,这里我省略掉了,不是本章的重点,如果有小伙伴有兴趣评论区留言可以考虑出一期.

本地调试微信登录

  1. 开发好以后修改本地机器的 hosts 文件(windows 中在 C:\Windows\System32\drivers\etc\hosts ,Linux 和 Mac 中在 /etc/hosts),在其中添加一调记录(这里依然以上面 www.tultuq.com 为例):

下图即为我本地调试网站微信登录的截图,可以看到顺利的跳转到了微信登录:

以及本地idea中可以看到有微信登录log打出:

xml 127.0.0.1 www.tultuq.com

tips: hosts文件的用处: 就是加快域名解析,在外面访问网址前先通过 hosts 的映射,如果有命中的话就不会去访问网络中 DNS 服务器解析域名了.所以我们在 hosts 文件中添加了上述配置,可以在外面访问 www.tultuq.com 网址时直接访问 127.0.0.1(本地).

  1. 如果你是后台去访问微信登录的话,可以将启动端口设置为 80 端口(这是访问万维网的默认端口),这样你访问后台微信登录接口即可直接使用 www.tultuq.com 加上后台接口的路径即可本地访问微信登录成功了.

结束语

  • 以上全文皆是我闲暇时刻顺手写下,后续会添加一些流程的图片,如有不足请多指教.
  • 如果你还有其他疑问,可以 email 或者 github 给我留言
  • 如果觉得本篇文章不错的话,支持一下吧.


支付宝打赏 微信打赏

赞赏一下