ruoyi的springboot微信小程序登录实现方式

这篇具有很好参考价值的文章主要介绍了ruoyi的springboot微信小程序登录实现方式。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。


前言

主要是讲ruoyi前后端分离框架,springboot的微信小程序的实现方式,ruoyi的登录一般只针对账号密码登录,微信小程序登录却没有,实际上稍微改造一下就可以用。


一、微信小程序的登录接口

根据微信开放文档,微信有提供自己的登录接口,可用于现有的微信用户,并且授予基本信息

GET https://api.weixin.qq.com/sns/jscode2session
入参如下:

属性 类型 必填 说明
appid string 小程序 appId
secret string 小程序 appSecret
js_code string 登录时获取的 code,可通过wx.login获取
grant_type string 授权类型,此处只需填写 authorization_code

这个接口就是咱们要的登录接口,但是需要有js_code才行,这个js_code我们一般要前端返回即可,至于appid和secret需要去微信公众平台那边获取,一般需要有开发者权限(在管理者的手上)

返回的类型我就不写那么详细了,咱们需要openid也就是用户唯一标识,这个咱们需要存到数据库里面,以及用openidsessionKey作为账号密码登录

二、微信用户数据库设计

代码如下:

CREATE TABLE `wechat_user` (
  `userId` bigint NOT NULL AUTO_INCREMENT COMMENT '自增主键',
  `openid` varchar(50) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NOT NULL COMMENT '用户的唯一标识',
  `unionid` varchar(50) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL COMMENT '公众号的唯一标识',
  `nickname` varchar(50) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL COMMENT '昵称',
  `name` varchar(30) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL COMMENT '真实姓名',
  `phonenumber` varchar(30) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NOT NULL COMMENT '手机号码',
  `gender` tinyint(1) DEFAULT '0' COMMENT '性别,0-未知 1-男性,2-女性',
  `region` varchar(50) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL COMMENT '地区',
  `avatar_url` varchar(200) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL COMMENT '用户头像URL',
  `subscribe` tinyint NOT NULL DEFAULT '0' COMMENT '是否订阅公众号 0-否 1-是',
  `del_flag` char(1) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NOT NULL DEFAULT '0' COMMENT '删除标志(0代表存在 2代表删除)',
  `create_by` varchar(64) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NOT NULL COMMENT '创建者',
  `create_time` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',
  `update_by` varchar(64) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NOT NULL COMMENT '更新者',
  `update_time` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新时间',
  `remark` varchar(500) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL COMMENT '备注',
  PRIMARY KEY (`id`) USING BTREE,
  UNIQUE KEY `uk_openid` (`openid`) USING BTREE COMMENT '唯一索引,用于加速查找'
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci ROW_FORMAT=DYNAMIC COMMENT='微信用户表';

数据库设计尽量照着ruoyi的格式来,然后一些基本信息看自己需求来,我是偷懒了直接让gpt帮我生成了,最主要的是拿到openid,然后unionid一般也是根据需求来,咱们暂时用不上,不过也会预留字段。

三、springboot登录接口实现

1.新建实体WechatUser

common模块下新建一个WechatUser,和SysUser同级

package com.ruoyi.common.core.domain.entity;

import org.apache.commons.lang3.builder.ToStringBuilder;
import org.apache.commons.lang3.builder.ToStringStyle;

import com.ruoyi.common.core.domain.BaseEntity;


/**
 * 微信用户实体
 * 
 * @author Ricky
 */
public class WechatUser extends BaseEntity
{
    private static final long serialVersionUID = 1L;

    /** 自增主键 */
    @TableId
    private Long id;

    /** 用户的唯一标识 */
    @Excel(name = "用户的唯一标识")
    private String openid;

    /** 微信会话秘钥 */
    @TableField(exist = false)
    private String sessionKey;

    /** 公众号的唯一标识 */
    @Excel(name = "公众号的唯一标识")
    private String unionid;

    /** 昵称 */
    @Excel(name = "昵称")
    private String nickname;

    /** 手机号码 */
    @Excel(name = "手机号码")
    private String phonenumber;

    /** 性别,0-未知 1-男性,2-女性 */
    @Excel(name = "性别,0-未知 1-男性,2-女性")
    private Integer gender;

    /** 地区 */
    @Excel(name = "地区")
    private String region;

    /** 用户头像URL */
    @Excel(name = "用户头像URL")
    private String avatarUrl;
	// 后面跟数据库设计一致
}

2.修改LoginUser类

在com.echain.common.core.domain.model.LoginUser的类加一个wechatUser,生成gettersetter(用了lombok可不加),并且改写getPasswordgetUsername 方法

/**
     * 微信用戶信息
     */
    private WechatUser wechatUser;
    
    public WechatUser getWechatUser() {
        return wechatUser;
    }

    public void setWechatUser(WechatUser wechatUser) {
        this.wechatUser = wechatUser;
    }
    
	@JsonIgnore
    @Override
    public String getPassword()
    {
        return user != null ? user.getPassword() : wechatUser.getSessionKey();
    }

    @Override
    public String getUsername()
    {
        return user != null ? user.getUserName() : wechatUser.getOpenId();
    }

3.增加wxLogin接口

这个接口是为了走SpringSecurity的登录验证方式,跟ruoyi原来的类似

public String wxLogin(String openId, String sessionKey, WechatUser user) {
        LoginUser loginUser = new LoginUser(user);
        UsernamePasswordAuthenticationToken authenticationToken = new UsernamePasswordAuthenticationToken(openId, sessionKey);
        authenticationToken.setDetails(loginUser);
        SecurityContextHolder.getContext().setAuthentication(authenticationToken);
        // 生成token
        return tokenService.createToken(loginUser);
    }

这里是用了微信小程序登录接口返回的openIdsessionKey作为账号密码,由于sessionKey老是变动,咱们就不需要存数据库,而openid是唯一的,需要存数据库

4.微信小程序登录接口

先添加一个调微信小程序提供的开放登录方法

    /**
     * 获取微信小程序的基本信息
     * @param code
     * @return
     * @throws JsonProcessingException
     */
    public static Map<String, Object> getWechatBaseInfo(String code) throws JsonProcessingException {
        // 调用微信认证接口,获取 session_key 和 openid 等信息
        String url = String.format(GET_AUTH_URL, APP_ID, WechatConfig.SECRET, code);
        String response = restTemplate.getForObject(url, String.class);

        return objectMapper.readValue(response, HashMap.class);
    }

其中GET_AUTH_URLAPP_IDSECRETcode是前面说的链接和入参

然后写springboot的登录接口(补充WeChatReq和WechatResp类)

@Data
public class WeChatReq {
    private String code;
    private String jscode;
    private String encryptedData;
    private String iv;
    private String phonenumber;
    private String sessionKey;
}
@Data
public class WechatResp {
    private String code;
    private String jscode;
    private String openId;
    private String unionId;
    private String sessionKey;
    private String accessToken;
}
    /**
     * 小程序登录
     *
     * @param weChatReq 小程序wx.login返回的临时凭证
     * @return
     */
    @PostMapping("/mini/login")
    @Transactional
    public AjaxResult login(@RequestBody WeChatReq weChatReq) {
        // 调用微信认证接口,获取 session_key 和 openid 等信息
        Map<String, Object> resultMap;
        try
        {
            String jscode = weChatReq.getJscode();
            resultMap = getWechatBaseInfo(weChatReq.getJscode());
            String sessionKey = (String) resultMap.get("session_key");
            String openId = (String) resultMap.get("openid");
            // 用户登录凭证(有效期五分钟)
            if (StringUtils.isEmpty(jscode))
            {
                return AjaxResult.error("登录凭证不能为空");
            }
            // 查询是否已存在用户,如果不存在就把微信用户登录记录存储起来,这里我引入了mybatis-plus,如果没有的话可以直接写一个根据openid获取用户信息的方法.
            QueryWrapper<WechatUser> wrapper = new QueryWrapper<>();
            wrapper.eq("openid", openId);
            WechatUser user = userServiceImpl.getOne(wrapper);
            if(Objects.isNull(user)){
                user = new WechatUser();
                    user.setOpenid(openId);
                    user.setCreateBy("mini");
                    user.setCreateTime(new Date());
                    user.setUpdateBy("mini");
                    user.setUpdateTime(new Date());
                    userServiceImpl.insertWechatUser(user);
                }
            }
            WechatResp resp = new WechatResp();
            resp.setJscode(weChatReq.getJscode());
            resp.setCode(weChatReq.getCode());
            resp.setSessionKey(sessionKey);
            resp.setOpenId(openId);
            JSONObject res = new JSONObject();
            // 生成令牌
            String token = loginService.wxLogin(openId, sessionKey, user);
            res.put(Constants.TOKEN, token);
            return AjaxResult.success().put("data", res);
        }
        catch (Exception e)
        {
            String msg = "接口异常";
            if (StringUtils.isNotEmpty(e.getMessage()))
            {
                msg = e.getMessage();
            }
            return AjaxResult.error(msg);
        }
    }

