ruoyi-vue-pro 開發指南

一、簡介

ruoyi-vue-pro 是一款基於 SpringBoot2.x 全家桶實現、Vue、Element UI 的後台管理系統模板,提供模板功能和CRUD代碼生成,並且支持多租戶系統、多數據源系統,可瀏覽器緩存、工作流、十強排行榜、代碼生成等常用開發功能。

在本章節中,我們將介紹該系統的基本架構和運行環境。

二、系統架構

本系統的架構基於傳統的前後端分離架構模式,採用以下技術棧:

  • 前端採用 Vue + Element + Axios + Webpack;
  • 後端採用 SpringBoot2.x + MyBatis-Plus + Shiro + Swagger-UI + Log4j2。

三、運行環境

運行該項目需要滿足以下環境:

  • JDK8+
  • Maven 3.0+
  • MySQL 5.5+
  • Node.js 10+

四、項目結構

本系統的項目結構如下:

ruoyi-vue-pro/
  ├── ruoyi-admin/  後台管理模塊
  ├── ruoyi-common/ 客戶端、服務端公共模塊
  ├── ruoyi-framework/ 框架核心模塊
  ├── ruoyi-generator/ java代碼自動生成模塊
  ├── ruoyi-quartz/ 定時任務模塊
  ├── ruoyi-system/ 後台管理業務模塊
  ├── ruoyi-tools/ 系統工具模塊
  └── src/  Vue前端代碼

五、代碼示例

1. Mybatis-Plus 更改系統默認表名確定方法

在項目中使用Mybatis-Plus的時候,默認情況下表名和實體類名必須一一對應,否則-會出現”無法找到該實體”的錯誤。在系統多數據源的時候,這種情況更加明顯。

/**
* 代碼生成前綴配置,表名以sys_開頭才生成代碼
*/
strategy.setTablePrefix(new String[] { "sys_" });

/**
*根據數據庫表獲取對應實體類
*/
@Override
public String tableToJava(String tableName) {
    if (tableName.startsWith("sys_")) {
        return upperTableName2Camel(tableName.replaceFirst("sys_", ""));
    } else if (tableName.startsWith("gen_")) {
        return upperTableName2Camel(tableName.replaceFirst("gen_", "Gen"));
    } else if (tableName.startsWith("qrtz_")) {
        return upperTableName2Camel(tableName.replaceFirst("qrtz_", "Qrtz"));
    } else {
        return upperTableName2Camel(tableName);
    }
}

2. 自定義異常處理

異常處理是Web應用開發中非常重要的一環,當系統出現異常時,我們需要有一個統一的異常處理機制。在本項目中,我們通過繼承DefaultHandlerExceptionResolver,並重寫它的resolveException()方法實現異常處理。

@RestControllerAdvice
public class GlobalExceptionHandler extends DefaultHandlerExceptionResolver {

    @Autowired
    private MessageSource messageSource;

    /**
    * 處理業務異常
    */
    @ExceptionHandler(BusinessException.class)
    @ResponseStatus(HttpStatus.INTERNAL_SERVER_ERROR)
    public R businessException(BusinessException e) {
        String message = messageSource.getMessage(e.getMessage(), null, LocaleContextHolder.getLocale());
        return R.error(message);
    }

    /**
    * 處理未知異常
    */
    @Override
    protected ResponseEntity handleExceptionInternal(Exception ex, Object body, HttpHeaders headers, HttpStatus status, WebRequest request) {
        logger.error("系統內部異常,異常信息:", ex);

        /**
        * 對於未知異常,只返回“系統內部異常”這個提示信息
        */
        String message = messageSource.getMessage("error.internal.server", null, LocaleContextHolder.getLocale());
        return new ResponseEntity(R.error(message), HttpStatus.INTERNAL_SERVER_ERROR);
    }
}

3. 多租戶系統實現

本系統支持多租戶,在開發過程中每個公司可以使用一個數據庫,將每個公司的相關數據存放在各自的數據庫中。我們在引入Mybatis-Plus後,通過繼承MybatisSqlInterceptor實現多租戶的切換。

