【Eclipse】ページが表示されない（Whitelabel Error Page ）

# はじめに
著者が学習サイトを参考にブラウザへ「おはようございます」と表示させるコントローラーを作った際に、次のエラーが出た時の話です。

## エラーページ
存在しないページにアクセスしたときに表示される404エラーでした

![スクリーンショット 2023-06-23 8.51.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2765288/4525c725-0ad4-3834-64ee-3bc8855a4be0.png)

## 結論
編集したコントローラーのコードが`上書き保存`がされておらず、
上書き保存後、`ブラウザを更新`したら解決しました

## データ構造
![スクリーンショット 2023-06-23 9.03.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2765288/3d816a36-4c65-4e1a-c551-aebdf69205ff.png)



### LessonController.javaまでのパス
```java
/Applications/Eclipse_2023-06.app/Contents/workspace/spring_boot_introduction/src/main/java/com/example/controller/LessonController.java
```
### LessonController.javaの内容
```java:LessonController.java
package com.example.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

@Controller
@RequestMapping("/lesson")
public class LessonController {

    @GetMapping 
    @ResponseBody
    public String hello() {
        return "おはようございます";
    }

//　結果: "/lesson" にリクエストした場合
// ”おはようございます"と出力される
    
    @GetMapping("/sample")
    @ResponseBody
    public String sample() {
        return "こんにちは";
    }

//　結果: "/lesson/sample" にリクエストした場合
// ”こんにちは"と出力される

    
    @GetMapping("/sample2")
    @ResponseBody
    public String sample2() {
        return "こんばんは";
    }

//　結果: "/lesson/sample2" にリクエストした場合
// ”こんばんは"と出力される


}
```

## SpringBootは実行されている
ポート番号：8080
URL：http://localhost:8080/lesson/
![スクリーンショット 2023-06-23 9.15.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2765288/84b12a55-506c-50a2-9aec-c23955e3701a.png)

### なぜ解決策に気付いたのか

作成したLessonController.javaを`Eclipse`ではなく
`VSCode`で開いた場合、コードがほとんど記述されていなかったため

### Eclipseでどのような操作をしたのか(Mac)
Eclipseの画面をアクティブにした状態で`Cmd+S`にて上書き保存を実行
ブラウザを更新するとコントローラーに記述した内容が反映されていることを確認

![スクリーンショット 2023-06-23 8.51.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2765288/0d5d054d-5bca-bb3c-3605-043b6650c795.png)

## HTMLが表示されない

次のようにcontrollerのコードを修正した際、上書き保存をするも参照先のHTMLファイルを表示することができませんでした

```java:LessonController.java
package com.example.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
@RequestMapping("/lesson")
public class LessonController {
    @GetMapping("/sample")
    // HTMLをレスポンスにする場合、@ResponseBodyを必ず削除します
    // @ResponseBody
    public String sample() {
        return "index";
    }
}
```
ファイルやフォルダの構造には問題はありません

```html:index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello World</title>
</head>
<body>
 <span>Hello World</span>
</body>
</html>
```

### 結論

サーバーを一度停止して、再度サーバーを実行するとHTMLを読み込んで出力できました
![スクリーンショット 2023-06-23 17.19.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2765288/004c3113-43c5-3a53-ec09-04011a5e64a5.png)

## アプリケーションを再起動する

サーバーが稼働している場合はサーバーを停止させる
### サーバーを停止するボタン
![スクリーンショット 2023-06-23 16.49.43.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2765288/c3a2322f-4e03-55ba-5af3-52efc7c9df49.png)


アプリケーションを実行することによりWebサーバーが起動し、リクエストに応じたプログラムが動くようになります。

今回作成した対象のプロジェクトを右クリックで選択し、
`実行`→`Spring Boot アプリケーション` を選択します

![スクリーンショット 2023-06-23 9.54.30.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2765288/287aa584-ea43-798d-92d1-33b8d953450a.png)

実行することでコンソールに次の表示が出ていれば起動が完了しています

![スクリーンショット 2023-06-23 9.56.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2765288/39fd6205-ca88-bcce-ba30-2fc7023cdf71.png)

ポート番号も`8080`という番号が表示されています。

```http:/localhost:8080/lesson/sample 
Hello World
```





## 今後の対策
Eclipseに自動保存の設定を行う
#### 自動保存の設定手順
1. メニューバーから [Eclipse] > [設定] を選択します。
1. 左側のリストから [一般] > [エディタ] > [自動保存] を選択
1. 右側のペインに自動保存の設定が表示される。
1. [エディタの自動保存を有効にする] チェックボックスを選択
1. 自動保存を有効にし、自動保存するまでの間隔を指定する
未保存のエディタが指定した時間が経過すると自動的に保存される

![スクリーンショット 2023-06-23 9.22.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2765288/0cb0fa56-5c05-1607-4770-336685a560ea.png)
![スクリーンショット 2023-06-23 9.21.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2765288/2af125ea-7694-fc2d-8403-981c885c4ccc.png)

## あとがき
今回のWhitelabel Error Pageというエラーは頻繁に発生しているようでGoogleには結構な数の記事や質問が掲載されていました。フォルダ構造や名前の付け方など様々な解決方法を示されていましたが著者のケースとは該当せず解決に半日を要しました。
解決すると簡単なことでしたが、気づかないうちは難問なのでここに失敗例をアウトプットいたします。誰かのお役に立てれば幸いです。