【Spring Boot 快速入门】二十一、基于Spring Boot 开发一个微信小程序

本文涉及的产品
云数据库 RDS MySQL,集群系列 2核4GB
推荐场景:
搭建个人博客
RDS MySQL Serverless 基础系列,0.5-2RCU 50GB
.cn 域名,1个 12个月
简介: 【Spring Boot 快速入门】二十一、基于Spring Boot 开发一个微信小程序

前言


  嗨,大家好,现在微信使用的用户很多,作为开发人员也可以建立一个自己的微信小程序,本期与大家分享一下作者建立微信小程序的开发流程。


申请


百度搜索微信公众号平台,然后扫码登录注册一个微信公众号,image.png

  进入申请页面之后,需要及时完善小程序相关信息。


image.png


首次进行微信小程序的开发,需要在开发者管理中,找到开发者设置中可以查看我们需要的开发者ID,开发者ID主要包含:AppID(小程序ID)和AppSecret(小程序密钥),需要注意的是出于安全考虑,AppSecret不再被明文保存,忘记密钥请点击重置,因此我们申请了和AppSecret之后,需要记录下来,如果忘记的话,就需要重新申请可能导致线上项目失效。

  在开发者ID最下面,可以设置常用的域名信息。需要注意的是所有设置的域名必须是HTTPS的域名,设置好域名之后就可以开发微信小程序啦。

image.png


开发


后端


  开发微信小程的后端框架选择,本次开发一个【在线实用工具箱】,主要是供个人使用的,所以后台就选择了Spring Boot 作为基础进行开发,数据库是使用MySQL。整个项目的目录如下所示。


image.png


 整个后端的项目开发与正常项目开发一致,主要是给小程序提供服务接口信息。目前已经实现的主要功能:服装尺码对照表、谚语大全、车牌查询、全国邮编查询、全国区号查询、好玩手持弹葆、BM计算器、数字转大写、笑话大全、生肖查询、血遗传查询、历史朝代表等功能,更多功能正在完善中。

  需要特别注意的是,在有用户输入新碟接口中,需要对输入信息进行敏感词校验,否则在审核的过程中无法通过。小程序为我们提供了敏感信息校验的接口,这个接口是免费的,因此直接调用即可。


检查一段文本是否含有违法违规内容调用接口代码如下:


Map<String,String> map = new HashMap<>();
map.put("content",text);
String post1 = HttpUtil.post(postUrl+token,
        JSON.toJSONString(map));
log.info("请求参数是:{},数据校验返回信息是:{}",text,post1);
JSONObject jsonObject = JSONObject.parseObject(post1);
int code = (int) jsonObject.get("errcode");
if(code==0){
    return "0";
}else {
    return "1";
}


 由于需要与微信小程序进行交互,因此在配置文件中需要把经常使用的微信服务的后台地址配置在配置文件中,当调用时直接取值即可。 application.properties配置文件如下


server.port=8080
# mysql
spring.datasource.url=jdbc:mysql://127.0.0.1:3306/test?useSSL=false&useUnicode=true&characterEncoding=utf8&allowMultiQueries=true&serverTimezone=Asia/Shanghai
spring.datasource.username=test
spring.datasource.password=123456
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
spring.datasource.type=com.alibaba.druid.pool.DruidDataSource
mybatis.mapper-locations=classpath*:mapper/**/*.xml
# 开启swagger bootstrap ui
swagger.enable=true
#swagger.enable=true
wx.access_token_url=https://api.weixin.qq.com/cgi-bin/token
wx.access_token_grant_type=client_credential
wx.access_token_appid=wx123456789
wx.access_token_secret=2e741123456789
wx.access_token_post=https://api.weixin.qq.com/wxa/msg_sec_check?access_token=
wx.access_token_rk_url=https://api.weixin.qq.com/cgi-bin/token
wx.access_token_grant_rk_type=client_credential
wx.access_token_rk_appid=wx0123456789
wx.access_token_rk_secret=430c123456789
wx.access_token_rk_post=https://api.weixin.qq.com/wxa/msg_sec_check?access_token=

  

在与微信小程序交互的过程中,需要根据appid和secret去获取当前请求的小程序的token。在请求其他服务的过程中需要使用到token信息。例如下面进行的敏感文本信息校验功能等。


public String getToken(){
    String token = HttpUtil.get(url+"?grant_type=" + type + "&appid=" + appid + "&secret=" + secret);
    log.info("获取token返回信息是:"+token);
    JSONObject jsonObject1 = JSONObject.parseObject(token);
    String accessToken = (String) jsonObject1.get("access_token");
    return accessToken;
}


 后台使用的都是最基础的服务,主要是为小程序提供接口,启动项目之后,在Swagger中可以看到所有的接口信息。