@Configuration
@MapperScan("com.ruoyi.system.mapper")
public class MybatisPlusConfig {

    @Autowired
    private RuoYiConfig ruoyiConfig;

    /**
    * 多租戶方案之一:schema模式
    */
    @Bean
    public MybatisSqlInterceptor mybatisSqlInterceptor() {
        return new MybatisSqlInterceptor() {
            @Override
            public void prepare(SqlMappedStatement mappedStatement, Object parameter) {
                if (SecurityUtils.getMultiTenantId() != null) {
                    final String tenantId = SecurityUtils.getMultiTenantId();
                    if (StringUtils.isNotBlank(tenantId)) {
                        String originalSql = mappedStatement.getSql();
                        StringBuilder sqlBuilder = new StringBuilder("SET SCHEMA '")
                                .append(tenantId.toLowerCase())
                                .append("';");
                        sqlBuilder.append(originalSql);

                        setPreparedSql(originalSql);
                        setTargetSql(sqlBuilder.toString());
                    }
                }
            }
        };
    }

    /**
    * 多租戶方案之二:動態表名
    */
    @Bean
    public MybatisPlusInterceptor mybatisPlusInterceptor() {
        MybatisPlusInterceptor interceptor = new MybatisPlusInterceptor();
        interceptor.addInnerInterceptor(new DynamicTableNameInnerInterceptor());
        return interceptor;
    }
}

4. Vue + Element UI 實現圖標操作

Vue + Element UI 可以通過依賴 fontawesome 實現圖標操作。在這裡我們可以選擇幾種方式來實現圖標的引用:

  1. 引用CDN上面的fontawesome圖標庫
  2.     
      
  3. 下載fontawesome文件到本地,然後引用本地文件
  4.     
      
  5. 使用vue-awesome作為插件,安裝這個插件,就可以很方便地在vue中使用fontawesome圖標庫的各種圖標了。
  6.     npm install --save @fortawesome/fontawesome-svg-core
        npm install --save @fortawesome/free-solid-svg-icons
        npm install --save @fortawesome/vue-fontawesome
      
        
          
        
    
        
          import Vue from 'vue'
          import { library } from '@fortawesome/fontawesome-svg-core'
          import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
          import { faUser } from '@fortawesome/free-solid-svg-icons'
    
          // 通過library方法引入想要使用的圖標
          library.add(faUser)
    
          Vue.component('font-awesome-icon', FontAwesomeIcon)
        
      

5. Swagger-UI 自動生成API文檔

Swagger-UI 可以根據我們代碼中的註解自動生成 API 文檔。在本項目中,我們可以通過以下配置實現:

/**
* swagger配置
*/
@Configuration
@EnableSwagger2
public class SwaggerConfig {
    /**
    * 注入系統基礎配置
    */
    @Autowired
    private RuoYiConfig ruoyiConfig;

    @Bean
    public Docket createRestApi() {
        // 添加全局頭部信息
        ParameterBuilder parameterBuilder = new ParameterBuilder();
        List parameters = new ArrayList();
        parameterBuilder.name("Authorization")
                .description("令牌")
                .modelRef(new ModelRef("string"))
                .parameterType("header")
                .required(false).build();
        parameters.add(parameterBuilder.build());

        // API文檔基本信息配置
        return new Docket(DocumentationType.SWAGGER_2)
                .apiInfo(apiInfo())
                .select()
                .apis(RequestHandlerSelectors.withClassAnnotation(Api.class))
                .paths(PathSelectors.any())
                .build()
                .globalOperationParameters(parameters)
                .securityContexts(Collections.singletonList(securityContext()))
                .securitySchemes(Collections.singletonList(securityScheme()));
    }

    /**
    * API文檔基本信息配置
    */
    public ApiInfo apiInfo() {
        return new ApiInfoBuilder()
                .title("若依系統接口文檔")
                .description("若依管理系統後台接口文檔")
                .contact(new Contact(ruoyiConfig.getName(), null, null))
                .version("版本號:" + ruoyiConfig.getVersion())
                .build();
    }

