目录

微信小程序开发-后端Java篇

微信小程序开发 ——(后端Java篇)

介绍:

此程序为转盘抽奖demo,设计前后端交互以及上线运营服务器部署等大致流程(本篇为后端Java篇,将尽量以最简化的步骤来记录),观看此文章的小伙伴都默认为有一定的前后端以及部署项目等知识储备。

一,拉取一套ruoyi模板代码 本次演示为springboot版本

1,增加三个接口基本可以满足抽奖小程序调用需求

(1-保存微信用户信息 2-查询微信用户信息 3-查询奖品信息)

https://i-blog.csdnimg.cn/blog_migrate/a44d635b5b4b16db1ca13bec2cf36dbc.png

2,数据库使用的时MySQL 设计了两张表(分别为奖品表和用户表)

https://i-blog.csdnimg.cn/blog_migrate/ed430e2a5216f510a33ae474aeb7b20b.png

https://i-blog.csdnimg.cn/blog_migrate/2d78ef0a5e77c8e5be42a3309618757e.png

3.openID 根据微信小程序文档可知这个参数为用户登录该小程序的唯一标识 所有操作基本都是围绕此字段展开

二,设计流程以及接口作用

1,用户登录登录小程序将进行身份验证,查询该用户是否登陆过本程序

2,未登录:强制进行登录 通过微信小程序中 wx.getUserInfo 例:

wx.getUserInfo({

success: function (res) {

console.log(res.userInfo);

},

fail: function (err) {

console.error(err);

}

}); (使用该API可以获取到用户的详细信息,如头像、昵称、性别等;)

判断是否授权API:wx.getSetting 例:

wx.getSetting({

success: function (res) {

if (res.authSetting[‘scope.userInfo’]) {

// 已授权

} else {

// 未授权

}

},

fail: function (err) {

console.error(err);

}

});

3.已登录(通过后台接口 根据唯一的openID查询数据库后返回)

该接口返回的该用户的所有信息(例:抽奖次数以及奖品表的外键 如已抽过奖可以限制抽奖次数 中奖信息也可以通过页面展示回显)

https://i-blog.csdnimg.cn/blog_migrate/0245af2cb6051535e3925f12d4e6c069.png

4.奖品列表数据通过奖品表接口返回数据和图片等信息 表盘为空表图 通过小程序开发工具的wxss设置样式分成6等份并旋转

https://i-blog.csdnimg.cn/blog_migrate/bbebc61170189ff222b75699e2631b40.png

https://i-blog.csdnimg.cn/blog_migrate/c3437c878b766eefac8dfcbf1f58762e.png

https://i-blog.csdnimg.cn/blog_migrate/41df81c3b4cb014db062b04e17d8e578.png

5.通过校验码验证之后开始抽奖 并等抽奖结束将用户信息返回更新用户表(包括奖品 是否抽奖 抽奖次数 使用过的校验码集合等关键数据)

此图为半成品演示图(功能逻辑已经完善 细节还需打磨)

后端通过idea提供图片和功能接口 至此还不能调用后端接口

,小程序开发工具会一直报调用后端接口异常( http://localhost:8080/xxx   不在以下 request 合法域名列表中) 即使本人通过内网穿透工具将端口映射到外网还是不行 只能用正规备案过的域名才可以正常调用。

https://i-blog.csdnimg.cn/blog_migrate/31a438f395552e2445143e562f411b00.png

https://i-blog.csdnimg.cn/blog_migrate/1001112c39f22b8aa9ff353dc84820a2.png

至此,后端Java逻辑基本成型,调用接口是整个开发过程中耗费时间最长的步骤,下篇为服务部署篇,将会重点描述,敬请移步。