springboot 删除路径下面所有文件_springboot集成vue项目，去掉访问路径中的#

问题描述：springboot中集成vue项目,由于要求用jar包部署方式,vue构建之后(路由为history模式)dist目录中文件直接放到/resources/static/底下,访问localhost:8080 可以访问到vue项目.路由跳转也没问题,但是问题是不能刷新和地址栏输入地址。

如果不是必须使用history模式的话，hash模式带#号完全不影响使用，不存在不能刷新和url输入访问的问题。history模式下,一刷新和输入地址都会被springboot的路由接管,报出error page.

当我们使用Vue开发时，一般会用到vue-router来作为前端路由，实现单页应用。vue-router提供了两种模式模拟一个完整的 URL：hash模式和history模式。

1. hash模式：使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。

// 查看id为1的文章

http://localhost:8888/#/view/1

2. history模式：URL 就像正常的 url，比较好看。

// 查看id为1的文章

http://localhost:8888/view/1

那么 vue-router默认是使用hash模式的，不需要额外的配置，如果我们想使用history模式该如何配置呢？

前端：

vue-router的mode: ‘history’

const router = new VueRouter({

mode: 'history',

routes: [...]

})

后端：

我使用的是SpringBoot，要在服务端增加一个覆盖所有情况的候选资源：如果 URL 匹配不到任何静态资源，则应该返回同一个 index.html 页面，这个页面就是你 app 依赖的页面。详细看vue-router的官方文档。

SpringBoot默认匹配不到URL时，会返回一个默认的页面，所以可以配置一下默认的配置Bean。具体配置参考下面内容(三种写法)：

第一种写法：实现ErrorPageRegistrar

@Configuration

public class ErrorConfigurar implements ErrorPageRegistrar {

@Override

public void registerErrorPages(ErrorPageRegistry registry) {

ErrorPage[] errorPages = new ErrorPage[2];

errorPages[0] = new ErrorPage(HttpStatus.NOT_FOUND, "/404.html");

errorPages[1] = new ErrorPage(HttpStatus.INTERNAL_SERVER_ERROR, "/500.html");

registry.addErrorPages(errorPages);

}

}

第二种写法：SpringBoot2.0之前的写法

@Bean

public EmbeddedServletContainerCustomizer containerCustomizer() {

return new EmbeddedServletContainerCustomizer() {

@Override

public void customize(ConfigurableEmbeddedServletContainer container) {

ErrorPage errorPage404 = new ErrorPage(HttpStatus.NOT_FOUND, "404.html");

container.addErrorPages(errorPage404);

}

};

}

第三种：SpringBoot2.0之后的写法

@Configuration

public class ErrorPageConfig {

/**

* SpringBoot2.0以上版本WebServerFactoryCustomizer代替之前版本的EmbeddedWebServerFactoryCustomizerAutoConfiguration

*

* @return

*/

//@Bean必须加上

@Bean

public WebServerFactoryCustomizer webServerFactoryCustomizer() {

//第一种：java7 常规写法

// return new WebServerFactoryCustomizer() {

// @Override

// public void customize(ConfigurableWebServerFactory factory) {

// ErrorPage errorPage404 = new ErrorPage(HttpStatus.NOT_FOUND, "/404.html");

// factory.addErrorPages(errorPage404);

// }

// };

// 第二种写法：java8 lambda写法

return (factory -> {

ErrorPage errorPage404 = new ErrorPage(HttpStatus.NOT_FOUND, "/404.html");

factory.addErrorPages(errorPage404);

});

}

}