Uniapp + SpringBoot 开发微信H5项目 微信公众号授权登录 JAVA后台(一、配置使用微信公众平台测试公众号)

申请测试号进行调试开发,测试号拥有大部分服务号有的接口权限。

一、接口配置信息填写校验

这里需要填写一个URL和一个Token验证字符串
我这里是用了natapp内网穿透 将本地的后台8080端口服务映射到了 http://x7zws8.natappfree.cc
https://natapp.cn/在natapp官网注册账号并且申请免费隧道
在这里插入图片描述
申请完了之后把域名绑定到自己的后台
在这里插入图片描述
后台接口:

    @RequestMapping(value = "/check", produces = "text/plain;charset=UTF-8", method = {RequestMethod.GET, RequestMethod.POST})//微信服务器根据配置的token,结合时间戳timestamp和随机数nonce通过SHA1生成签名,发起get请求,检验token的正确性,//检验正确原样返回随机字符串echostr,失败返回空字符串public String check(HttpServletRequest request, HttpServletResponse response,@RequestParam("signature") String signature,@RequestParam("timestamp") String timestamp,@RequestParam("nonce") String nonce,String echostr) throws Exception {//若是为get请求,则为开发者模式验证if ("get".equals(request.getMethod().toLowerCase())) {String checkSignature = SHA1.creatSHA1("token", timestamp, nonce);if (checkSignature.equals(signature)) {return echostr;}}return null;}

SHA1:

import java.security.MessageDigest;
import java.util.Arrays;//SHA1加密算法类
public class SHA1 {/**** @param token* @param timestamp 时间戳* @param nonce 随机字符串* @return 安全签名* @throws AesException*/public static String creatSHA1(String token, String timestamp, String nonce) throws AesException{try {String[] array = new String[] { token, timestamp, nonce};StringBuffer sb = new StringBuffer();// 字符串排序Arrays.sort(array);for (int i = 0; i < 3; i++) {sb.append(array[i]);}String str = sb.toString();// SHA1签名生成MessageDigest md = MessageDigest.getInstance("SHA-1");md.update(str.getBytes());byte[] digest = md.digest();StringBuffer hexstr = new StringBuffer();String shaHex = "";for (int i = 0; i < digest.length; i++) {shaHex = Integer.toHexString(digest[i] & 0xFF);if (shaHex.length() < 2) {hexstr.append(0);}hexstr.append(shaHex);}return hexstr.toString();} catch (Exception e) {e.printStackTrace();throw new AesException(AesException.ComputeSignatureError);}}
}

AesException:

public class AesException extends Exception {public final static int OK = 0;public final static int ValidateSignatureError = -40001;public final static int ParseXmlError = -40002;public final static int ComputeSignatureError = -40003;public final static int IllegalAesKey = -40004;public final static int ValidateAppidError = -40005;public final static int EncryptAESError = -40006;public final static int DecryptAESError = -40007;public final static int IllegalBuffer = -40008;private int code;private static String getMessage(int code) {switch (code) {case ValidateSignatureError:return "签名验证错误";case ParseXmlError:return "xml解析失败";case ComputeSignatureError:return "sha加密生成签名失败";case IllegalAesKey:return "SymmetricKey非法";case ValidateAppidError:return "appid校验失败";case EncryptAESError:return "aes加密失败";case DecryptAESError:return "aes解密失败";case IllegalBuffer:return "解密后得到的buffer非法";default:return null; // cannot be}}public int getCode() {return code;}public AesException(int code) {super(getMessage(code));this.code = code;}
}

校验走完之后配置测试号中 网页服务下的网页授权获取基本用户
在这里插入图片描述
在这里插入图片描述

这里填自己前端项目运行后的地址 我的后端项目端口是8080 uniapp前端运行完了之后的端口是8081所以我配置的是本地的ipv4 ip+端口号

二、后端配置 + 拼装URL + 通过Code获取用户OpenID和基本信息

在SpringBoot项目的pom中引入依赖

