开发前准备
微信公众平台微信公众平台,给个人、企业和组织提供业务服务与用户管理能力的全新服务平台。https://mp.weixin.qq.com/申请注册个服务号,并且需要微信认证,注意个人公众号无法开通这个功能,因为个人就不给做微信认证。
但如果只是想跑下流程,试下这个功能,可以通过
微信公众平台https://mp.weixin.qq.com/debug/cgi-bin/sandboxinfo?action=showinfo&t=sandbox/index开个测试的公众账号跑通流程
测试号跟正式号有个小的差别在于:正式号在获取access_token之前,需要配置服务器的ip白名单
开发流程
主要是3个点,第一个是通过appid和secret获取access token,用于第二步生成带参数的二维码,第三步就是在服务端监听推送事件,看看有没有人扫码。
(1)获取Access token
微信开放文档微信开发者平台文档https://developers.weixin.qq.com/doc/offiaccount/Basic_Information/Get_access_token.html
主要是拼接这么个get请求
https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
curl "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET"
(2)生成带参数的二维码
微信开放文档微信开发者平台文档https://developers.weixin.qq.com/doc/offiaccount/Account_Management/Generating_a_Parametric_QR_Code.html
按文档描述的先拼接个post请求获取ticket
curl -X POST -H "Content-Type: application/json" -d '{"expire_seconds": 604800, "action_name": "QR_SCENE", "action_info": {"scene": {"scene_id": 123}}}' "https://api.weixin.qq.com/cgi-bin/qrcode/create?access_token=TOKEN"
得到ticket后把ticket给到客户端,客户端用ticket拼出个二维码图片的url,展示出来即可
https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=gQEV8DwAAAAAAAAAAS5odH
(3)接收事件推送
配置接收事件推送的地址
这里的url就是接收推送的url,token是随便填。但你直接配置,都会出现配置失败,因为配置的时候他就去校验这个地址跟这个token是否准确。
所以在配置之前,你需要让这个地址的get请求符合
接入概述 | 微信开放文档
这里面的要求,让微信信任这个接口。
<?php
if ($_SERVER['REQUEST_METHOD'] === 'Get'){//配置接入时验证
$signature = $_GET["signature"];
$timestamp = $_GET["timestamp"];
$nonce = $_GET["nonce"];
$echostr = $_GET["echostr"];
$token = "xxxxx";
$tmpArr = array($token, $timestamp, $nonce);
sort($tmpArr, SORT_STRING);
$tmpStr = implode( $tmpArr );
$tmpStr = sha1( $tmpStr );
if( $tmpStr == $signature ){
print($echostr);
}else{
print("验证失败!");
}
}
if ($_SERVER['REQUEST_METHOD'] === 'POST'){//推送业务处理
$rawPostData = file_get_contents('php://input');
// 将内容写入文件
print( $rawPostData);
}
?>
推送的时候也是往这个地址以post的方式推过来,具体的内容参考微信的
关注/取消关注事件 | 微信开放文档
对收到推送的xml进行解析,实现登录
一些微信自带的测试工具
微信调试工具
微信公众平台接口调试工具
参考:
node.js+vue+mongodb实现通过微信公众号扫码登录(完整易懂)_vue扫码登录功能-CSDN博客
前端vue+后台node实现获取微信用户基本信息+调用微信JS-SDK(上篇)_获取微信用户信息-CSDN博客
https://www.cnblogs.com/YangRoc/p/17186129.html#%EF%BC%882%EF%BC%89%E7%94%9F%E6%88%90%E5%B8%A6%E5%8F%82%E6%95%B0%E7%9A%84%E4%BA%8C%E7%BB%B4%E7%A0%81