SpringBootでマークダウンをHTMLに変換してThymeleafで表示する方法です。 マークダウンをHTMLに変換するライブラリとして flexmark-javaを使用しました。
build.gradle の dependencies に flexmark-java を追加します。
implementation 'com.vladsch.flexmark:flexmark-all:0.62.2'
markdown.html を作成し、Templateフォルダに追加します。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Markdown</title>
</head>
<body>
[(${html})]
</body>
</html>
/markdown エンドポイントを追加します。
markdown 変数を変換し、 html 変数に入れています。
@GetMapping("/markdown")
public String getMarkdown(Model model) {
// create parser and renderer instance
Parser parser = Parser.builder().build();
HtmlRenderer renderer = HtmlRenderer.builder().build()
String markdown = "# hello\n## world\n![Fried Shrimp Triangle](http://imgur.com/Jjwsc.jpg \"Sample\")"
// convert to markdown to html
Node document = parser.parse(markdown);
String html = renderer.render(document)
model.addAttribute("html", html);
return "markdown";
}
画面にアクセスすると以下のような画面が表示されます。
# 文字列 は <h1>文字列</h1> に、## 文字列 は <h2>文字列</h2> に変換されていることがわかります。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Markdown</title>
</head>
<body>
<h1>hello</h1>
<h2>world</h2>
<p><img src="http://i.imgur.com/Jjwsc.jpg" alt="Fried Shrimp Triangle" title="Sample" /></p>
</body>
</html>