最近公司开发微信小程序,主要负责了后端业务和前端交互,整理一下初次开发小程序的一些问题。
1、小程序登录流程
通过官网文档“登录流程时序图”我们可以看到小程序登录流程主要包括:
1、wx.login()方法获取临时登录凭证code
2、wx.request()方法发起后端请求,传入code值;后端通过auth.code2Session去获取session_key+openid
3、后端将openid和业务用户结合,根据自身的业务场景返回“自定义登录态”,例如我们目前就是用JWT生成的token
4、后续的后端请求,就携带token进行用户验证
2、wx.login()方法获取临时登录凭证code
微信发起请求是参考简书上一篇文章封装的方法,感谢!附上链接:https://www.jianshu.com/p/ad1e5b581e18
wx.login({
success: res => {
//自己封装的请求方法
api.post('/auth/login/applets', {
code: res.code
}).then(result => {
//将token存入微信缓存中
wx.setStorageSync('token', result.token)
})
}
})
3、后端像微信服务器发起auth.code2Session请求
查看微信开放文档,传入参数主要有四个,其中grant_type值是固定的。appid和secret都是微信小程序开发者信息。可以自行注册,我们学习的时候可以通过测试号获取。
3.1、将appid和secret写入application.yml配置文件,通过ConfigurationProperties获取
@Component
@Data
@ConfigurationProperties(prefix = "wechat")
public class WeChatConfig {
private String appid;
private String secret;
}
3.2、RestTemplate 发起请求,方便演示直接写在了controller层
@RestController
@RequestMapping("/auth")
public class WeChatController {
@Autowired
private RestTemplate restTemplate;
@Autowired
private WeChatConfig weChatConfig;
@ApiOperation(value = "小程序账号登录", notes = "创建Token,需要提供微信临时登录凭证!")
@PostMapping("/login/applets")
public ResponseEntity<TokenModel> appletsLogin(@RequestBody AppletsLoginModel appletsLoginModel) {
String url = "https://api.weixin.qq.com/sns/jscode2session?appid={appid}&secret={secret}&js_code={code}&grant_type=authorization_code";
Map<String, String> requestMap = new HashMap<>();
requestMap.put("appid", weChatConfig.getAppid());
requestMap.put("secret", weChatConfig.getSecret());
requestMap.put("code", code);
ResponseEntity<String> responseEntity = restTemplate.getForEntity(url, String.class,requestMap);
JSONObject jsonObject=JSONObject.parseObject(responseEntity.getBody());
String openId=jsonObject.getString("openid");
String session_key=jsonObject.getString("session_key");
//自定义方法用openId和session_key换取token
TokenModel tokenModel=new TokenModel()
return ResponseEntity.status(HttpStatus.OK).body(tokenModel);
}
前端正常接收到token,并存入微信缓存中,整个登录流程完结。在自定义封装的api请求中,在header中加入token即可。