JHipster项目启动后默认的8080主页是空白页面？

背景

根据官网一步步地生成项目，他喵的启动后居然是一个空白页面，这怎么玩啊？还有这种操作的吗？跟说好的不一样啊！关于JHipster资料，国内少的可怜，几乎都是同一样的东西，纯介绍的文章，只好上stackoverflow上查了。

相似的情况

在stackoverflow找到了一个相似的提问，不过没有具体的解决方法，倒是里面的某个评论给了我很大的提示。


在开发阶段，通常使用

yarn start

来启动angular2，可以在开发过程中热加载修改后的代码，然后通过

./mvnw

来启动Spring Boot后端的api服务。

那么问题来了，我以后要上线的时候也要这样启动啊？(╯‵□′)╯︵┻━┻

解决过程

由于前端是angular2，虽然可以热加载方便开发者开发，但是上线也不会这样做的。

通过了解angular2，可以通过

ng build

打包好，然后可以直接访问主页。

我在项目的目录下执行

ng build

后，打包好的代码自动生成到target的www上面。

再次启动项目，还是空白页面，回到原点。

打开浏览器的F12的network，居然只有一个localhost？？？

不对啊！为什么只会有一个localhost呢？其他资源没有加载吗？有猫腻！

打开生成项目的代码，找到配置web资源的

WebConfigurer

，通过查看代码，我们可以看到：

public void customize(ConfigurableEmbeddedServletContainer container) {
MimeMappings mappings = new MimeMappings(MimeMappings.DEFAULT);
// IE issue, see https://github.com/jhipster/generator-jhipster/pull/711 mappings.add("html", "text/html;charset=utf-8");
// CloudFoundry issue, see https://github.com/cloudfoundry/gorouter/issues/64 mappings.add("json", "text/html;charset=utf-8");
container.setMimeMappings(mappings);
// When running in an IDE or with ./mvnw spring-boot:run, set location of the static web assets.
setLocationForStaticAssets(container);

/*
* Enable HTTP/2 for Undertow - https://twitter.com/ankinson/status/829256167700492288 * HTTP/2 requires HTTPS, so HTTP requests will fallback to HTTP/1.1.
* See the JHipsterProperties class and your application-*.yml configuration files
* for more information.
*/
if (jHipsterProperties.getHttp().getVersion().equals(JHipsterProperties.Http.Version.V_2_0) &&
container instanceof UndertowEmbeddedServletContainerFactory) {

((UndertowEmbeddedServletContainerFactory) container)
.addBuilderCustomizers(builder ->
builder.setServerOption(UndertowOptions.ENABLE_HTTP2, true));
}
}

其中，

setLocationForStaticAssets(container);

就是设置网站的静态资源的位置。眼看代码是没问题的，唯有debug救我。debug下面的代码：

private void setLocationForStaticAssets(ConfigurableEmbeddedServletContainer container) {
File root;
String prefixPath = resolvePathPrefix();
root = new File(prefixPath + "target/www/");
if (root.exists() && root.isDirectory()) {
container.setDocumentRoot(root);
}
}

通过debug发现，root的路径多了%20的字符导致找不到路径，%20就是空格，将空格去掉再试一试~

果然是这个问题，去掉空格之后就有内容了。

结案

看看目录的路径是否带有空格或者中文字符，有的话去掉试试看。