5.开放接口

com.echain.framework.config.SecurityConfig的configure方法放行登录接口,在前面的/login、/captchaImage接口加一个/mini/login(根据自身需求加)

// 对于登录login 验证码captchaImage 允许匿名访问
.antMatchers("/login", "/captchaImage", "/mini/login").anonymous()

到这里就大功告成了,存数据库这个操作我就不详细说了,还有要注意如果没有引入mybatis-plusQueryWrapper那边需要改成根据openid获取用户信息的方法

总结

实现之后,就能跟以前ruoyi的登录,通过token携带来访问接口,要注意的是这边的权限控制就失效了,需要自己改写权限的分配,因为以前是跟着sys_user这个表的用户走的,这里不仔细讲了,一般微信小程序这边不需要做用户角色权限分配,可以自己加一层新的。

参考博客:RuoYi-Vue微信小程序登录授权文章来源地址https://www.toymoban.com/news/detail-779327.html

到了这里,关于ruoyi的springboot微信小程序登录实现方式的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 前端uniapp+后端springboot 详细教程《实现微信小程序授权登录》(附完整前后端项目demo)

    微信小程序官方登录流程图: 参考微信小程序登录官网文档 1、前端技术栈 1.1、uniapp 使用uniapp构建一套代码多端使用的前端框架项目 1.2、前端封装工具 dateUtil.js: 功能: 1. 时间日期格式化 2. 传入日期是否和当前日期的比较 完整代码: requestUtil.js: 功能: 1. 定义公共的

    2024年02月14日
    浏览(37)
  • 【第十八节:微信小程序 常用功能-登录】微信小程序入门,以思维导图的方式展开18

    若图片看不清,可私信给五木大大要高清大图哈。      效果               wxml页面         view class=\\\"login-container\\\"nn    view class=\\\"login\\\" wx:if=\\\"{{ !logged }}\\\"nn        view class=\\\"app-info\\\"nn            image class=\\\"app-logo\\\" src=\\\"../../images/logo.png\\\" /nn            text class

    2024年01月17日
    浏览(46)
  • 微信小程序登录获取用户唯一标识OpenId,(SpringBoot项目)

    微信小程序的登录,需要获取到用户的唯一标识OpenId,这里只涉及到后端代码,所以前提是前端申请了一个小程序并且有了appid和secret。 文章目录 一、微信小程序登录流程 二、代码实现 1.引入相关依赖 2.代码实现 实际项目经验分享 先上官方开发文档连接 小程序登录 | 微信

    2024年02月12日
    浏览(40)
  • SpringBoot整合微信小程序登录获取手机号并解密

    SpringBoot+微信小程序  文章目录: 一、小程序登录获取手机号的流程 二、pom导入所需的依赖包 三、接收微信小程序的参数 四、后端发请求的util工具方法 五、获取手机号的接口 六、请求接口获取的phone_info信息 1.前端请求getPhoneNumber方法获取code传给后端接口; 2.后端接口通过

    2024年02月09日
    浏览(43)
  • 【微信小程序】实现微信小程序登录(附源码)

    通过 点击登录按钮 , 调用微信接口 wx.getUserProfile拿到微信的个人信息,先 检查是否之前已经登录 ,若没登录则将拿到的个人信息调用后台的接口,把个人信息传给后台, 登录成功之后 把相关信息存储在app.globalData中共享给全局使用 (这里使用微信云开发作为后台,提前建

    2024年02月11日
    浏览(30)
  • springboot整合微信(公众号)实现扫码登录(两种方式,两种实现)

    首先说一下这个微信扫码登录它的方式有两种,一种是基于网页的redirect实现,一种是基于公众号推送消息实现, 二者实现的效果是不一样的 贴一个官方文档 需要有自己的域名 (这里你可以使用内网穿透,会生成一个自己的域名,网上一大堆,自己奥利给吧) 需要申请微信认

    2024年01月18日
    浏览(82)
  • node微信小程序登录实现登录

    node微信小程序登录实现登录 好久不见兄弟们这段时间比较忙 需要使用到的模块 废话少说直接上可cv(bai piao)代码 下面展示我的完整代码

    2024年02月09日
    浏览(39)
  • 微信小程序,如何实现登录

    业务流程: 1:首先需要一个按钮触发事件 2:调用微信小程序的登录接口wx.login,拿到code 3:调用微信小程序的获取用户信息的接口wx.getUserProfile,拿到用户的个人信息(包括用的昵称以及头像) 4:拿到的个人信息调用后台的接口,八个人信息传给后台,登陆成功并把相关喜喜

    2024年02月03日
    浏览(31)
  • 微信小程序 如何实现登录

    业务流程: 1:首先需要一个按钮触发事件 2:调用微信小程序的登录接口 wx.login ,拿到code 3:调用微信小程序的获取用户信息的接口 wx.getUserProfile ,拿到用户的个人信息 4: 拿到的个人信息调用后台的接口,把个人信息传给后台,登录成功并把相关信息存储在本地的缓存中

    2024年02月09日
    浏览(73)
  • 微信小程序实现简单登录界面和登录功能

    客户端开发和学习过程中,登录功能是一个很常见的场景。本文将介绍,微信小程序开发过程中是如何实现登录界面和登录功能的。 话不多说,直接上代码。 (1)index.js文件,代码如下: (2)index.wxml文件,代码如下: (3)index.wxss文件,代码如下: 运行结果如下: 本文介绍了微信

    2024年02月12日
    浏览(35)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包