程序员scholar 程序员scholar
首页
  • Java 基础

    • JavaSE
    • JavaIO
    • JavaAPI速查
  • Java 高级

    • JUC
    • JVM
    • Java新特性
    • 设计模式
  • Web 开发

    • Servlet
    • Java网络编程
  • Web 标准

    • HTML
    • CSS
    • JavaScript
  • 前端框架

    • Vue2
    • Vue3
    • 微信小程序
    • uni-app
  • 工具与库

    • jQuery
    • Ajax
    • Axios
    • Webpack
    • Vuex
    • WebSocket
    • 第三方登录
  • 后端与语言扩展

    • ES6
    • Typescript
    • node.js
  • Element-UI
  • Apache ECharts
  • 数据结构
  • HTTP协议
  • HTTPS协议
  • 计算机网络
  • Linux常用命令
  • Windows常用命令
  • SQL数据库

    • MySQL
    • MySQL速查
  • NoSQL数据库

    • Redis
    • ElasticSearch
  • 数据库

    • MyBatis
    • MyBatis-Plus
  • 消息中间件

    • RabbitMQ
  • 服务器

    • Nginx
  • Spring框架

    • Spring6
    • SpringMVC
    • SpringBoot
    • SpringSecurity
  • SpringCould微服务

    • SpringCloud基础
    • 微服务之DDD架构思想
  • 日常必备

    • 开发常用工具包
    • Hutoll工具包
    • IDEA常用配置
    • 开发笔记
    • 若依框架
    • 日常记录
    • 项目部署
    • 网站导航
    • 产品学习
    • 英语学习
  • 代码管理

    • Maven
    • Git教程
    • Git小乌龟教程
  • 运维工具

    • Docker
    • Jenkins
    • Kubernetes
  • 算法笔记

    • 算法思想
    • 刷题笔记
  • 面试问题常见

    • 十大经典排序算法
    • 面试常见问题集锦
关于
GitHub (opens new window)
首页
  • Java 基础

    • JavaSE
    • JavaIO
    • JavaAPI速查
  • Java 高级

    • JUC
    • JVM
    • Java新特性
    • 设计模式
  • Web 开发

    • Servlet
    • Java网络编程
  • Web 标准

    • HTML
    • CSS
    • JavaScript
  • 前端框架

    • Vue2
    • Vue3
    • 微信小程序
    • uni-app
  • 工具与库

    • jQuery
    • Ajax
    • Axios
    • Webpack
    • Vuex
    • WebSocket
    • 第三方登录
  • 后端与语言扩展

    • ES6
    • Typescript
    • node.js
  • Element-UI
  • Apache ECharts
  • 数据结构
  • HTTP协议
  • HTTPS协议
  • 计算机网络
  • Linux常用命令
  • Windows常用命令
  • SQL数据库

    • MySQL
    • MySQL速查
  • NoSQL数据库

    • Redis
    • ElasticSearch
  • 数据库

    • MyBatis
    • MyBatis-Plus
  • 消息中间件

    • RabbitMQ
  • 服务器

    • Nginx
  • Spring框架

    • Spring6
    • SpringMVC
    • SpringBoot
    • SpringSecurity
  • SpringCould微服务

    • SpringCloud基础
    • 微服务之DDD架构思想
  • 日常必备

    • 开发常用工具包
    • Hutoll工具包
    • IDEA常用配置
    • 开发笔记
    • 若依框架
    • 日常记录
    • 项目部署
    • 网站导航
    • 产品学习
    • 英语学习
  • 代码管理

    • Maven
    • Git教程
    • Git小乌龟教程
  • 运维工具

    • Docker
    • Jenkins
    • Kubernetes
  • 算法笔记

    • 算法思想
    • 刷题笔记
  • 面试问题常见

    • 十大经典排序算法
    • 面试常见问题集锦
关于
GitHub (opens new window)
npm

(进入注册为作者充电)

  • 快速入门

    • 若依-快速入门
      • 1. 项目结构概览
        • 后端项目结构(ruoyi)
        • 前端项目结构(ruoyi-ui)
      • 2. 启动与部署
        • 后端启动
        • 前端启动
      • 3. 主要功能模块
        • 用户管理
        • 系统监控
        • 代码生成
      • 4. 安全机制
      • 5. 常见问题与解决方案
        • 登录后出现 401 错误
        • 数据库连接失败
      • 6. 自定义扩展
      • 7. 部署与上线
      • 8. 总结
    • 若依-环境部署
    • 若依-项目介绍
  • 后端手册

  • 前端手册

  • 组件文档

  • 数据库分析

  • 若依框架
  • 快速入门
scholar
2024-08-31
目录

若依-快速入门

# 若依-快速入门

若依(RuoYi)是一个基于 Spring Boot 和 Vue.js 的前后端分离开发框架,广泛用于企业级应用的开发。它提供了丰富的功能模块和灵活的扩展性,适合构建各种管理系统。下面,我将为你详细讲解若依前后端分离版本,尤其是基于 Spring Boot 和 Vue 的版本。

# 1. 项目结构概览

若依前后端分离版本的项目结构一般包括两个独立的项目:

  • 前端项目:基于 Vue.js,使用 Vue CLI 构建,负责页面展示和交互逻辑。前端代码主要在 ruoyi-ui 目录中。
  • 后端项目:基于 Spring Boot,使用 MyBatis 作为 ORM 框架,负责业务逻辑、数据访问、权限管理等。后端代码主要在 ruoyi 目录中。

