最近在辅导学生毕业设计和接一些企业级小程序项目时发现很多同学对如何将 SpringBoot 后端与微信小程序前端进行完整对接感到棘手尤其是涉及商品交易、订单管理等核心业务时往往卡在接口设计、数据同步和权限控制这些环节。市面上虽然有很多单方面的教程但将一个完整的“手作产品交易平台”从选题、设计、编码到部署讲透的资料却很少。本文将以一个真实的毕业设计/课程项目为蓝本手把手带你搭建一个基于 SpringBoot 和微信小程序的全栈交易平台。从环境搭建、数据库设计、接口开发到小程序页面联调我会提供完整的源码、详细的文档报告和关键代码的逐行讲解确保你不仅能复现项目更能理解每一行代码背后的设计思想。无论你是正在寻找毕设题目的计算机专业学生还是希望快速上手 SpringBoot 小程序开发的初级开发者这篇文章都能为你提供一条清晰的实践路径。1. 项目背景与核心概念解析在开始敲代码之前我们首先要明确我们要构建的是一个什么样的系统以及为什么选择这样的技术栈。1.1 什么是手作产品交易平台手作产品交易平台顾名思义是一个专注于手工制作商品如手工皮具、饰品、陶艺、编织品等的在线交易市场。与传统电商平台相比它更强调产品的独特性、创作者的故事以及社区的互动。其核心功能通常包括用户端小程序 用户注册登录、浏览手作商品、收藏商品、加入购物车、下单支付、查看订单、与卖家沟通、发布评价等。管理端Web通常也是SpringBoot开发 商品分类管理、商品信息审核与上下架、订单管理、用户管理、数据统计等。选择这个作为毕设题目优势明显业务模型清晰且贴近生活能完整覆盖用户管理、商品CRUD、购物车、订单、支付模拟等经典电商模块技术栈主流工作量适中易于扩展和展示。1.2 为什么选择 SpringBoot 微信小程序这是一个经过市场验证的、非常流行的轻量级全栈解决方案。SpringBoot (后端)快速开发 约定大于配置内嵌Tomcat无需打包成WAR部署极大简化了Spring应用的初始搭建和开发过程。生态强大 可以轻松集成MyBatis-Plus数据操作、Spring Security安全、Redis缓存、RabbitMQ消息队列等满足项目进阶需求。适合毕设 是当前企业Java开发的主流框架写在简历上是很大的加分项。微信小程序 (前端)无需安装 用户扫码即用体验流畅传播方便。生态成熟 提供丰富的原生API如支付、位置、扫码和组件库如WeUI开发效率高。前后端分离 通过HTTP API与后端交互架构清晰符合现代Web开发规范。技术栈全景图后端 SpringBoot 2.x MyBatis-Plus MySQL Maven 前端 微信小程序原生框架 JavaScript WXML WXSS 开发工具 IntelliJ IDEA (后端) 微信开发者工具 (前端)2. 环境准备与项目初始化“工欲善其事必先利其器”。在开始编码前请确保你的开发环境已就绪。2.1 后端开发环境准备JDK 安装 JDK 8 或 JDK 11推荐JDK 8兼容性最好。配置好JAVA_HOME环境变量。IDE 安装 IntelliJ IDEA社区版或旗舰版。它对SpringBoot的支持非常友好。Maven 安装 Maven 3.6并配置好仓库镜像如阿里云镜像以加速依赖下载。MySQL 安装 MySQL 5.7 或 8.0并启动服务。建议使用 Navicat 或 DBeaver 等图形化工具管理数据库。Postman/ApiFox 用于测试后端API接口。2.2 前端开发环境准备注册微信小程序 访问微信公众平台注册一个微信小程序账号获取小程序的AppID。安装开发者工具 下载并安装微信开发者工具这是官方开发、调试、预览和上传小程序的集成环境。2.3 创建SpringBoot项目骨架我们使用 Spring Initializr 来快速生成项目基础结构。在 IDEA 中选择File - New - Project选择Spring Initializr。Project Metadata:Group:com.handmadeArtifact:handmade-platformType:MavenJava Version:8Packaging:JarDependencies: 添加以下初始依赖后续可在pom.xml中补充Spring Web(用于构建RESTful API)MyBatis Framework(或直接选MyBatis-Plus更强大)MySQL Driver(数据库驱动)Lombok(简化实体类代码强烈推荐)点击完成IDEA会自动生成项目并下载依赖。项目结构大致如下handmade-platform/ ├── src/ │ ├── main/ │ │ ├── java/com/handmade/ │ │ │ └── HandmadePlatformApplication.java // 启动类 │ │ └── resources/ │ │ ├── application.properties // 配置文件 │ │ └── static/ templates/ │ └── test/ ├── pom.xml // Maven依赖管理文件 └── ...2.4 基础配置在src/main/resources/application.properties中配置数据库连接等信息。这里我们重命名为application.ymlYAML格式更清晰。# application.yml server: port: 8080 # 服务端口 spring: datasource: driver-class-name: com.mysql.cj.jdbc.Driver url: jdbc:mysql://localhost:3306/handmade_db?useUnicodetruecharacterEncodingUTF-8serverTimezoneAsia/Shanghai username: root # 你的数据库用户名 password: 123456 # 你的数据库密码 jackson: date-format: yyyy-MM-dd HH:mm:ss time-zone: GMT8 # MyBatis-Plus 配置 mybatis-plus: configuration: log-impl: org.apache.ibatis.logging.stdout.StdOutImpl # 控制台打印SQL调试用 global-config: db-config: id-type: auto # 主键策略数据库自增 logic-delete-field: deleted # 全局逻辑删除字段名如果使用 logic-delete-value: 1 # 逻辑已删除值 logic-not-delete-value: 0 # 逻辑未删除值 # 日志级别 logging: level: com.handmade.mapper: debug # 打印Mapper层的SQL注意 请先在MySQL中创建数据库handmade_db字符集建议为utf8mb4。3. 数据库设计与实体类映射良好的数据库设计是项目的基石。我们根据业务需求设计核心表。3.1 核心表结构设计以下是几个核心表的设计仅为示例可根据需求扩展用户表 (user) 存储小程序用户信息。CREATE TABLE user ( id bigint(20) NOT NULL AUTO_INCREMENT COMMENT 主键ID, openid varchar(100) NOT NULL COMMENT 微信用户唯一标识, nickname varchar(100) DEFAULT NULL COMMENT 昵称, avatar_url varchar(500) DEFAULT NULL COMMENT 头像, phone varchar(20) DEFAULT NULL COMMENT 手机号, create_time datetime DEFAULT CURRENT_TIMESTAMP COMMENT 创建时间, update_time datetime DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT 更新时间, PRIMARY KEY (id), UNIQUE KEY uk_openid (openid) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COMMENT用户表;商品表 (product) 存储手作商品信息。CREATE TABLE product ( id bigint(20) NOT NULL AUTO_INCREMENT COMMENT 商品ID, name varchar(200) NOT NULL COMMENT 商品名称, description text COMMENT 商品描述, price decimal(10,2) NOT NULL COMMENT 价格, stock int(11) NOT NULL DEFAULT 0 COMMENT 库存, main_image varchar(500) DEFAULT NULL COMMENT 主图, detail_images text COMMENT 详情图(JSON数组), category_id bigint(20) DEFAULT NULL COMMENT 分类ID, seller_id bigint(20) NOT NULL COMMENT 卖家用户ID, status tinyint(4) NOT NULL DEFAULT 1 COMMENT 状态0-下架1-上架, create_time datetime DEFAULT CURRENT_TIMESTAMP, update_time datetime DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP, PRIMARY KEY (id), KEY idx_category (category_id), KEY idx_seller (seller_id) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COMMENT商品表;订单表 (order) 存储订单信息。注意order是SQL关键字在实际使用中建议用order_info等名称。CREATE TABLE order_info ( id varchar(32) NOT NULL COMMENT 订单号自定义生成, user_id bigint(20) NOT NULL COMMENT 用户ID, total_amount decimal(10,2) NOT NULL COMMENT 订单总金额, status tinyint(4) NOT NULL DEFAULT 0 COMMENT 状态0-待支付1-已支付2-已发货3-已完成4-已取消, address varchar(500) NOT NULL COMMENT 收货地址, receiver varchar(100) NOT NULL COMMENT 收货人, phone varchar(20) NOT NULL COMMENT 收货电话, create_time datetime DEFAULT CURRENT_TIMESTAMP, update_time datetime DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP, PRIMARY KEY (id), KEY idx_user (user_id) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COMMENT订单表;订单商品表 (order_item) 存储订单中包含的商品详情支持一个订单多个商品。CREATE TABLE order_item ( id bigint(20) NOT NULL AUTO_INCREMENT, order_id varchar(32) NOT NULL COMMENT 订单ID, product_id bigint(20) NOT NULL COMMENT 商品ID, product_name varchar(200) NOT NULL COMMENT 商品名称快照, product_image varchar(500) DEFAULT NULL COMMENT 商品图片快照, price decimal(10,2) NOT NULL COMMENT 购买时单价, quantity int(11) NOT NULL COMMENT 购买数量, PRIMARY KEY (id), KEY idx_order (order_id) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COMMENT订单商品明细表;3.2 使用MyBatis-Plus生成实体类、Mapper和ServiceMyBatis-Plus的代码生成器能极大提升开发效率。首先在pom.xml中添加代码生成器依赖。!-- pom.xml 中在 dependencies 标签内添加 -- dependency groupIdcom.baomidou/groupId artifactIdmybatis-plus-generator/artifactId version3.5.3/version !-- 请使用与MyBatis-Plus核心包匹配的版本 -- /dependency dependency groupIdorg.apache.velocity/groupId artifactIdvelocity-engine-core/artifactId version2.3/version /dependency然后创建一个代码生成器类CodeGenerator放在test目录下或任意位置运行。// 文件路径src/test/java/com/handmade/CodeGenerator.java import com.baomidou.mybatisplus.generator.FastAutoGenerator; import com.baomidou.mybatisplus.generator.config.OutputFile; import com.baomidou.mybatisplus.generator.engine.FreemarkerTemplateEngine; import java.util.Collections; public class CodeGenerator { public static void main(String[] args) { FastAutoGenerator.create(jdbc:mysql://localhost:3306/handmade_db?serverTimezoneAsia/Shanghai, root, 123456) .globalConfig(builder - { builder.author(YourName) // 设置作者 .outputDir(System.getProperty(user.dir) /src/main/java) // 输出目录 .commentDate(yyyy-MM-dd) .disableOpenDir(); // 生成后不打开文件夹 }) .packageConfig(builder - { builder.parent(com.handmade) // 父包名 .moduleName(platform) // 模块名会生成 com.handmade.platform .pathInfo(Collections.singletonMap(OutputFile.xml, System.getProperty(user.dir) /src/main/resources/mapper)); // Mapper XML位置 }) .strategyConfig(builder - { builder.addInclude(user, product, order_info, order_item) // 要生成的表 .addTablePrefix(t_, c_) // 过滤表前缀 .entityBuilder() .enableLombok() // 使用Lombok .logicDeleteColumnName(deleted) // 逻辑删除字段名 .enableTableFieldAnnotation() // 字段注解 .controllerBuilder() .enableRestStyle(); // 生成RestController }) .templateEngine(new FreemarkerTemplateEngine()) // 使用Freemarker引擎模板 .execute(); } }运行此main方法即可在com.handmade.platform包下生成controller,entity,mapper,service等层的代码。注意生成的代码是基础CRUD业务逻辑需要自己补充。4. 核心业务模块开发实战接下来我们聚焦几个核心业务模块的开发理解如何将需求转化为代码。4.1 用户登录与鉴权微信小程序登录流程微信小程序的登录流程是前后端交互的第一个关键点。流程如下小程序端调用wx.login()获取临时凭证code。小程序端将code发送给我们的后端服务器。后端服务器携带code、小程序AppID和AppSecret请求微信接口服务换取openid和session_key。后端根据openid生成自定义登录态如JWT Token或自定义Session ID并返回给小程序。小程序后续请求在 Header 中携带此 Token后端进行验证。后端实现关键代码首先在application.yml中配置小程序信息。# application.yml 追加 wechat: mp: app-id: your-app-id # 你的小程序AppID app-secret: your-app-secret # 你的小程序AppSecret创建配置类读取配置并创建WeChatService。// 文件路径src/main/java/com/handmade/platform/config/WeChatConfig.java Component ConfigurationProperties(prefix wechat.mp) Data public class WeChatConfig { private String appId; private String appSecret; }// 文件路径src/main/java/com/handmade/platform/service/WeChatService.java Service public class WeChatService { Autowired private WeChatConfig weChatConfig; Autowired private UserService userService; // 用户服务用于查找或创建用户 private static final String LOGIN_URL https://api.weixin.qq.com/sns/jscode2session; /** * 微信登录返回自定义Token */ public String weChatLogin(String code) { // 1. 构建请求URL String url String.format(%s?appid%ssecret%sjs_code%sgrant_typeauthorization_code, LOGIN_URL, weChatConfig.getAppId(), weChatConfig.getAppSecret(), code); // 2. 发送HTTP请求到微信服务器 RestTemplate restTemplate new RestTemplate(); ResponseEntityString response restTemplate.getForEntity(url, String.class); String result response.getBody(); // 3. 解析微信返回的JSON JSONObject jsonObject JSON.parseObject(result); String openid jsonObject.getString(openid); String sessionKey jsonObject.getString(session_key); // 注意session_key不应下发到客户端 if (openid null) { throw new RuntimeException(微信登录失败 jsonObject.getString(errmsg)); } // 4. 根据openid处理本地用户查找或创建 User user userService.findOrCreateByOpenid(openid); // 5. 生成自定义Token (这里用JWT示例也可用UUID等) String token JwtUtil.generateToken(user.getId().toString(), user.getOpenid()); // 可以将token与用户ID的映射关系存入Redis设置过期时间 return token; } }Controller层提供登录接口// 文件路径src/main/java/com/handmade/platform/controller/AuthController.java RestController RequestMapping(/api/auth) public class AuthController { Autowired private WeChatService weChatService; PostMapping(/login) public Result login(RequestBody LoginRequest request) { // LoginRequest 是一个DTO包含 code 字段 String token weChatService.weChatLogin(request.getCode()); return Result.success(登录成功, token); } }4.2 商品模块开发CRUD与分页查询商品模块是平台的核心。我们将实现商品的增删改查特别是面向小程序端的商品列表分页查询。实体类 (Product)已由代码生成器生成。我们重点关注Service和Controller的实现。Service层实现分页查询// 文件路径src/main/java/com/handmade/platform/service/impl/ProductServiceImpl.java Service public class ProductServiceImpl extends ServiceImplProductMapper, Product implements ProductService { Override public PageProductVO getProductPage(PageProduct page, ProductQuery query) { // ProductQuery 是查询条件封装类包含 categoryId, keyword, status 等 QueryWrapperProduct wrapper new QueryWrapper(); wrapper.eq(query.getCategoryId() ! null, category_id, query.getCategoryId()) .like(StringUtils.isNotBlank(query.getKeyword()), name, query.getKeyword()) .eq(status, 1) // 默认只查询上架商品 .orderByDesc(create_time); // 按创建时间倒序 // 1. 执行分页查询 PageProduct productPage this.page(page, wrapper); // 2. 将 Product 转换为 ProductVO (视图对象可能包含更多前端需要的字段) PageProductVO voPage new Page(productPage.getCurrent(), productPage.getSize(), productPage.getTotal()); ListProductVO voList productPage.getRecords().stream().map(product - { ProductVO vo new ProductVO(); BeanUtils.copyProperties(product, vo); // 可以在这里进行额外的数据填充如卖家昵称、分类名称等 return vo; }).collect(Collectors.toList()); voPage.setRecords(voList); return voPage; } }Controller层提供接口// 文件路径src/main/java/com/handmade/platform/controller/ProductController.java RestController RequestMapping(/api/product) public class ProductController { Autowired private ProductService productService; /** * 分页查询商品列表 (小程序首页/分类页使用) */ GetMapping(/page) public Result getProductPage(RequestParam(defaultValue 1) Integer pageNum, RequestParam(defaultValue 10) Integer pageSize, ProductQuery query) { PageProduct page new Page(pageNum, pageSize); PageProductVO result productService.getProductPage(page, query); return Result.success(result); } /** * 根据ID获取商品详情 */ GetMapping(/{id}) public Result getProductDetail(PathVariable Long id) { Product product productService.getById(id); if (product null || product.getStatus() 0) { return Result.fail(商品不存在或已下架); } // 转换为详情VO可能包含更多信息如卖家信息、评价列表等 ProductDetailVO detailVO convertToDetailVO(product); return Result.success(detailVO); } // 其他接口创建商品需要卖家权限、更新商品、下架商品等... }4.3 购物车与订单模块开发事务处理购物车和订单是交易的核心涉及多表操作和事务一致性。购物车添加逻辑购物车可以存储在Redis临时、高性能或数据库持久化中。这里以数据库为例。// 文件路径src/main/java/com/handmade/platform/service/impl/CartServiceImpl.java Service public class CartServiceImpl implements CartService { Autowired private CartMapper cartMapper; Autowired private ProductService productService; Override Transactional(rollbackFor Exception.class) // 声明式事务 public boolean addToCart(Long userId, Long productId, Integer quantity) { // 1. 校验商品是否存在且库存充足 Product product productService.getById(productId); if (product null || product.getStatus() 0) { throw new RuntimeException(商品不存在或已下架); } if (product.getStock() quantity) { throw new RuntimeException(商品库存不足); } // 2. 查询用户是否已有该商品的购物车记录 QueryWrapperCart wrapper new QueryWrapper(); wrapper.eq(user_id, userId).eq(product_id, productId); Cart cart cartMapper.selectOne(wrapper); if (cart ! null) { // 3. 存在则更新数量 cart.setQuantity(cart.getQuantity() quantity); cartMapper.updateById(cart); } else { // 4. 不存在则新增记录 cart new Cart(); cart.setUserId(userId); cart.setProductId(productId); cart.setQuantity(quantity); cartMapper.insert(cart); } return true; } }创建订单逻辑重点且复杂创建订单是一个典型的分布式事务场景扣减库存、生成订单、生成订单明细必须保证原子性。// 文件路径src/main/java/com/handmade/platform/service/impl/OrderServiceImpl.java Service public class OrderServiceImpl implements OrderService { Autowired private ProductService productService; Autowired private OrderInfoMapper orderInfoMapper; Autowired private OrderItemMapper orderItemMapper; Override Transactional(rollbackFor Exception.class) // 关键整个方法在一个事务内 public String createOrder(Long userId, OrderCreateRequest request) { // 1. 生成唯一订单号 (雪花算法、时间戳随机数等) String orderNo generateOrderNo(); // 2. 计算总金额并校验商品遍历购物车或前端传入的商品列表 BigDecimal totalAmount BigDecimal.ZERO; ListOrderItem orderItemList new ArrayList(); for (OrderItemRequest itemReq : request.getItems()) { Product product productService.getById(itemReq.getProductId()); // 校验商品状态、库存等 if (product null || product.getStatus() 0) { throw new RuntimeException(商品[ product.getName() ]已下架); } if (product.getStock() itemReq.getQuantity()) { throw new RuntimeException(商品[ product.getName() ]库存不足); } // 扣减库存 (乐观锁) int updateCount productService.reduceStock(itemReq.getProductId(), itemReq.getQuantity()); if (updateCount 0) { throw new RuntimeException(商品[ product.getName() ]库存扣减失败请重试); } // 构建订单商品项 OrderItem orderItem new OrderItem(); orderItem.setOrderId(orderNo); orderItem.setProductId(product.getId()); orderItem.setProductName(product.getName()); orderItem.setProductImage(product.getMainImage()); orderItem.setPrice(product.getPrice()); orderItem.setQuantity(itemReq.getQuantity()); orderItemList.add(orderItem); // 累加金额 totalAmount totalAmount.add(product.getPrice().multiply(new BigDecimal(itemReq.getQuantity()))); } // 3. 保存订单主信息 OrderInfo orderInfo new OrderInfo(); orderInfo.setId(orderNo); orderInfo.setUserId(userId); orderInfo.setTotalAmount(totalAmount); orderInfo.setStatus(0); // 待支付 orderInfo.setAddress(request.getAddress()); orderInfo.setReceiver(request.getReceiver()); orderInfo.setPhone(request.getPhone()); orderInfoMapper.insert(orderInfo); // 4. 批量保存订单商品明细 for (OrderItem item : orderItemList) { orderItemMapper.insert(item); } // 5. (可选) 清空用户购物车中对应的商品 return orderNo; } private String generateOrderNo() { // 示例时间戳 随机数 return ORDER System.currentTimeMillis() (int)((Math.random()*91)*1000); } }5. 微信小程序前端关键实现后端API准备好后小程序前端负责调用和展示。这里给出几个关键页面的实现思路。5.1 首页商品列表 (pages/index/index)WXML 结构 使用scroll-view实现上拉加载更多wx:for循环渲染商品卡片。!-- pages/index/index.wxml -- scroll-view scroll-y bindscrolltolowerloadMore view classproduct-list block wx:for{{productList}} wx:keyid navigator url/pages/product/detail?id{{item.id}} classproduct-item image src{{item.mainImage}} modeaspectFill/image view classinfo text classname{{item.name}}/text text classprice{{item.price}}/text /view /navigator /block view wx:if{{loading}} classloading加载中.../view view wx:if{{noMore}} classno-more没有更多了/view /view /scroll-viewJS 逻辑 在onLoad和loadMore中调用分页查询API。// pages/index/index.js Page({ data: { productList: [], pageNum: 1, pageSize: 10, loading: false, noMore: false }, onLoad() { this.loadProducts(); }, loadProducts() { if (this.data.loading || this.data.noMore) return; this.setData({ loading: true }); const { pageNum, pageSize } this.data; wx.request({ url: http://localhost:8080/api/product/page, method: GET, data: { pageNum, pageSize }, success: (res) { if (res.data.code 200) { const newList res.data.data.records; const hasMore newList.length this.data.pageSize; this.setData({ productList: [...this.data.productList, ...newList], pageNum: this.data.pageNum 1, noMore: !hasMore }); } }, complete: () { this.setData({ loading: false }); } }); }, loadMore() { this.loadProducts(); } });WXSS 样式 定义商品卡片的布局和样式。5.2 商品详情与立即购买 (pages/product/detail)获取商品详情onLoad生命周期中根据URL参数id请求后端接口。立即购买 点击按钮后通常有两种路径直接购买 将当前商品信息id, 数量存入全局变量或缓存跳转到订单确认页。加入购物车 调用购物车添加接口。// 加入购物车示例 addToCart() { const { productId, selectedCount } this.data; wx.request({ url: http://localhost:8080/api/cart/add, method: POST, header: { Authorization: wx.getStorageSync(token) // 携带登录Token }, data: { productId, quantity: selectedCount }, success: (res) { if (res.data.code 200) { wx.showToast({ title: 已加入购物车 }); } } }); }5.3 订单确认与支付 (pages/order/confirm)页面数据 从上一页购物车或商品详情获取待结算的商品列表、总金额并让用户填写/选择收货地址。提交订单 调用后端的创建订单接口获得订单号。模拟支付 对于毕设项目可以模拟支付流程。调用一个“模拟支付”接口将订单状态更新为“已支付”。// 模拟支付 simulatePay(orderNo) { wx.request({ url: http://localhost:8080/api/order/pay, method: POST, header: { Authorization: wx.getStorageSync(token) }, data: { orderNo }, success: (res) { if (res.data.code 200) { wx.showToast({ title: 支付成功 }); // 跳转到订单列表或详情页 wx.redirectTo({ url: /pages/order/detail?orderNo${orderNo} }); } } }); }注意 真实的微信支付集成需要申请商户号、配置支付目录、调用统一下单接口、处理支付回调等流程更复杂。毕设项目用模拟支付即可。6. 项目部署与联调6.1 后端打包与运行在项目根目录下执行 Maven 打包命令mvn clean package -DskipTests打包完成后在target目录下会生成handmade-platform-0.0.1-SNAPSHOT.jar。在服务器或本地运行java -jar handmade-platform-0.0.1-SNAPSHOT.jar确保MySQL服务已启动数据库表已创建。6.2 小程序端配置与真机调试在微信开发者工具中导入你的小程序项目。在app.js中配置后端API的基地址本地开发时可能是http://localhost:8080上线后需改为HTTPS域名。// app.js App({ globalData: { apiBaseUrl: http://localhost:8080 // 开发环境 // apiBaseUrl: https://your-domain.com // 生产环境 }, onLaunch() {} });在开发者工具中点击“详情”-“本地设置”勾选“不校验合法域名、web-view业务域名、TLS 版本以及 HTTPS 证书”以便在开发阶段访问本地HTTP后端。使用真机调试功能在手机上预览小程序测试主要流程。7. 常见问题与排查思路在开发过程中你可能会遇到以下典型问题问题现象可能原因排查思路与解决方案小程序请求后端接口报4041. 后端服务未启动。2. 请求URL路径错误。3. 后端Controller未被Spring扫描到。1. 检查后端控制台是否启动成功。2. 使用Postman测试接口是否通。3. 检查Controller类是否有RestController注解是否在启动类扫描包路径下。请求接口返回401 Unauthorized1. 需要登录的接口未携带Token。2. Token已过期或无效。1. 检查小程序登录流程是否成功是否将Token存储并后续请求放入HeaderAuthorization。2. 后端检查Token解析逻辑确认Redis中Token是否存在如果用了Redis。插入数据库中文乱码数据库、表、连接字符串字符集不统一。1. 确保MySQL数据库、表字符集为utf8mb4。2. 检查JDBC连接URL加上characterEncodingUTF-8。3. 确保Spring Boot配置文件中无冲突字符集设置。事务不生效库存扣减了但订单没生成1. 异常被捕获未抛出。2. 方法非public。3. 自调用问题在同一个类中调用带Transactional的方法。1. 确保Transactional注解的方法抛出的异常是RuntimeException或配置了rollbackFor。2. 确保方法是public。3. 将事务方法放到另一个Service中调用或使用AopContext.currentProxy()。小程序预览/上传时提示“不在以下 request 合法域名列表中”小程序上线要求使用HTTPS域名。1.开发阶段在开发者工具设置中勾选“不校验合法域名”。2.上线前必须将后端部署到支持HTTPS的服务器并在微信小程序后台的“开发管理”-“开发设置”-“服务器域名”中配置 request 合法域名。MyBatis-Plus查询不到数据1. 实体类字段名与数据库列名映射不上。2. 逻辑删除字段影响。1. 使用TableField注解指定映射或开启驼峰转下划线映射。2. 检查是否配置了全局逻辑删除查询时会自动加上deleted0条件。8. 项目优化与扩展建议最佳实践一个基础的毕设项目完成后你可以从以下方向进行优化和扩展这能让你的项目脱颖而出也更能体现你的技术深度。8.1 后端优化接口鉴权与安全使用Spring Security JWT或Sa-Token实现更精细的权限控制如区分普通用户、卖家、管理员。对敏感操作如支付、修改密码进行接口防重放攻击和参数签名验证。使用HTTPS协议传输数据。性能提升缓存 将热点数据如商品信息、首页配置存入Redis减少数据库压力。数据库优化 为高频查询字段如category_id,status建立索引。避免SELECT *按需查询字段。异步处理 使用Spring Async或消息队列如RabbitMQ处理耗时操作如发送订单成功通知邮件/短信。代码结构优化严格遵循Controller - Service - Mapper的分层架构。使用DTO(Data Transfer Object) 进行前后端数据交互与Entity实体类分离。使用GlobalExceptionHandler统一处理异常返回规范的错误信息。使用Swagger或Knife4j自动生成API文档便于前后端联调。8.2 前端优化状态管理 对于复杂的小程序可以使用Vant Weapp组件库和MobX或wx.miniprogram-store进行状态管理解决跨页面数据同步问题。用户体验加入骨架屏Skeleton Screen提升加载体验。对图片进行懒加载和压缩。合理使用onReachBottom和onPullDownRefresh实现流畅的分页和下拉刷新。代码复用 将网络请求封装成统一的request模块自动处理Token、基地址、错误提示等。8.3 功能扩展毕设加分项搜索功能 集成Elasticsearch实现商品全文检索支持拼音、同义词、高亮显示。推荐系统 基于用户浏览和购买历史实现简单的协同过滤推荐在首页展示“猜你喜欢”。即时通讯 使用WebSocket或第三方SDK如腾讯云IM实现买家与卖家的在线沟通功能。数据可视化 为管理后台集成ECharts展示销售数据、用户增长等统计图表。部署与运维使用Docker容器化部署后端应用和MySQL、Redis。编写Dockerfile和docker-compose.yml一键部署。了解基本的Nginx配置实现反向代理和负载均衡。通过以上步骤你已经完成了一个具备核心功能的“手作产品交易平台”从零到一的搭建。这个项目不仅涵盖了SpringBoot和微信小程序的基础开发还涉及了数据库设计、API设计、事务管理、前后端联调等全栈技能。在撰写毕业设计论文或报告时你可以将本文的开发过程、设计思路、遇到的问题及解决方案系统地整理出来这本身就是一份高质量的毕业设计材料。记住理解每个模块为什么这样设计比单纯复制代码更重要。遇到问题时善用搜索引擎、官方文档和调试工具祝你开发顺利