h2 database console in html layout:fragment (Spring Boot + Java)

Question

I'm working on a Spring Boot application. I use main.html as a frame around all the other .htmls embedded. For this I use layout:fragment.

I also have a "DATABASE" menu in my navigaton bar, which points to the H2 database console.

Is it possible to embed this console into the main.html as fragment?

main.html's body:

<body>
        <div class="container">
            <nav class="navbar navbar-default">
                <ul class="nav navbar-nav">
                    <li><a href="/">HOME</a></li>
                    <li><a href="/blogs">BLOGS</a></li>
                    <li><a href="/bloggers">BLOGGERS</a></li>
                    <li sec:authorize="hasRole('ROLE_ADMIN')"><a href="/admin">ADMIN</a></li>
                    <li sec:authorize="hasRole('ROLE_ADMIN')"><a href="/database">DATABASE</a></li>
                    <li><a href="/signup"><button id="signup-small-button" class="btn btn-success">SIGN UP</button></a></li>
                </ul>
                <div class="navbar-right">
                    <form sec:authorize="!isAuthenticated()" th:action="@{/loginfailed}" method="post">
                        <input th:value="${username}" type="text" name="username" placeholder="username" required class="login-input"/>
                        <input th:value="${password}" type="password" name="password" placeholder="password" required class="login-input"/>
                        <button type="submit" id="login-button" class="btn btn-success btn-xs">Log in</button>
                    </form>
                    <div sec:authorize="isAuthenticated()">
                        <span th:text="${#authentication.name + ' | '}" class="black"></span>
                        <form th:action="@{/logout}" method="post" id="logout-button-form">
                            <button type="submit" id="logout-button" class="btn btn-primary btn-xs">Log out</button>
                        </form>
                    </div>
                </div>
            </nav>
            <div layout:fragment="content"></div>
            <footer>
                <hr/>
                <p id="footer">Made by hazazs (©Copyrighted by hazazs™)</p>
            </footer>
        </div>
</body>

please refer these links [link1](https://stackoverflow.com/questions/62043022/spring-boot-thymeleaf-show-database-records-in-custom-fragments) and [link2](https://stackoverflow.com/questions/55750955/share-data-via-thymeleaf-fragment) — gowridev, Oct 12 '20 at 14:37
I don't want to embed database data, but the whole console. Something like this: [link](https://i.imgur.com/RvT447U.png) — tibotka, Oct 13 '20 at 08:43
may be you are referring to [this](https://stackoverflow.com/questions/17803718/view-content-of-embedded-h2-database-started-by-spring) — gowridev, Oct 13 '20 at 14:12

score 1 · Accepted Answer · answered Oct 15 '20 at 08:54

The solution was a database.html file:

<html layout:decorate="~{layout/main}">
    <head>
        <title>DATABASE</title>
    </head>
    <body>
        <div layout:fragment="content" class="center">
            <iframe src="http://IP:PORT/h2" id="h2-console"></iframe>
        </div>
    </body>
</html>

And of course a @RequestMapping for "/database" which returns this html.

@RequestMapping(value = "/database", method = RequestMethod.GET)
    public String database() {
        return "database";
    }

application.yaml:

spring:
    h2:
        console:
            enabled: true
            path: /h2

h2 database console in html layout:fragment (Spring Boot + Java)

1 Answers1