Vue整合SpringBoot项目实战之后端业务处理

本是古典何须时尚 2023-03-01 10:05 13阅读 0赞

# Vue+SpringBoot后台业务 #

Springboot实现CRUD，前后端分离

**技术栈**：

*  SpringBoot
 *  JPA

**源码**：

[前端项目代码][Link 1]

[后端项目代码][Link 2]

**系列文章**：

1.  [Vue整合SpringBoot项目实战之Vue+Element-Ui搭建前端项目][Vue_SpringBoot_Vue_Element-Ui]
2.  [Vue整合SpringBoot项目实战之动态路由处理][Vue_SpringBoot]
3.  [Vue整合SpringBoot项目实战之Vue+SpringBoot][Vue_SpringBoot_Vue_SpringBoot]
4.  [Vue整合SpringBoot项目实战之Element-ui组件][Vue_SpringBoot_Element-ui]
5.  [Vue整合SpringBoot项目实战之解决前后端分离的跨域问题][Vue_SpringBoot 1]

**重点**：跨域请求，可参见见[Vue整合SpringBoot项目实战之解决前后端分离的跨域问题][Vue_SpringBoot 1]这篇博客

package com.vuespringboot.demo.config;
    
    import org.springframework.context.annotation.Bean;
    import org.springframework.context.annotation.Configuration;
    import org.springframework.web.cors.CorsConfiguration;
    import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
    import org.springframework.web.filter.CorsFilter;
    import org.springframework.web.servlet.config.annotation.CorsRegistry;
    import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
    
    /** * @author Cody * @date 2020/7/17 - 14:08 */
    @Configuration
    public class CrosConfig implements WebMvcConfigurer { 
        private CorsConfiguration corsConfig() { 
            CorsConfiguration corsConfiguration = new CorsConfiguration();
            /* *请求常用的三种配置，*代表允许所有，当时你也可以自定义属性（比如header只能带什么，只能是post方式等等） */
            corsConfiguration.addAllowedOrigin("*");
            corsConfiguration.addAllowedHeader("*");
            corsConfiguration.addAllowedMethod("*");
            corsConfiguration.setAllowCredentials(true);
            corsConfiguration.setMaxAge(3600L);
            return corsConfiguration;
        }
    
        @Bean
        public CorsFilter corsFilter() { 
            UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
            source.registerCorsConfiguration("/**", corsConfig());
            return new CorsFilter(source);
        }
    }

## 注意事项： ##

*  修改配置数据库的信息
 *  需要用到IDEA中的Lombok插件(省略Get、Set方法)

[Link 1]: https://github.com/Relyonyou/Vue-Element-UI-demo
[Link 2]: https://github.com/Relyonyou/Vue-SpringBoot--demo
[Vue_SpringBoot_Vue_Element-Ui]: https://blog.csdn.net/qq_45077173/article/details/107546781
[Vue_SpringBoot]: https://blog.csdn.net/qq_45077173/article/details/107546832
[Vue_SpringBoot_Vue_SpringBoot]: https://blog.csdn.net/qq_45077173/article/details/107546812
[Vue_SpringBoot_Element-ui]: https://blog.csdn.net/qq_45077173/article/details/107546764
[Vue_SpringBoot 1]: https://blog.csdn.net/qq_45077173/article/details/107542793