        <dependency><groupId>com.github.binarywang</groupId><artifactId>weixin-java-mp</artifactId><version>4.6.0</version></dependency>

创建配置类

import com.ruoyi.system.domain.WechatConfig;
import com.ruoyi.system.service.IWechatConfigService;
import me.chanjar.weixin.mp.api.WxMpService;
import me.chanjar.weixin.mp.api.impl.WxMpServiceImpl;
import me.chanjar.weixin.mp.config.WxMpConfigStorage;
import me.chanjar.weixin.mp.config.impl.WxMpDefaultConfigImpl;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;@Configuration
public class WxMpConfig {@Autowiredprivate IWechatConfigService wechatConfigService;@Beanpublic WxMpConfigStorage wxMpConfigStorage() {WxMpDefaultConfigImpl configStorage = new WxMpDefaultConfigImpl();WechatConfig wechatConfig = wechatConfigService.selectWechatConfigById(1L);//我这里是做成了获取数据库中保存的AppID和AppSercret正常情况下写死就可以configStorage.setAppId(wechatConfig.getAppId());configStorage.setSecret(wechatConfig.getAppSecret());return configStorage;}@Beanpublic WxMpService wxMpService(WxMpConfigStorage configStorage) {WxMpService wxMpService = new WxMpServiceImpl();wxMpService.setWxMpConfigStorage(configStorage);return wxMpService;}
}

之后就可以在Controller中正常使用了
/authorize 接口其实只做了一步操作 就是构建获取code的url 构建完成之后返回给前端 前端直接重定向
buildAuthorizationUrl其中的三个参数
第一个是回调地址
第二个填snsapi_base 或者 snsapi_userinfo
snsapi_base 是之能获取到 openid 而 snsapi_userinfo 是可以获取到用户基本信息
snsapi_base是静默获取 而 snsapi_userinfo 需要用户点击授权

@RestController
@RequestMapping("/wx")
public class WeChatController extends BaseController {@GetMapping("/authorize")public AjaxResult test() {WxOAuth2Service oAuth2Service = wxMpService.getOAuth2Service();String redirectUrl = oAuth2Service.buildAuthorizationUrl("http://192.168.1.100:8081", "snsapi_userinfo", null);return success(redirectUrl);}@GetMapping("/userInfo")public AjaxResult userInfo(@RequestParam("code") String code) throws WxErrorException {WxOAuth2Service oAuth2Service = wxMpService.getOAuth2Service();WxOAuth2AccessToken wxMpOAuth2AccessToken = oAuth2Service.getAccessToken(code);logger.info("【wxMpOAuth2AccessToken:】{}", wxMpOAuth2AccessToken);String openId = wxMpOAuth2AccessToken.getOpenId();logger.info("【openid:】{}", openId);WxOAuth2UserInfo userInfo = oAuth2Service.getUserInfo(wxMpOAuth2AccessToken, "zh_CN");logger.info("【用户信息:】{}", userInfo.toString());return success(userInfo);}
}

二、uniapp前端调用

前端首先调用 /authorize 获取拼装好的地址然后重定向并获取code
getUrlCode来判断地址中是否包含code如果有的话拿着code去获取用户基本信息和openid

<template><view class="content"><image class="logo" :src="loginUser.headImgUrl ? loginUser.headImgUrl : '/static/logo.png'"></image><view class="text-area"><text class="title">{{loginUser.openid}}</text></view><button type="default" @click="login">登录</button></view>
</template><script>export default {data() {return {loginUser:{}}},onLoad(query) {const that = this;let code = that.getUrlCode();if (code) {console.log("有code")console.log(code)uni.request({url: "http://192.168.1.100:8080/wx/userInfo",data: {code: code},success(res) {console.log("获取到用户信息")console.log(res.data.data);that.loginUser = res.data.data;}})} else {console.log("没有code")}},methods: {login() {uni.request({url: "http://192.168.1.100:8080/wx/authorize",success(res) {window.location.href = res.data.msg;}})},getUrlCode() {return (decodeURIComponent((new RegExp("[?|&]" + "code" + "=" + "([^&;]+?)(&|#|;|$)").exec(location.href) || [, ""])[1].replace(/\+/g, "%20")) || null);},}}
</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/755120.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Linux(Ubuntu)下安装paddleocr详细教程

PaddleOCR旨在打造一套丰富、领先、且实用的OCR工具库&#xff0c;助力开发者训练出更好的模型&#xff0c;并应用落地。 1、 Ubuntu安装教程&#xff1a; 首先安装paddlepaddle&#xff1a;pip install paddlepaddle -i https://mirror.baidu.com/pypi/simple 一般此项不会报错…

Redis的安装和部署教程(Windows环境)

一、安装Redis服务 1、下载Redis压缩包 以下这个是我网盘里面的&#xff08;这个是v8.0版本的&#xff0c;支持导入.rdb数据文件&#xff09; 链接&#xff1a;百度网盘 请输入提取码 提取码&#xff1a;x0f1 --来自百度网盘超级会员V5的分享 2、解压到文件夹 将下载的压缩…

【书生·浦语大模型实战营】学习笔记2

Lagent&#xff1a;智能体框架&#xff0c;实现将一个大语言模型转化为多种类型的智能体&#xff0c;更好地发挥InternLM的性能 浦语灵笔&#xff1a;视觉语言大模型 InternLM-Chat-7B智能对话Demo 环境准备 使用复制的internlm-demo环境 # 执行该脚本文件来安装项目实验环境…

Apple加速AI大跃进:最新发布的MM1 模型论文

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗&#xff1f;订阅我们的简报&#xff0c;深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同&#xff0c;从行业内部的深度分析和实用指南中受益。不要错过这个机会&#xff0c;成为AI领…

四川宏博蓬达法律咨询有限公司:专业引领,法律护航

在这个法治社会中&#xff0c;法律服务已成为企业和个人不可或缺的重要支持。四川宏博蓬达法律咨询有限公司凭借其专业的服务态度和丰富的法律知识&#xff0c;在法律服务领域独树一帜&#xff0c;赢得了社会各界的广泛认可。 一、公司背景实力雄厚 四川宏博蓬达法律咨询有限公…

电脑怎么快速重装系统win7

电脑重装系统是解决软件问题、提升系统性能的常用手段。随着技术发展,一键重装系统成为了许多用户的首选方法,因为它简化了繁琐的操作步骤,节省了大量时间。尤其是对于非技术人员来说,一键重装提供了一种快速高效且不易出错的系统安装方式。如果你需要快速重装win7,那么可…

2024最新阿里云幻兽帕鲁搭建服务器_Palworld联机多人游戏

玩转幻兽帕鲁服务器&#xff0c;阿里云推出新手0基础一键部署幻兽帕鲁服务器教程&#xff0c;傻瓜式一键部署&#xff0c;3分钟即可成功创建一台Palworld专属服务器&#xff0c;成本仅需26元&#xff0c;阿里云服务器网aliyunfuwuqi.com分享2024年新版基于阿里云搭建幻兽帕鲁服…

易基因:人类大脑的单细胞DNA甲基化和3D基因组结构|Science

大家好&#xff0c;这里是专注表观组学十余年&#xff0c;领跑多组学科研服务的易基因。 高通通量表观基因组分析技术可用于阐明大脑中细胞复杂性的基因调控程序。5-甲基胞嘧啶 (5mCs)是哺乳动物基因组中最常见的修饰碱基&#xff0c;大多数5mCs发生在胞嘧啶-鸟嘌呤二核苷酸&a…

git常见使用

1. 概念 分布式&#xff0c;有远程仓库和本地仓库的概念&#xff0c;因此要注意同步问题git是面向对象的&#xff0c;本质是内容寻址系统。.git目录下有个文件夹objects&#xff0c;存储git库中的对象&#xff0c;git就是根据object建立一种树形结构&#xff0c;将文件和通过h…

spring 没完没了

start 轻量级开源的j2ee框架&#xff0c;容器框架 装javabean aop ioc 定义一个starter的jar包&#xff0c;写一个configuration配置类&#xff0c;将bean定义其中&#xff0c;在starter包的meta-inf/spring.factories中写入配置类&#xff0c;springboot会按约定加载该配置类 …

用户留存【摘录】

留存&#xff0c;是一个产品或者说企业&#xff0c;能够持续存活和不断发展的立身之本。 例如企业级SaaS产品&#xff0c;通常采用按年为单位进行付费的订阅模式。如果产品没有留住用户的能力&#xff0c;用户便会在第二年取消订阅&#xff0c;这将使得企业之前的投入付之东流…

Ubuntu软件开发环境搭建

Ubuntu软件开发环境搭建 安装VMware Tools网络桥接更新软件源常用功能配置时间同步共享文件夹双向复制粘贴终端初始大小和字体设置安装必要的工具 常用指令 安装VMware Tools 点击虚拟机->安装VMware Tools… 打开终端&#xff0c;cd到/media/用户名/VMware Tools/下&#…

语音控制模块_雷龙发展

一 硬件原理 1&#xff0c;串口 uart串口控制模式&#xff0c;即异步传送收发器&#xff0c;通过其完成语音控制。 发送uart将来自cpu等控制设备的并行数据转换为串行形式&#xff0c;并将其串行发送到接收uart&#xff0c;接收uart然后将串行数据转换为接收数据接收设备的并行…

旅游系统-软件与环境

一. 软件 1.Navicat、phpstudy、Idea、Vsode 参考 网盘链接 二.配置文件 1.NodeJS、JDK、Mysql 参考 网盘链接 注意点&#xff1a; 1.Mysql 切记需要环境变量配置 2.数据库密码要好记点的&#xff0c;别乱设 3.环境变量配置的路径要能找到 三.安装运行 1.下载网盘内的软件&am…

Linux docker1--环境及docker安装

一、基础环境要求 Docker分为ce版本&#xff08;免费&#xff0c;试用7个月&#xff09;和ee版本&#xff08;收费&#xff09;。 最低配置要求&#xff1a;64位操作系统&#xff0c;centOS 7及以上&#xff0c;内核版本不低于3.10 二、部署docker 1、查看服务的基础环境是否满…

使用 ONLYOFFICE API 构建 Java 转换器,在 Word 和 PDF 之间进行转换

文章作者&#xff1a;ajun 随着文档处理需求的增加&#xff0c;格式转换成为了一个重要的需求点。由于PDF格式具有跨平台、不易被篡改的特性&#xff0c;将Word格式(.docx)转换为PDF格式(.pdf)的需求尤为强烈。ONLYOFFICE作为一个强大的办公套件&#xff0c;提供了这样的转换功…

C语言数据结构与算法笔记(排序算法)

排序算法 基础排序 冒泡排序 核心为交换&#xff0c;通过不断进行交换&#xff0c;将大的元素一点一点往后移&#xff0c;每一轮最大的元素排到对应的位置上&#xff0c;形成有序。 设数组长度为N&#xff0c;过程为: 共进行N轮排序每一轮排序从数组的最左边开始&#xff0…

Django templates 存放html目录

模板 一概述 模板由两部分组成&#xff0c;一部分是HTML代码&#xff0c;一部分是逻辑控制代码&#xff08;变量&#xff0c;标签&#xff0c;过滤器&#xff09; 作用&#xff1a;可以通过一些逻辑控制代码减少一些重复的操作更快速的生成HTML代码&#xff0c;并且实现简单的…

基于Spring Boot的宿舍管理系统

摘 要 随着信息时代的来临&#xff0c;过去的传统管理方式缺点逐渐暴露&#xff0c;对过去的传统管理方式的缺点进行分析&#xff0c;采取计算机方式构建宿舍管理系统。本文通过课题背景、课题目的及意义相关技术&#xff0c;提出了一种楼宇信息、宿舍信息、宿舍安排、缺勤信息…