Vert.x-Web通过包括对几种流行的模板引擎的开箱即用的支持,包括动态页面生成功能。您也可以轻松添加自己的。
模板引擎由描述TemplateEngine。为了渲染模板 render被使用。
使用模板的最简单方法不是直接调用模板引擎,而是使用 TemplateHandler。该处理程序根据HTTP请求中的路径为您调用模板引擎。
默认情况下,模板处理程序将在名为的目录中查找模板templates。可以配置。
处理程序将text/html默认使用内容类型返回渲染结果。也可以配置。
创建模板处理程序时,您传入所需的模板引擎实例。模板引擎未嵌入vertx-web中,因此,您需要配置项目以访问它们。为每个模板引擎提供了配置。
1、引入依赖
这里thymeleaf需要slf4j的依赖,但是他却自己没有导入,需要我们手动添加。
<dependency> <groupId>io.vertx</groupId> <artifactId>vertx-web-templ-thymeleaf</artifactId> </dependency> <dependency> <groupId>org.slf4j</groupId> <artifactId>slf4j-log4j12</artifactId> <version>1.7.30</version> </dependency>
2、编写TemplateVerticle程序
package vertx;
import io.vertx.core.AbstractVerticle;
import io.vertx.core.Promise;
import io.vertx.core.json.JsonObject;
import io.vertx.ext.web.Router;
import io.vertx.ext.web.templ.thymeleaf.ThymeleafTemplateEngine;
public class TemplateVerticle extends AbstractVerticle {
//声明Router
Router router;
//第一步 声明ThymeleafTemplateEngine
ThymeleafTemplateEngine thymeleafTemplateEngine;
@Override
public void start(Promise<Void> startPromise) throws Exception {
//初始化Router
router = Router.router(vertx);
//第二步 初始化ThymeleafTemplateEngine
thymeleafTemplateEngine = ThymeleafTemplateEngine.create(vertx);
//配置Router解析url
router.route("/").handler(
req -> {
var obj = new JsonObject();
obj.put("name", "Hello World from backend");
//第三步 ThymeleafTemplateEngine 直接 render
thymeleafTemplateEngine.render(obj,
"templates/index.html",
bufferAsyncResult -> {
if (bufferAsyncResult.succeeded()){
req.response()
.putHeader("content-type", "text/html")
.end(bufferAsyncResult.result());
}else{
System.out.println("error");
}
});
}
);
//将Router与vertx HttpServer 绑定
vertx.createHttpServer().requestHandler(router).listen(8888, http -> {
if (http.succeeded()) {
startPromise.complete();
System.out.println("HTTP server started on port 8888");
} else {
startPromise.fail(http.cause());
}
});
}
}3、需要在resources下面新建templates文件夹,并新建index.html文件
<!DOCTYPE html>
<html lang="en" xmlns:th="www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1 th:text="${name}"></h1>
</body>
</html>4、启动测试
