RoyZeng/youlai-mall

线上预览地址

系统管理: http://www.youlai.tech
H5: http://www.youlai.tech:81
Android: https://wws.lanzoui.com/iP0Tkvjpusd 密码:1234
微信小程序: 见文末二维码

项目信息

项目简介

youlai-mall 是基于Spring Boot 2.5、Spring Cloud 2020 & Alibaba 2021、vue、element-ui、uni-app快速构建的一套全栈开源商城项目。

项目采用微服务、前后端分离开发模式；汇集全栈主流的技术栈；涉及微服务接口、前端管理、微信小程序和 APP应用等多端的开发。

项目特色

Spring Cloud + Vue + Docker全栈开发
项目使用的都是当前主流的技术栈，无过度自定义封装，易学习理解和方便二次扩展
基于Spring Boot 2.5.2、Spring Cloud 2020 & Alibaba 2021一站式微服务解决方案实现快速开发
完整的Spring Security OAuth2 认证中心统一认证授权，网关统一鉴权逻辑
特有一套微服务+前后端分离的RBAC权限设计，实现Spring Cloud Gateway网关下的RESTful接口细粒度的统一鉴权和vue页面按钮级别权限控制
基于vue-element-admin的后台前端解决方案，实现动态路由
移动端采用uni-app、实现跨多端移动应用开发，包括微信小程序、Android和IOS等
Docker快速构建项目环境和一键打包部署微服务项目

项目预览

Spring Security OAuth2 认证授权

【App移动端】Spring Security OAuth2 手机短信验证码模式	【微信小程序】Spring Security OAuth2 微信授权模式

【管理系统】Spring Security OAuth2 密码模式	【管理系统】Spring Security OAuth2 验证码模式

系统管理

微信小程序

项目架构图

技术栈

后端技术栈： Spring Boot、Spring Cloud、Spring Cloud Alibaba、Spring Security OAuth2、JWT、Mybatis-Plus、Seata、Sentinel、ELK、Redis
前端技术栈： vue、element-ui、uni-app、vue-element-admin

项目地址

项目名称	源码地址	项目名称	源码地址
微服务接口	youlai-mall	微信小程序	youlai-mall-weapp
管理前端	youlai-mall-admin	APP应用	youlai-mall-app

项目结构

youlai-mall
├── doc
    ├── diagram -- 框架图解
    ├── nacos -- Nacos配置文件
    ├── sql   -- mysql数据库脚本
├── mall-oms
    ├── oms-api -- 订单中心Feign接口客户端
    ├── oms-boot -- 订单中心
├── mall-pms
    ├── pms-api -- 商品中心Feign接口客户端
    ├── pms-boot -- 商品中心
├── mall-sms
    ├── sms-api -- 营销中心Feign接口客户端
    ├── sms-boot -- 营销中心
├── mall-ums
    ├── ums-api -- 会员中心Feign接口客户端
    ├── ums-boot -- 会员中心
├── middleware -- 中间件（Nacos、Sentinel）
├── youlai-admin 
    ├── admin-api -- 系统管理服务Feign接口客户端
    ├── admin-boot -- 系统管理服务
├── youlai-auth     -- 认证中心【OAuth2认证服务器】
├── youlai-common   -- 公共模块
├── youlai-gateway  -- Gateway网关【OAuth2资源服务器】
└── youlai-loboratory  -- 实验室

项目启动

后台微服务启动

后台微服务启动有云环境和本地环境两种方式。为了方便大家快速启动看到效果，有来技术团队提供在线的云环境，无需安装项目依赖的中间件。如需切换到你自己的环境，在Nacos控制台修改公共配置文件youlai-common.yaml的MySQL、Redis、RabbitMQ等中间件的连接信息即可。

✨温馨提示✨ 云环境是团队无条件提供出来方便启动测试，风险多大应该都懂，希望大家多多爱护不要钻漏洞和修改数据，如果时间条件允许，建议在自己的本地环境启动。

一. 云环境启动

