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、启动测试