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

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

新規登録して質問してみよう
ただいま回答率
85.49%
Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

Eclipse

Eclipseは、IBM社で開発された統合開発環境のひとつです。2001年11月にオープンソース化されました。 たくさんのプラグインがあり自由に機能を追加をすることができるため、開発ツールにおける共通プラットフォームとして位置づけられています。 Eclipse自体は、Javaで実装されています。

Thymeleaf

Thymeleaf(タイムリーフ)とは、Java用のテンプレートエンジンで、特定のフレームワークに依存せず使用することが可能です。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Spring Boot

Spring Bootは、Javaのフレームワークの一つ。Springプロジェクトが提供する様々なフレームワークを統合した、アプリケーションを高速で開発するために設計されたフレームワークです。

Q&A

解決済

4回答

2835閲覧

htmlで画像表示をさせたい

yamada.g

総合スコア1

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

Eclipse

Eclipseは、IBM社で開発された統合開発環境のひとつです。2001年11月にオープンソース化されました。 たくさんのプラグインがあり自由に機能を追加をすることができるため、開発ツールにおける共通プラットフォームとして位置づけられています。 Eclipse自体は、Javaで実装されています。

Thymeleaf

Thymeleaf(タイムリーフ)とは、Java用のテンプレートエンジンで、特定のフレームワークに依存せず使用することが可能です。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Spring Boot

Spring Bootは、Javaのフレームワークの一つ。Springプロジェクトが提供する様々なフレームワークを統合した、アプリケーションを高速で開発するために設計されたフレームワークです。

0グッド

0クリップ

投稿2022/08/31 00:37

編集2022/08/31 01:22

前提

環境 eclipse 4.15.0
お世話になります。
Javaやhtmlを始めたばかりの初心者です。
HTMLを使用してwebのlocal hostに画像を表示させようとしていますが画像が出ずaltの写真という文字だけがでてしまいます。エラーが出てしまいます。
画像はHTMLと同じフォルダに入っています。

templetsというフォルダにnew.htmlとaaaa.pngが入っています。
また、ほかのhtmlをcontrollerでボタンをクリックした際に画面遷移をしたりdbからデータを取得したりはできます。

実現したいこと

local hostに画像を表示させる

発生している問題・エラーメッセージ

Failed to load resource: the server responded with a status of 404 () aaaa.png:1

該当のソースコード

html

1 2<!DOCTYPE html> 3<html xmlns:th="http://www.thymeleaf.org"> 4<head> 5<meta charset="UTF-8"> 6<title>Insert title here</title> 7</head> 8<body> 9<img src="aaaa.png" alt="写真"> 10</body> 11</html> 12

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

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2022/08/31 01:07

追加情報はあなたの質問欄を編集して追記してください。ここは「質問への追記・修正の依頼」をする場所です。ただ、上の書き方ではなんだかわかりません。フォルダ/ファイル構成のようですが分かるように書いてください。
m.ts10806

2022/08/31 01:55

Markdownのcode内に書けば行頭のスペースも保持されるのでご活用を。 ※ディレクトリ階層なら提示可能な範囲で画面キャプチャとかでも良いですが
guest

回答4

0

ベストアンサー

Spring boot,thymeleafの話ですよね。
仕様上、静的リソース(画像、css、jsなどのファイル)は
src/main/resources/static
配下を見に行きますのでそちらに配備してください。
また、thymeleafから参照する際もその点意識して機能を利用したほうが良いです。

thymeleaf

1<img th:src="@{/aaaa.png}" alt="写真">

@{}はリンクなどでも使うので絶対に覚えておくべき記法です。サーブレットだとgetCotextPath()のような役割です

templates配下はあくまでテンプレートエンジンのテンプレートhtml(コンパイル前)であって静的リソースではありません。

投稿2022/08/31 01:51

編集2022/08/31 01:56
m.ts10806

総合スコア80842

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yamada.g

2022/08/31 03:58

ご回答ありがとうございます。 今まではsrc/main/resources/templetsに画像を入れていたのですが、staticに配置したところ画像が表示されました。 本当にありがとうございました。
guest

0

ブラウザのアドレスバーに new.html の url を入力して要求をかけるとブラウザに new.html が表示されますか?(問題の画像以外は表示されますか?)

new.html が表示され、かつ、

templetsというフォルダにnew.htmlとaaaa.pngが入っています。

・・・が正しければ、ブラウザのアドレスバーの url の new.html を aaaa.png に置き換えればその画像がブラウザに表示されるはずです。

表示されなくて 404 Not Found 応答が返ってくるとすると、上に書いた「templetsというフォルダにnew.htmlとaaaa.pngが入っています」は間違っているか、画像が存在しないということです。

調べてみてください。

投稿2022/08/31 02:06

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2022/08/31 02:16

SpringBootととしての実行であれば静的htmlのみを想定とした対応では表示されません。
m.ts10806

2022/08/31 02:18

おそらく質問者が正しい表現を知らないだけで「webのlocal hostに」とあるのとeclipseというところから、eclipse上でSpringbootプロジェクトを実行して画面表示させたいのだと推察されます。ですので、バックグラウンドがJavaフレームワークの動的Webプロジェクトです。
退会済みユーザー

退会済みユーザー

2022/08/31 02:21

> SpringBootととしての実行であれば静的htmlのみを想定とした対応では表示されません。 そうですか・・・ Spring Boot は全く知らないのではずれかもしれませんが、上に書いたように「 ブラウザのアドレスバーに new.html の url を入力して要求をかけるとブラウザに new.html が表示されますか?(問題の画像以外は表示されますか?)」の答えが Yes なら Web サーバーと静的ファイルだけの話になるのではないですか?
m.ts10806

2022/08/31 04:50

私の方もあくまで推測なので、あくまでSpringBootアプリケーションとしての実行だったら・・・で答えました。 実行手順も本来は質問本文に書いておいてもらいたいところですね。
guest

0

△△△△△△△△△△△△△△△△△△

投稿2022/09/01 11:10

MM_LL

総合スコア18

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

単純にそのhtml(?)と同じフォルダにaaa.pngが存在しないだけだと思います

投稿2022/08/31 00:40

yambejp

総合スコア114747

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.49%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問