質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

87.34%

[Spring Boot+thymleaf] 初期表示後について

解決済

回答 2

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 1,062

score 10

知りたいこと

htmlソースの頭に

<html xmlns="http://www.w3.org/1999/xhtml" 
xmlns:th="http://www.thymeleaf.org" 
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">

と記述しています。
これにより、画面の初期表示時にはth:replaceなどの機能が使えています。

しかし、表示後の画面を開発者ツールで確認すると、

<html xmlns="http://www.w3.org/1999/xhtml" 
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"> 

と、xmlns:th="http://www.thymeleaf.org"がまるっと消えてしまっています。
これは、普通のことなのでしょうか。

ちなみに、うちのプロジェクトで作っている画面はすべて上記のようになっています。
これが、thymeleafを使った画面すべてで起こることであるかを知りたいのです。

お手数ですが、
同じような環境でWEB画面を作っていらっしゃる方に、画面表示後の上記部分がじっさいどうなっているかを教えていただけたらありがたく思います。

よろしくお願いいたします。

試したこと

POMをいじったりはしました。が、あまり大胆にはいじれません。
(環境導入は他の者がやっており、その者はすでに現場を離れております)
環境設定に問題があると判明した場合に、設定の見直しにじっくり取り組みたいと思っています。

ほんとうにやりたいこと↓
https://teratail.com/questions/220456
がうまくいかない原因がどこなのかの切り分けができていません。
コードの書き方なのか、環境設定にミスがあるのか。
私は、htmlタグからxmlns:th="http://www.thymeleaf.org"が消えてしまうことが原因なのでは、
(初期設定のどこかが足りない?)
と考えています。そのため、
他の方の画面ではどうなっているのかを知りたいと思って、この質問をしています。

ちょっとだけ、ご自分のhtml(表示後)のタグを確認し、お知らせいただけないでしょうか。
現状を教えてくださるだけで、大変助かります。
どうかよろしくお願いいたします。

補足情報(FW/ツールのバージョンなど)

thymeleaf 3.0.11.RELEASE

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

check解決した方法

0

コントローラのアノテーション、@Controllerと@RestControllerの違いが原因でした。
タイムリーフ用のコントローラを切り出し、アノテーションを@Controllerにしたら、
返却文字列をタイムリーフが受け取ってくれました!

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/11/01 16:40

    ご質問の意味を取り違えていたら申し訳ありません。

    > と、xmlns:th="http://www.thymeleaf.org"がまるっと消えてしまっています。
    > これは、普通のことなのでしょうか。

    > ちなみに、うちのプロジェクトで作っている画面はすべて上記のようになっています。
    > これが、thymeleafを使った画面すべてで起こることであるかを知りたいのです。

    これが知りたいことだと理解して回答したのですが、下記の回答では不十分でしたでしょうか?

    > コンパイルによりth属性の部分が処理され、コンパイル結果のhtmlからは消えるので、下記の疑問点の答> えは”普通のこと”ということなります。

    キャンセル

  • 2019/11/12 13:16

    ありがとうございました。
    タグのth要素が画面表示後消えてしまうのは、あちこち検索して読んで知っていたのですが…。

    ヘッダ部分も消えてしまっては、あとからタイムリーフを利用するのは不可能なのでは?
    ほんとうに、他の人の画面でも、ヘッダ部分のxmlns:th="http://www.thymeleaf.org"が消えているのかしら。
    他の人の画面はどうなっているのか見たい!!!

    というのが、質問を書いた当時の気持ちでした。
    thだから消えてしまう。それは普通のこと。そうなのかもしれませんが、
    「自分のページもそうなってるよ!」
    っていう素朴な報告が、あの時、いちばん欲しかったのでした。

    そして、その画面に対してタイムリーフを使った差し替えなどができるのであれば、
    私のほうの問題(本題)は、ヘッダから"http://www.thymeleaf.org"が消えていることとは関係ない、と、
    可能性を一つ消すことができたわけです。
    (実際、本題の原因は別のところにありました)

    理論ではなく、実際が知りたい。
    というのも、私はわりと、頭だけでコードを完成させてから動かすタイプではなく、
    ある程度作ったら動かして、実際どうなるのか見ながら変更していく。というタイプなものですから。

    ともあれ、こちらの回答も不十分だったようで、大変失礼いたしました。

    キャンセル

0

テンプレートエンジン

Thymeleafはテンプレートエンジンです。

下記に、Tutorial: Using Thymeleaf (ja)の『1.1 Thymeleafって何?』という箇所から引用します。

Thymeleafは、ウェブとスタンドアローンどちらの環境でも利用できる、モダンなサーバーサイドJavaテンプレートエンジンです。HTML、XML、JavaScript、CSS、さらにプレーンテキストも処理することができます。

この引用文中の ”サーバーサイドJavaテンプレートエンジン”の通り、Thymeleafはサーバーサイドで動作する機能です。なのでブラウザ上に表示されたHTMLページに対してThymeleafのth属性を使って操作しても意味はありません。
つまりブラウザ上でHTMLページが表示された時点でThymeleafの役割は終了しているということになります。

テンプレートファイル

Spring Boot + Thymeleafでアプリケーション開発している場合、Javaのソースコードとともに*.htmlというファイルも作成していると思います。この*.htmlファイルは素のhtmlファイルではなく、Thymeleafのテンプレートファイルという位置付けになります。
このhtmlファイルがそのままブラウザに表示されるのではなく、Thymeleafテンプレートエンジンによってコンパイルされ、その結果のhtmlがブラウザに表示されます。

コンパイルによりth属性の部分が処理され、コンパイル結果のhtmlからは消えるので、下記の疑問点の答えは”普通のこと”ということなります。

と、xmlns:th="http://www.thymeleaf.org"がまるっと消えてしまっています。
これは、普通のことなのでしょうか。

たとえば、テンプレートファイルに下記の要素があり、hoge変数に"fuga"という値が与えられていた場合

<p class="primary" th:text="${hoge}">hoge</p>

これがコンパイルされると、ブラウザ上では

<p class="primary">fuga</p>

となります。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/11/01 16:27

    ご教示ありがとうございます。
    ほんとうに見た感じ、初期表示が終わった段階で、タイムリーフの役割は終わっているように見えますよね。

    キャンセル

  • 2019/11/12 16:23

    追記しますと、

    今回行っているタイムリーフによる部品差し替えは、
    ※html全体を再読み込みせずに! プルダウンだけ差替える。
    というものですが、
    html全体を再読み込みしないのに、表示されているhtmlにはタイムリーフ要素が残っていないのに、
    なぜ、表示後の画面に対して、タイムリーフによる差し替えが行えるのか。

    という疑問は残ります。もちろん、どこかにタイムリーフが隠れているのでしょうけれども。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 87.34%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る