image.png


调用一下查询车牌归属地的接口,输入北京,可以看到北京地区的车牌归属地信息已经正常返回即可为微信小程序提供查询服务。


image.png


前端


  上面的接口服务已经开发完成了,下面将基于微信开发者工具进行前端的开发,前端采用ColorUI组件库进行开发,在配置文件中引入即可使用。整体的开发页面如下图所示。


image.png


 需要注意的是在本地调试的过程中如果遇到无法访问服务接口的情况,需要在详情,本地配置中选择不校验合法域名这一条,否则本地的基本上请求不到服务。


image.png


 将上面后台中的本地服务启动,然后将域名信息配置到app.js中。这样就可以全局使用host: "http://localhost:8080"。如下图:


image.png


点击其中的一个页面,输入查询数据,可以看到正常访问到数据了,可以正常访问喽。


image.png


结语


  好了,以上就是基于Spring Boot 开发一个微信小程序的过程



目录
相关文章
预约按摩小程序开发,为什么很多上门按摩平台根本招聘不到优秀技师?
上门按摩平台面临招不到优秀技师的问题,主要原因是平台众多,技师选择多样。为解决此问题,平台可引入技师等级制度,根据订单数量和好评率划分高、低等级技师。高等级技师可享受70%-90%的高提成及首页推荐,这不仅能激励技师的积极性,还能帮助平台筛选出优质技师,提升服务质量和口碑,形成良性循环。
|
1月前
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
512 7
|
1月前
|
小程序 搜索推荐 数据挖掘
跳绳打卡小程序开发多钱费用
跳绳打卡小程序通过智能手机即可轻松使用,无需额外设备,只需一根跳绳即可开始您的健康之旅。它结合了便捷性、互动性和个性化设置,让跳绳这项运动变得更加有趣和高效
|
1月前
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
614 1
|
21天前
|
人工智能 小程序
【一步步开发AI运动小程序】五、帧图像人体识别
随着AI技术的发展,阿里体育等公司推出的AI运动APP,如“乐动力”和“天天跳绳”,使云上运动会、线上健身等概念广受欢迎。本文将引导您从零开始开发一个AI运动小程序,使用“云智AI运动识别小程序插件”。文章分为四部分:初始化人体识别功能、调用人体识别功能、人体识别结果处理以及识别结果旋转矫正。下篇将继续介绍人体骨骼图绘制。
|
21天前
|
人工智能 小程序 vr&ar
AI运动小程序开发常见问题集锦二
截至当前,我们的AI运动识别小程序插件已迭代至第23个版本,广泛应用于健身、体育、体测、AR互动等场景。本文针对近期用户咨询,汇总了常见问题,帮助用户减少开发成本,提高效率。主要涵盖计时与计数模式的区别、综合排行榜生成方法、全屏模式适配及无开发能力用户的解决方案。
|
21天前
|
小程序 数据挖掘 UED
开发1个上门家政小程序APP系统,都有哪些功能?
在快节奏的现代生活中,家政服务已成为许多家庭的必需品。针对传统家政服务存在的问题,如服务质量不稳定、价格不透明等,我们历时两年开发了一套全新的上门家政系统。该系统通过完善信用体系、提供奖励机制、优化复购体验、多渠道推广和多样化盈利模式,解决了私单、复购、推广和盈利四大痛点,全面提升了服务质量和用户体验,旨在成为家政行业的领导者。
|
1月前
|
存储 传感器 小程序
跳绳计数小程序开发系统
首先,我们需要明确跳绳计数小程序的核心功能:为用户提供跳绳计数的便捷方式。这意味着小程序需要能够准确地记录用户的跳绳次数,并为用户提供清晰、直观的计数展示。
|
1月前
|
人工智能 编解码 小程序
【一步步开发AI运动小程序】四、小程序如何抽帧
随着AI技术的发展,阿里体育等公司推出的“乐动力”、“天天跳绳”等APP使云上运动会、线上健身等概念备受关注。本文将引导您从零开始开发一个AI运动小程序,利用“云智AI运动识别小程序插件”。文中详细介绍了微信小程序抽帧的相关API、设置及注意事项,帮助开发者更好地实现AI运动功能。下篇将介绍人体识别技术,敬请期待。
|
1月前
|
传感器 存储 小程序
跳绳计数小程序开发
跳绳计数小程序旨在通过智能设备(如手机或智能手表)记录用户在跳绳过程中的次数、时间、速度等关键数据,为用户提供便捷的运动记录和数据分析服务

热门文章

最新文章