若依前后台分离框架不使用Nginx部署项目
1、修改ResourcesConfig 文件
以下是完整文件
@Configuration
public class ResourcesConfig implements WebMvcConfigurer {@Autowiredprivate RepeatSubmitInterceptor repeatSubmitInterceptor;@Overridepublic 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") {@Overridepublic 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());;}@Overridepublic void addViewControllers(ViewControllerRegistry registry) {registry.addViewController("/index").setViewName("index.html");registry.addViewController("/").setViewName("index.html");registry.setOrder(Ordered.HIGHEST_PRECEDENCE);}/*** 自定义拦截规则*/@Overridepublic void addInterceptors(InterceptorRegistry registry) {registry.addInterceptor(repeatSubmitInterceptor).addPathPatterns("/**");}/*** 跨域配置*/@Beanpublic 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);// 返回新的CorsFilterreturn new CorsFilter(source);}
}
新增的内容如下
@Overridepublic 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") {@Overridepublic Resource createRelative(String relativePath) {return this;}});/** 页面静态化 */registry.addResourceHandler("/dist/**").addResourceLocations("classpath:/dist/static/");}@Overridepublic 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文件夹下 , 如下:
然后启动项目自己就能访问前端页面了