Nacos 启动和导入配置
- 启动Nacos
  
  IDEA底部工具栏点击Terminal终端命令行，执行cd middleware/nacos/bin命令切换到Nacos的启动脚本目录下，执行startup -m standalone命令启动Nacos服务。
  
  ✨温馨提示✨ Nacos 默认有内置数据库，这里就先用默认，如有切换MySQL的需要，下文本地环境有说明。
- 导入配置
  
  浏览器输入 http://localhost:8848/nacos ,输入用户名/密码:nacos/nacos 进入控制台，在配置管理→配置列表页面选择项目里的文件doc/nacos/DEFAULT_GROUP.zip导入。
微服务启动

进入youlai-gateway、youlai-auth、 youlai-admin3个基础服务，找到对应的启动类，分别是GatewayApplication、AuthApplication以及youlai-admin的子模块admin-boot的AdminApplication类，商城模块按需启动。浏览器访问 http://localhost:9999/doc.html 项目的接口文档，如果界面显示正常，代表服务启动成功。

二. 本地环境启动

安装环境

安装MySQL、Redis中间件，MySQL的版本5.x和8.x皆可。
数据库创建
- 新建平台数据库，进入doc/sql目录，根据MySQL版本选择，先执行database.sql创建数据库，再执行youlai.sql、mall_*.sql完成表的创建和数据的导入。
- 创建Nacos数据库，执行脚本middleware/nacos/conf/nacos-mysql.sql完成Nacos数据库的初始化。
Nacos 配置和启动
- 修改Nacos数据源：进入middleware/nacos/conf/application.properties将数据源修改为您自己的环境；
- 启动Nacos： IDEA下方工具栏点击Terminal终端命令行，执行cd middleware/nacos/bin命令切换到Nacos的启动脚本文件夹下，然后执行startup -m standalone命令启动Nacos服务；
- 导入配置：浏览器输入 http://localhost:8848/nacos ,输入用户名/密码:nacos/nacos 进入控制台，在配置管理→配置列表页面选择项目里的文件docs/nacos/DEFAULT_GROUP.zip导入。
- 修改配置：进入共享配置youlai-common.yaml修改MySQL、Redis、RabbitMQ等中间件的信息，默认是有来技术团队云服务器环境。
微服务启动

分别启动youlai-gateway、youlai-auth、 youlai-admin模块，启动类分别对应的是GatewayApplication、AuthApplication以及youlai-admin的子模块admin-boot的AdminApplication类，至此完成整个项目基础服务的启动。
启动验证

访问接口文档： http://localhost:9999/doc.html

管理前端启动

本机安装Node环境
npm install
npm run dev
访问 http://localhost:9527

✨温馨提示✨ npm install 有些依赖包需从github拉取，网络不好会有失败的情况，可以切换好点的网络或者找其他童鞋要一份完整的node_modules依赖包导入。

微信小程序启动

下载HBuilder X和微信开发者工具
微信公众平台申请小程序，获得小程序的AppID
微信开发者工具微信扫码登录，开启服务端口，点击工具栏设置->安全设置->安全->服务端口选择打开
Hbuilder X替换项目AppID成自己的，点击manifest.json文件->微信小程序配置
Nacos控制台修改youlai-auth配置中的微信小程序AppID和AppSecret为自己申请的小程序
Hbuilder X工具栏点击 运行->运行到小程序模拟器->微信开发者工具

接口测试

登录认证接口

Postman
- 请求参数类型为Query Param或者form-data，出现很多错误的情况是将参数是JSON格式放在请求Body中
- Spring Security OAuth2新版本不再支持将客户端信息client_id和client_secret放在请求路径的这种方式，否者会出现401的错误（已验证）
- OAuth2客户端信息在Authorization标签选择Basic Auth然后填写client_id和client_secret
Query Params参数 Authorization
Knife4j接口文档（推荐）
- 接口文档地址，启动网关访问 http://localhost:9999/doc.html (默认)
- 请求接口之前，先执行对应模块下的第一个接口Authorize完成认证，通过后再打开其他接口请求头会自动填充token
- client/123456 是有来项目预留用于测试的客户端信息，因为Knife4j完成自动填充不能包装返回值，和大多数实际项目需包装返回值添加状态码不符