项目快速搭建工具

置顶乔Qq_

已于 2024-05-15 13:07:13 修改

阅读量259

点赞数 9

文章标签： spring java

于 2024-05-06 17:41:42 首次发布

本文链接：https://blog.csdn.net/weixin_62459304/article/details/138496943

版权

文章详细介绍了SpringApplication配置中的服务器端口、数据库连接（包括MySQL和Druid配置）、MyBatisPlus的分页拦截器、前端资源的跨域请求处理、结果集对象设计以及如何在Vue项目中引入axios和ElementUI。还展示了基本的前端页面模板结构。

摘要由CSDN通过智能技术生成

1.springApplication 配置文件

server:
  port: 80
  servlet:
    context-path: /
spring:
  datasource:
    # 数据库链接配置
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://localhost:3306/bookstore?useUnicode=true&characterEncoding=utf-8&useSSL=false&serverTimezone=Asia/Shanghai
    username: root
    password: 123456
    # 数据库连接池配置
    druid:
      initial-size: 100
      max-active: 1000
      min-idle: 10
      max-wait: 1000
#  # redis配置
#  redis:
#    host: 192.168.234.10
#    port: 6379

# mybatisPlus配置
mybatis-plus:
  mapper-locations: classpath*:/mapper/*.xml
  configuration:
    #打印SQL语句
    log-impl: org.apache.ibatis.logging.stdout.StdOutImpl
    #启用驼峰命名规则
    map-underscore-to-camel-case: true
  global-config:
    db-config:
      #配置逻辑的删除
      logic-delete-field: isDeleted
      #已删除
      logic-delete-value: 1
      #未删除
      logic-not-delete-value: 0

# 配置web日志
logging:
  level:
    web: trace

2.指定分页拦截器

@Bean
public MybatisPlusInterceptor mybatisPlusInterceptor(){
    MybatisPlusInterceptor mybatisPlusInterceptor = new MybatisPlusInterceptor();
    mybatisPlusInterceptor.addInnerInterceptor(new PaginationInnerInterceptor());
    return mybatisPlusInterceptor;
}

3.配置前端资源跨域请求

@Bean
public WebMvcConfigurer webMvcConfigurer(){
    return new WebMvcConfigurer() {
        /**
         * 跨域配置，需要一下配置：
         * 1.允许哪个主机访问当前系统
         * 2.允许那些请求访问
         * 3.当前系统允许哪些路径访问
         * @param registry
         */
        @Override
        public void addCorsMappings(CorsRegistry registry) {
            registry.addMapping("/**")//允许哪些资源跨域访问
                    .allowedMethods("*")//允许哪些请求访问（get、post...）
                    .allowCredentials(true)//是否允许使用凭证
                    .allowedOrigins("http://localhost:80");//允许访问的源(那台服务器可以访问)
        }

        public FormContentFilter formContentFilter(){
            return new FormContentFilter();
        }

    };

4.结果集对象

@Data
public class Result implements Serializable {
    private Integer code;
    private Boolean success;
    private String message;
    private Object data;

    private Result(Integer code, Boolean success, String message, Object data) {
        this.code = code;
        this.success = success;
        this.message = message;
        this.data = data;
    }

    public  static Result success(){
        return new Result(200,true,null,null);
    }

    public  static Result success(String message){
        return new Result(200,true,message,null);
    }

    public  static Result success(String message,Object data){
        return new Result(200,true,message,data);
    }


    public static Result fail(int code){
        return new Result(code,false,null,null);
    }


    public static Result fail(int code,String message){
        return new Result(code,false,message,null);
    }


    public static Result fail(int code,String message,Object data){
        return new Result(code,false,message,data);
    }

}

5.时间字段自动填充类

@Component
public class FillDateHandles implements MetaObjectHandler {
    @Override
    public void insertFill(MetaObject metaObject) {
        metaObject.setValue("createTime",new Date());
    }

    @Override
    public void updateFill(MetaObject metaObject) {
        metaObject.setValue("updateTime",new Date());
    }
}

6.Vue导入axios和ElementUI

//导入axios

import axios from 'axios'

//导入elementUI组件

import ElementUI from 'element-ui';

import 'element-ui/lib/theme-chalk/index.css';

//导入sweetalert2

import Swal from 'sweetalert2'

//设置Vue使用ElementUI组件

Vue.use(ElementUI);

/**

* 设置axios为Vue的原型属性

*/

Vue.prototype.$axios=axios.create({

//配置axios进行ajax请求的基础路径

baseURL: 'http://localhost',

//设置请求头

headers: {'X-Requested-With': 'XMLHttpRequest'},

// 是否允许使用凭证,是否允许cookie存储session

withCredentials: true, // 默认的

});

//将Swal注册为Vue的原型属性

Vue.prototype.$swal=Swal;

7.前端页面模板（上、中、下结构）

<template>

<div class="index">

<el-container>

<el-header>Header</el-header>

<el-main>

Main

</el-main>

<el-footer>Footer</el-footer>

</el-container>

</div>

</template>

<script>

export default {

data(){

return{

}

},

methods:{

},

created(){

}

}

</script>

<style scoped>

.el-header, .el-footer {

background-color: #B3C0D1;

color: #333;

}

.el-main {

background-color: #FFFFFF;

color: #333;

}

</style>