若依前后台分离项目不想配nginx部署方案

若依前后台分离框架不使用Nginx部署项目

1、修改ResourcesConfig 文件

以下是完整文件

@Configuration
public class ResourcesConfig implements WebMvcConfigurer {
    @Autowired
    private RepeatSubmitInterceptor repeatSubmitInterceptor;

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/**",Constants.RESOURCE_PREFIX + "/**")
                .addResourceLocations("classpath:/dist/","file:" + JuheConfig.getProfile() + "/")
                // 自定义 ClassPathResource 实现类，在前端请求的地址匹配不到对应的路径时，强制使用 /law/index.html 资源
                // 本质上，等价于 nginx 在处理不到 Vue 的请求地址时，try_files 到 index.html 地址
                // 想要彻底理解，可以调试 ResourceHttpRequestHandler 的 resolveResourceLocations
                .addResourceLocations(new ClassPathResource("/dist/static/index.html") {
                    @Override
                    public Resource createRelative(String relativePath) {
                        return this;
                    }

                });
        /** 页面静态化 */
        registry.addResourceHandler("/dist/**").addResourceLocations("classpath:/dist/static/");

        /** swagger配置 */
        registry.addResourceHandler("/swagger-ui/**")
                .addResourceLocations("classpath:/META-INF/resources/webjars/springfox-swagger-ui/")
                .setCacheControl(CacheControl.maxAge(5, TimeUnit.HOURS).cachePublic());
        ;
    }

    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/index").setViewName("index.html");
        registry.addViewController("/").setViewName("index.html");
        registry.setOrder(Ordered.HIGHEST_PRECEDENCE);
    }

    /**
     * 自定义拦截规则
     */
    @Override
    public void addInterceptors(InterceptorRegistry registry) {
        registry.addInterceptor(repeatSubmitInterceptor).addPathPatterns("/**");
    }

    /**
     * 跨域配置
     */
    @Bean
    public CorsFilter corsFilter() {
        CorsConfiguration config = new CorsConfiguration();
        config.setAllowCredentials(true);
        // 设置访问源地址
        config.addAllowedOriginPattern("*");
        // 设置访问源请求头
        config.addAllowedHeader("*");
        // 设置访问源请求方法
        config.addAllowedMethod("*");
        // 有效期 1800秒
        config.setMaxAge(1800L);
        // 添加映射路径，拦截一切请求
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", config);
        // 返回新的CorsFilter
        return new CorsFilter(source);
    }
}

新增的内容如下

 @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/**",Constants.RESOURCE_PREFIX + "/**")
                .addResourceLocations("classpath:/dist/","file:" + JuheConfig.getProfile() + "/")
                // 自定义 ClassPathResource 实现类，在前端请求的地址匹配不到对应的路径时，强制使用 /law/index.html 资源
                // 本质上，等价于 nginx 在处理不到 Vue 的请求地址时，try_files 到 index.html 地址
                // 想要彻底理解，可以调试 ResourceHttpRequestHandler 的 resolveResourceLocations
                .addResourceLocations(new ClassPathResource("/dist/static/index.html") {
                    @Override
                    public Resource createRelative(String relativePath) {
                        return this;
                    }

                });
        /** 页面静态化 */
        registry.addResourceHandler("/dist/**").addResourceLocations("classpath:/dist/static/");

     
    }

    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/index").setViewName("index.html");
        registry.addViewController("/").setViewName("index.html");
        registry.setOrder(Ordered.HIGHEST_PRECEDENCE);
    }

2、修改一下SecuritConfig.java文件 , 添加如下放开静态文件

其实就是新加入了 "/static/**", "/index"

 .antMatchers("/login","/juhe/**", "/register", "/captchaImage","/static/**", "/index").permitAll()

3、前台要修改的地方就2处 , 这个文件修改一下

把history改为hash

export default new Router({
  // mode: 'history', // 去掉url中的#
  mode: 'hash', // 去掉url中的#
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRoutes
})

把prod文件夹路径改为'/'  然后打包 npm run build:prod 

把打好的包放入admin下的resources文件夹下 , 如下:

然后启动项目自己就能访问前端页面了