微信公众号-测试号

原创于 2023-03-11 20:44:15 发布 · 2.4k 阅读

4 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#vue.js #前端

最近碰到了一个H5的公众号项目，需要openid来判断用户是否存在。视乎好多年都没碰这玩意了，完全忘记了，挨着看文档，一路各种坑，好不容易用测试号把本地测试环境调通了。环境不同可能使用的方法方式都不一样。

微信测试号

需要微信扫码登陆

1、获取到appID appsecret

2、接口配置

URL：本地的java项目写了个GET方法本地地址：192.168.0.20:8904/h5/checkSignature

@ApiOperation(value = "微信验证", notes = "微信验证", httpMethod = "GET")
    @GetMapping(value = "/checkSignature", produces = "application/json;charset=utf-8")
    @RequrieAuth(needLogin = false,noValidate = true)// //不需要sign验证
    public String checkSignature(String signature,String timestamp,String nonce,String echostr) {
        return echostr;//没有写验证，直接返回
    }

验证方法，没有写，挺麻烦的，赶时间。直接返回了。

环境：

阿里云外网固定IP，本地服务器固定IP

阿里云用nginx，访问域名（test.yuming.com）端口（80）的时候转发到本地服务器的（8094端口），然后通过交换机把（8904端口）映射到我本地192.168.0.20（8904端口），因为我本地程序运行就是8904端口。

server {
        listen 80;
        server_name test.yuming.com;    
        resolver 127.0.0.1 valid=3600s;
        client_max_body_size 100m;
        location / {
            proxy_pass   http://本地服务器IP:8094;
        }
    }

接口配置：

URL http://test.yuming.com/h5/checkSignature

Token XXXX 随意（英文/数字）

提交的时候会来访问这个域名，只要是通的，就能保存通过。

通过后就视乎没用，也不知道到底有什么用，有没有用。

3、JS接口安全域名

貌似用不到线不管

4、测试号扫描二维码，关注一下，用户列表自动出现

5、绑定授权回调域名

注意：不能有http https / 之类的。开始就是写了http啃了好久文档

6、修改hosts文件

192.168.0.20 test.yuming.com  让本地访问test.yuming.com实际是192.168.0.20

7、nginx修改端口映射

在本地装了一个nginx，修改下配置文件运行起，注意目录不能有中文

依然是访问test.yuming.com的80端口的时候，访问到5173端口上去。

192.168.0.20:5173是HBuilder X运行的H5项目

server {
        listen 80;
        server_name test.yuming.com;    
        resolver 127.0.0.1 valid=3600s;
            client_max_body_size 100m;
        location / {
            proxy_pass   http://192.168.0.20:5173;
        }  
    }

在微信开发者工具运行test.yuming.com/XXX页面，做了一个自动跳转到下面地址（前端运行）

https://open.weixin.qq.com/connect/oauth2/authorize?appid=XXXXXXXXXX&redirect_uri=test.yuming.com/yyyy&response_type=code&scope=snsapi_base

这里使用静默跳转了下，浏览器上看着显示了上面这段，然后立马就再次跳转到test.yuming.com/yyyy?code=xxxxxxxxxxxxxxx 这个参数就是获取到的code

scope=snsapi_base | snsapi_userinfo

应用授权作用域，snsapi_base （不弹出授权页面，直接跳转，只能获取用户openid），snsapi_userinfo （弹出授权页面，可通过 openid 拿到昵称、性别、所在地。并且，即使在未关注的情况下，只要用户授权，也能获取其信息）

state 可以不传

redirect_uri 回调页面，test.yuming.com/yyyy 使用encodeURIComponent方式进行url编码

然后再通过调用code去（服务端）调用通过 code 换取网页授权access_token 的接口，顺利拿到了openid

大致记录下。。。免得忘记了。。。