    /**
    * 通過Swagger解決token問題
    */
    public SecurityScheme securityScheme() {
        return new ApiKey("Token", "token", "header");
    }

    /**
    * 通過Swagger解決token問題
    */
    private SecurityContext securityContext() {
        return SecurityContext.builder()
                .securityReferences(Arrays.asList(new SecurityReference("Token", new AuthorizationScope[]{new AuthorizationScope("global", "")})))
                .build();
    }
}

六、總結

本文主要介紹了ruoyi-vue-pro的基本架構和運行環境、項目結構、以及多個方面的代碼示例。通過學習以上內容,我們可以更好地理解和使用該系統,從而提高我們的開發效率和協同工作能力。

原創文章,作者:小藍,如若轉載,請註明出處:https://www.506064.com/zh-hant/n/242720.html

(0)
打賞 微信掃一掃 微信掃一掃 支付寶掃一掃 支付寶掃一掃
小藍的頭像小藍
上一篇 2024-12-12 12:51
下一篇 2024-12-12 12:51

相關推薦

  • Java JsonPath 效率優化指南

    本篇文章將深入探討Java JsonPath的效率問題,並提供一些優化方案。 一、JsonPath 簡介 JsonPath是一個可用於從JSON數據中獲取信息的庫。它提供了一種DS…

    編程 2025-04-29
  • 運維Python和GO應用實踐指南

    本文將從多個角度詳細闡述運維Python和GO的實際應用,包括監控、管理、自動化、部署、持續集成等方面。 一、監控 運維中的監控是保證系統穩定性的重要手段。Python和GO都有強…

    編程 2025-04-29
  • Python wordcloud入門指南

    如何在Python中使用wordcloud庫生成文字雲? 一、安裝和導入wordcloud庫 在使用wordcloud前,需要保證庫已經安裝並導入: !pip install wo…

    編程 2025-04-29
  • Python應用程序的全面指南

    Python是一種功能強大而簡單易學的編程語言,適用於多種應用場景。本篇文章將從多個方面介紹Python如何應用於開發應用程序。 一、Web應用程序 目前,基於Python的Web…

    編程 2025-04-29
  • Python小波分解入門指南

    本文將介紹Python小波分解的概念、基本原理和實現方法,幫助初學者掌握相關技能。 一、小波變換概述 小波分解是一種廣泛應用於數字信號處理和圖像處理的方法,可以將信號分解成多個具有…

    編程 2025-04-29
  • Python字符轉列表指南

    Python是一個極為流行的腳本語言,在數據處理、數據分析、人工智能等領域廣泛應用。在很多場景下需要將字符串轉換為列表,以便於操作和處理,本篇文章將從多個方面對Python字符轉列…

    編程 2025-04-29
  • 使用Vue實現前端AES加密並輸出為十六進制的方法

    在前端開發中,數據傳輸的安全性問題十分重要,其中一種保護數據安全的方式是加密。本文將會介紹如何使用Vue框架實現前端AES加密並將加密結果輸出為十六進制。 一、AES加密介紹 AE…

    編程 2025-04-29
  • Python初學者指南:第一個Python程序安裝步驟

    在本篇指南中,我們將通過以下方式來詳細講解第一個Python程序安裝步驟: Python的安裝和環境配置 在命令行中編寫和運行第一個Python程序 使用IDE編寫和運行第一個Py…

    編程 2025-04-29
  • FusionMaps應用指南

    FusionMaps是一款基於JavaScript和Flash的交互式地圖可視化工具。它提供了一種簡單易用的方式,將複雜的數據可視化為地圖。本文將從基礎的配置開始講解,到如何定製和…

    編程 2025-04-29
  • Python起筆落筆全能開發指南

    Python起筆落筆是指在編寫Python代碼時的編寫習慣。一個好的起筆落筆習慣可以提高代碼的可讀性、可維護性和可擴展性,本文將從多個方面進行詳細闡述。 一、變量命名 變量命名是起…

    編程 2025-04-29

發表回復

登錄後才能評論