TOC

Spring Bootによる口ひげの手引き

Spring Bootによる口ひげのガイド

1. 概要

この記事では、SpringBootアプリケーションでHTMLコンテンツを生成するためのMustacheテンプレートの使用に焦点を当てます。

これはlogic-less template engine for creating dynamic contentであり、その単純さから人気があります。

基本を知りたい場合は、introduction to Mustacheの記事を確認してください。

2. メーベン依存

Spring Bootと一緒にMustacheを使用できるようにするには、dedicated Spring Boot starterをpom.xml:に追加する必要があります。 


    org.springframework.boot
    spring-boot-starter-mustache


    org.springframework.boot
    spring-boot-starter-web

さらに、spring-boot-starter-webの依存関係が必要です。

3. テンプレートを作成する

例を示し、Spring-Bootを使用してWebページ上の記事を提供する単純なMVCアプリケーションを作成しましょう。

記事の内容の最初のテンプレートを書いてみましょう。 


    {{#articles}}
    
{{title}}

    
{{publishDate}}

    
{{author}}

    
{{body}}

    {{/articles}}

このHTMLファイルを保存します。たとえば、article.html, andはindex.html:で参照します。 


    {{>layout/article}}

ここで、layoutはサブディレクトリであり、articleはテンプレートファイルのファイル名です。

デフォルトの口ひげテンプレートファイル拡張子が。mustacheになっていることに注意してください。 この設定をプロパティでオーバーライドできます。 

spring.mustache.suffix:.html

4. コントローラ

それでは、記事を提供するためのコントローラーを作成しましょう。 

@GetMapping("/article")
public ModelAndView displayArticle(Map model) {

    List
 articles = IntStream.range(0, 10)
      .mapToObj(i -> generateArticle("Article Title " + i))
      .collect(Collectors.toList());

    model.put("articles", articles);

    return new ModelAndView("index", model);
}

コントローラーは、ページにレンダリングされる記事のリストを返します。 記事テンプレートでは、＃で始まり/で終わるタグarticlesがリストを処理します。

これは、渡されたモデルを反復処理し、HTMLテーブルのように各要素を個別にレンダリングします。 

 {{#articles}}...{{/articles}}

generateArticle()メソッドは、いくつかのランダムデータを使用してArticleインスタンスを作成します。

コントローラによって返されるArticleModelのキーは、articleテンプレートタグのキーと同じである必要があることに注意してください。

それでは、アプリケーションをテストしてみましょう。 

@Test
public void givenIndexPage_whenContainsArticle_thenTrue() {

    ResponseEntity entity
      = this.restTemplate.getForEntity("/article", String.class);

    assertTrue(entity.getStatusCode()
      .equals(HttpStatus.OK));
    assertTrue(entity.getBody()
      .contains("Article Title 0"));
}

また、以下を使用してデプロイすることにより、アプリケーションをテストすることもできます。 

mvn spring-boot:run

デプロイしたら、localhost:8080/article,を押すと、記事が一覧表示されます。

image

5. デフォルト値の処理

Mustache環境では、プレースホルダーに値を指定しないと、MustacheExceptionがメッセージ“No method or field with name ”variable-name …”.とともにスローされます。

このようなエラーを回避するには、すべてのプレースホルダーにデフォルトのグローバル値を指定することをお勧めします。 

@Bean
public Mustache.Compiler mustacheCompiler(
  Mustache.TemplateLoader templateLoader,
  Environment environment) {

    MustacheEnvironmentCollector collector
      = new MustacheEnvironmentCollector();
    collector.setEnvironment(environment);

    return Mustache.compiler()
      .defaultValue("Some Default Value")
      .withLoader(templateLoader)
      .withCollector(collector);
}

6. SpringMVCの口ひげ

それでは、Spring Bootを使用しないことにした場合に、SpringMVCと統合する方法について説明しましょう。 まず、依存関係を追加しましょう。 


    com.github.sps.mustache
    mustache-spring-view
    1.4

最新のものはhereで見つかりました。

次に、SpringのInternalResourceViewResolverの代わりにMustacheViewResolverを構成する必要があります。 

@Bean
public ViewResolver getViewResolver(ResourceLoader resourceLoader) {
    MustacheViewResolver mustacheViewResolver
      = new MustacheViewResolver();
    mustacheViewResolver.setPrefix("/WEB-INF/views/");
    mustacheViewResolver.setSuffix("..mustache");
    mustacheViewResolver.setCache(false);
    MustacheTemplateLoader mustacheTemplateLoader
      = new MustacheTemplateLoader();
    mustacheTemplateLoader.setResourceLoader(resourceLoader);
    mustacheViewResolver.setTemplateLoader(mustacheTemplateLoader);
    return mustacheViewResolver;
}

テンプレートが保存されるsuffix,、テンプレートの拡張、およびテンプレートのロードを担当するtemplateLoader,を構成する必要があります。

7. 結論

このクイックチュートリアルでは、Spring BootでMustacheテンプレートを使用し、UIに要素のコレクションをレンダリングし、エラーを回避するために変数にデフォルト値を提供する方法を検討しました。

最後に、MustacheViewResolver.を使用してSpringと統合する方法について説明しました。

いつものように、ソースコードはover on GitHubで利用できます。

Related