Whitelabel Error Page (404)だと...??!!!
はじめに
Spring Boot を使ってWebアプリを作成したく、
Javaを勉強しSpring Bootを使い
初めてHello Worldを実行しようとした、その時だった。。。
開発環境
- Java 19
- Spring Boot 2.7.5 maven project
- macOS Ventura (CPU:Intel)
Spring Bootとは
Springプロジェクト群をパッケージ化し、シンプルに活用できるフレームワーク
環境構築
Spring Initializr Java Support を追加
コード
src/main/java/com/exmaple/demo/HelloWorld.java
package com.example.demo;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.stereotype.Controller;
//import org.springframework.web.bind.annotation.RestController;
@Controller
public class HelloWorld {
@RequestMapping(value = "/", method = RequestMethod.GET)
public String Hello(Model model) {
model.addAttribute("title", "Hello World");
model.addAttribute("message", "Welcome to my site");
return "hello";
}
}
src/main/resources/templates/hello.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello</title>
</head>
<body>
<h1 th:text="${title}"></h1>
<p>
<div th:text="${message}" />
</p>
</body>
</html>
実行結果
下記のコマンドで実行
./mvnw spring-boot:run #開発環境にも書いてますがmacなので./で実行しています
http://localhost:8080にアクセスします。
え?ファ?うん?ほぅ!!!!ほぅほぅ!!ムキィィィィ!!
原因
これは、ファイルのパスの位置は特に問題ないです。
404ということもあり、ソースコードが眼中にない様な感じなのです。
何が問題なのでしょうか。
Spring Bootを使っている方からすると、笑ってしまう
そう! このJavaのソースコードです。
実はこのコード、とりあえずHTMLに値を入れて動かしたいために無理やり書いた結果、この様なコードを書いてしまったのです。
解決方法
Spring群のパッケージ、ツールの内容をしっかりと把握・理解して書くことです。
今回、このコードで実行に成功したコードを書きます。
そこには、Spring Bootを動かすための大事なライブラリ等が追記されます。
依存関係問題
HTMLを埋め込むためにThymeleafというテンプレートエンジンを使用するコードになっています。ですので
pom.xmlに追記する必要があります。
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
tyhmeleaf設定
thymleafを使用るためにhtmlファイルを使用する設定
src/main/resources/application.properties
#thymeleafを使用する
spring.thymeleaf.mode=HTML
Javaコード
個人的にわからないところをコメントアウトで追記したコードです。
src/main/java/com/exmaple/demo/HelloWorld.java
package com.example.demo;
import org.springframework.boot.SpringApplication; //
//tymeliefを使用する /src/templates/application/spring.thymeleaf.mode=HTML
import org.springframework.ui.Model; //Spring MVC thymeleafを使用するライブラリ addAtrributeを使ってvalueの値を代入
import org.springframework.web.bind.annotation.GetMapping; //GETリクエストされた際の
//import org.springframework.web.bind.annotation.RequestMapping; //数種のRequestのマッピング
//import org.springframework.web.bind.annotation.RequestMethod; // RequestMappingの引数の中で使える. リクエストの受付種類を method = RequesrtMethod.GET/POST
import org.springframework.boot.autoconfigure.SpringBootApplication; // Webページアプリ用,メソッドの戻り値が遷移先のview
import org.springframework.stereotype.Controller;
//import org.springframework.web.bind.annotation.RestController; //APIサーバーなどに使われる、XML JSON
@SpringBootApplication //このアノテーションで Spring Bootのアプリだと宣言します。
@Controller
public class HelloWorld {
public static void main(String[] args) {
SpringApplication.run(HelloWorld.class, args);
}
//リクエスト URL に対して、どのメソッドが処理を実行するか定義するアノテーション。GETでアクセスされたリクエストの場合
//@RequestMapping(value = "/", method = RequestMethod.GET)
//
@GetMapping("/")
public String Hello(Model model) {
model.addAttribute("title", "Hello World");
model.addAttribute("message", "Welcome to my site");
return "hello";
}
}
下記の関数でtitleという変数に代入してHTMLに渡すことができます
model.addAttribute("title", "Hello World");
model.addAttribute("message", "Welcome to my site");
src/main/resources/templates/hello.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello</title>
</head>
<body>
<h1 th:text="${title}"></h1> <!-- titleにHellowWorldが代入されている -->
<p>
<div th:text="${message}" />
</p>
</body>
</html>
実行結果
下記のコマンドで実行
./mvnw spring-boot:run #開発環境にも書いてますがmacなので./で実行しています
よっしゃ!!
これでSpring Boot × tyhmeleafの環境構築が完成です。
最後に
Pythonの様にこれやればあれやればどうにか動くと思わないほうがいいと思いました。
仕組みをしっかり知ってこれからもJava と Springの勉強に励んでいきます。