# 后端项目结构(ruoyi)

  • ruoyi-admin:主程序入口,包含主要的业务代码。
  • ruoyi-common:公共模块,封装了工具类、通用配置、常量定义等。
  • ruoyi-framework:框架核心模块,包含安全配置、权限控制、日志处理等。
  • ruoyi-generator:代码生成器模块,支持通过模板自动生成基础代码。
  • ruoyi-quartz:定时任务模块,基于 Quartz 框架实现。
  • ruoyi-system:系统管理模块,主要负责用户、角色、菜单等的管理。
  • ruoyi-web:Web 层,主要用于配置 Controller,处理前端请求。

# 前端项目结构(ruoyi-ui)

  • src:源代码目录。
    • api:与后端交互的接口定义。
    • assets:静态资源文件,如图片、样式文件等。
    • components:通用组件库。
    • router:前端路由配置。
    • store:Vuex 状态管理。
    • views:各个页面视图。
    • utils:工具类方法。
  • public:公共静态资源目录,如 index.html 模板文件。
  • vue.config.js:Vue CLI 的配置文件。

# 2. 启动与部署

若依的启动方式较为简单,但需要确保前后端环境配置正确。

# 后端启动

  1. 配置数据库:在 ruoyi-admin 项目的 application-dev.yml 文件中配置数据库连接信息。

    spring:
      datasource:
        url: jdbc:mysql://localhost:3306/ruoyi?useUnicode=true&characterEncoding=utf8&useSSL=false
        username: root
        password: 123456
    
    1
    2
    3
    4
    5
  2. 启动后端:运行 RuoYiApplication 类即可启动 Spring Boot 应用。默认启动端口为 8080。

  3. 接口文档:启动后可以通过访问 http://localhost:8080/swagger-ui.html 查看 API 接口文档。

# 前端启动

  1. 安装依赖:进入 ruoyi-ui 目录,运行 npm install 安装所需的 Node.js 依赖包。

  2. 配置环境:在 ruoyi-ui 项目中,vue.config.js 文件配置了代理转发,将开发环境下的 API 请求转发到后端的 8080 端口。

    devServer: {
      proxy: {
        '/dev-api': {
          target: 'http://localhost:8080',
          changeOrigin: true,
          pathRewrite: {
            '^/dev-api': ''
          }
        }
      }
    }
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
  3. 启动前端:运行 npm run dev 命令启动前端应用,默认访问地址为 http://localhost:8080。

# 3. 主要功能模块

若依框架提供了许多开箱即用的功能模块,以下是一些核心模块的详细介绍:

# 用户管理

  • 用户管理:支持用户的增删改查、角色分配、密码重置等功能。
  • 角色管理:管理系统中的角色,控制权限分配。
  • 权限管理:基于 RBAC(角色基于访问控制)模型实现细粒度的权限控制。

# 系统监控

  • 操作日志:记录用户的操作日志,可以按操作类型、用户名等进行筛选和查询。
  • 系统日志:记录系统运行日志,包括错误日志、警告日志等。
  • 定时任务:基于 Quartz 实现的定时任务管理,支持任务的增删改查和即时触发。

# 代码生成

若依的代码生成器模块可以根据数据库表自动生成基础的 CRUD 代码,极大地提高了开发效率。生成的代码包括 Controller、Service、Mapper、XML 配置等。

# 4. 安全机制

若依框架中的安全机制主要依赖于 Spring Security 实现,通过 JWT(JSON Web Token)进行用户身份验证,确保 API 接口的安全访问。

  • 登录认证:用户通过用户名和密码登录,服务器生成 JWT 并返回给客户端。客户端在后续请求中将 JWT 作为 Authorization 头发送到服务器。
  • 权限验证:基于用户的角色和权限标识符(如 @PreAuthorize("hasRole('ADMIN')"))对 API 进行访问控制。

# 5. 常见问题与解决方案

# 登录后出现 401 错误

  • 原因:JWT 过期或无效。
  • 解决方案:检查前端是否正确传递了 Authorization 头部信息,后端是否配置了正确的 JWT 秘钥。

# 数据库连接失败

  • 原因:数据库连接配置错误或 MySQL 服务未启动。
  • 解决方案:检查 application-dev.yml 中的数据库配置,确保 MySQL 服务已启动并且配置正确。

# 6. 自定义扩展

若依框架的模块化设计使得自定义扩展相对容易。以下是一些常见的自定义场景:

  • 新增业务模块:在 ruoyi-system 模块中新增业务模块,并编写相应的 Controller、Service 和 Mapper 层代码。
  • 自定义前端页面:在 ruoyi-ui 中新增页面文件,配置路由和组件,实现新的前端功能。

# 7. 部署与上线

若依支持多种部署方式,包括本地部署、Docker 部署等。常见的生产环境部署步骤包括:

  1. 打包后端项目:使用 mvn clean package 命令打包生成 jar 文件。
  2. 打包前端项目:使用 npm run build 命令生成静态资源文件。
  3. 部署到服务器:将打包好的后端 jar 文件和前端静态资源文件部署到服务器上,配置 Nginx 进行反向代理。

# 8. 总结

若依(RuoYi)框架作为一个成熟的企业级开发框架,为开发人员提供了完整的前后端分离解决方案。通过合理的模块划分和灵活的配置,开发人员可以快速构建、扩展和部署各种管理系统。

编辑此页 (opens new window)
上次更新: 2024/12/28, 18:32:08
若依-环境部署

若依-环境部署→

Theme by Vdoing | Copyright © 2019-2025 程序员scholar
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式