LoginSignup
3
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

@na2gashi(na2gashi)

VSCodeでSpring Bootをデプロイするまでに詰まった話【失敗談】

Last updated at Posted at 2023-01-27

概要

タイトルの通りです。
VSCodeでSpring Bootのモジュールをデプロイするまでに詰まった結果の解決方法のメモになります。
基本的に頭弱い人が環境構築した失敗談なので、茶のおともにでもお読みください。

対象読者

効率的な情報共有を目的とした文ではないので、なんか暇つぶしに読み物をしたい人。

筆者のスキル

  • Spring Boot
    • ずいぶん昔にHello Worldくらいは表示させたような、しなかったような
    • Spring Boot2.x系とSpring Boot3.x系の違いは分かってない
  • IDEの使用歴
    • JavaのIDEは今までEclipse
    • VSCodeはjavascriptを使用するときに使ってる
  • その他
    • ぶっちゃけ、新規でアプリ作るのってあんまりやってない
    • 英語から逃げ出したい

本記事の環境

  • OS
    • Windows 11
  • 使用IDE
    • VSCode(Visual Studio Code)
  • 拡張機能（主要なもののみ）
    • Extension Pack for Java (Microsoft)
    • Spring Initializr Java Support (Microsoft)
    • Community Server Connectors (RedHat)
  • Spring Boot
    • 3.0.2
  • JDK
    • 19.0.1
  • ネットワーク環境
    • proxy環境下（色々制約があります）

じゃあ、まずは拡張機能を追加しよっか

Extension Pack for Javaの追加

VSCodeはすでにインストール済みだったため割愛。
※proxy環境下ではsettings.jsonに http.proxy の設定をしないとあとあと困ることになるので設定しておきましょう。

VSCodeでJavaコーディングはしたことなかったが、「Extension Pack for Java」の拡張機能を導入することで開発ができるということで導入。

左側のサイドバーから拡張機能を選択して導入完了！
詰まるとこなし！

Spring Initializr Java Supportの追加

同じように「Spring Initializr Java Support」も同様にインストール。
詰まるとこなし！

Tomcatの拡張機能を導入・・・あれれ？おかしいぞ

参考にしていた記事でtomcatの拡張機能を入れるはずだが、拡張を検索してみると非推奨になっている。
image.png

しょうがないので、別の記事を参考にさせてもらって「Community Server Connectors」を追加。

じゃあ、Springのプロジェクトを作ろっか

[ctr] + [shift] + [p] でコマンドパレット起動！
「create」と打ち込んで Spring Initializr:Create a Maven Project... を選択してEnter!

image.png

なんか、色々選べますね・・・
とりあえず新しいのだったらええんちゃう？
SNAPSHOTはやめて 3.0.2 を選ぼう！

そのあと色々設定

  • 言語選択
    • Java
  • Group Id とかProject名
    • 適当に com.example と demo とか
  • パッケージタイプ
    • War
  • Java version
    • 19
  • dependncies
    • spring-boot-starter-web
    • spring-boot-devtools
    • lombok
    • spring-boot-starter-thymeleaf（候補に出なかったのであとから手動で入れた）

image.png
上の様な通知が来たのでOpenを押下。

proxy環境下で大体なにも設定していないときは、ここらへんでpomにエラーがくる。
mavenのsettings.xmlが読まれていないことが原因の一つにある。
VSCodeの設定を開き「Maven:User Settings」にsettings.xmlのパスを通す。

プロキシ環境下ではよくある(?)ことですが、settings.xmlを配置していても、この時にrepositoryから落としてこれなかった場合、この時点でpomにエラーが来ることがあります
その時は、mavenタブで「clean」を実行します

サンプル実行用にコーディングしますね

とりあえずブラウザから挨拶が欲しいので新しくクラスファイルを追加したい。

ちょっとちょっと！Javaのインポート保管されてないよ！どうなってんの！

「Extension Pack for Java」いれたのにコード書いてimportも保管されないよ！
こんなんじゃ開発できないよ！

サイドバーを確認してみるとしたのような表示が
image.png

なるほど。Javaのプロジェクトとして認識されていないのか。
「open a Java project foloder」のリンクを押せばいいんだな！？
リンク押下 > エクスプローラー起動 > フォルダ選択

反応なし

「VSCodeでJava開発はできない！終わり！」
ってしたかったけどそうも言ってられないため解決策を考える。

色々、挙動を見たところプロジェクトを読むときにRepositoryから落としきれていないことが判明（これだけで数時間）。
サイドバーの「Maven」タブから install をクリックしRepositoryからDL。
image.png

「BUILD SUCCESS」の表示が出ることを確認。

すると、「JAVA PROJECT」タブが読み込み中になるので待機。

結構読み込みに時間がかかるのでコーヒーブレイクでもしながら待機。
これでJAVA PROJECTが認識された。

image.png

ファイル構成

以下の通りにファイルを追加する。

─src
│  ├─main
│  │  ├─java
│  │  │  └─com
│  │  │      └─example
│  │  │          └─demo
│  │  │              │  DemoApplication.java
│  │  │              │  ServletInitializer.java
│  │  │              │
│  │  │              └─controller
│  │  │                      HelloController.java ★追加
│  │  │
│  │  └─resources
│  │      │  application.properties
│  │      │
│  │      ├─static
│  │      └─templates
│  │              hello.html ★追加

追加したファイル内容

HelloController.java
package com.example.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class HelloController {
    
    @GetMapping(path  = "/")
    public String hello(Model model) {
         model.addAttribute("message", "Hello VSCode for JAVA !!");
        return "hello";
    }
    
}
hello.html
<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8" />
        <title>Hello VSCode</title>
    </head>
    <body>
        <h1 th:text="${message}"></h1>
    </body>
</html>

Mavenでwarを作りますね

「MAVEN」から clean を実行。
「BUILD SUCCESS」の表示が出ることを確認。

サイドバーの「MAVEN」から package を実行。
「BUILD SUCCESS」の表示が出ることを確認。

targetディレクトリが生成され、warファイルが作成されることを確認。

└─target
    │  demo-0.0.1-SNAPSHOT.war　★コレ
    │  demo-0.0.1-SNAPSHOT.war.original

よし、Tomcatの準備だ！

Community Server Connector にtomcatを追加？

手順にそってサイドバーの「SERVERS」の「Community Server Connector」を右クリック。
Create new Server... をクリック。

image.png

「Download server?」と聞かれた。
「Tomcatなんて入れてないぜ！」という状態だったので「yes」を選択。
image.png

いっぱい選択できる至れりつくせりの状態だったので、「Apache Tomcat 10.0.8」を選択。
image.png

Tomcat・・・入らない・・・

しばし、コーヒブレイクタイムを挟むと右下の通知に以下のメッセージが・・・。
image.png

Unable to create the server: Extension backend error - failed to download runtime in time

日本語でOK。ではなく、tomcatのdownloadができないらしい・・・。
理由なんてわからなかったから、ひたすらネットを彷徨い以下のページを見つける。

要約すると同じような人たちはいっぱいて、tomcatを手動で認識させればよいみたい。

余談ですが、この後プロキシ環境下ではない環境で同じことをしたところすんなり導入できたので、環境の問題だと思われます

Tomcatを手動でDL

Apache TomcatからTomcatをDL。
エラー回避動画が、Tomcat9系を選択していたのでそれにならい9.0.71 を選択。

先ほどと同じように、「SERVERS」の「Community Server Connector」を右クリック。
Create new Server... をクリック。

「Download server?」の問いに「No,use server on disk」と元気よく答える。
image.png
エクスプローラーが起動するので、先ほどDLしたtomcatを選択。
画面に沿ってポチと押すと、「Community Server Connector」の下にtomcatが出現する。
image.png

デプロイだ！デプロイにかけろ！

Tomcatにモジュールを追加

用意したTomcatを右クリックし、Add Deployment を選択。
image.png

「File」か「Exloded」か聞かれるので、 File を選択。
エクスプローラー起動後、作成したwarファイルを選択。
「Do you want to edit optional deepoyment parameters?」と聞かれるので、 Yesを選択。
テキストボックスに、demo.warと入力しEnter。

無事、Serversにモジュールがデプロイされた(？)。
image.png

よっしゃ！Tomcat起動！

「SERVERS」タブのtomcatを右クリック。
Start Serverを押下、

image.png

出力タブに以下のメッセージが出たことを確認。

[main] org.apache.coyote.AbstractProtocol.start プロトコルハンドラー ["http-nio-8080"] を開始しました。
[main] org.apache.catalina.startup.Catalina.start サーバーの起動 [1736] ミリ秒

http://localhost:8080/ にアクセスし、tomcatが起動していることを確認。
そのあと、http://localhost:8080/demoと入力！・・・したはいいが画面でたのは404のページだった・・・。

どうして404何ですか？

自分のコーディングを疑うけども・・・

Spring、thymeleafでの環境で開発なんてほとんどしてこなかったので、自分のコードミスを疑いひたすら確認作業を行った。
だが、いくら見てもコードミスは見つからなかった。

何度もコーヒーブレイクを挟み、私のお腹がブレイクしそうだった。

しかし、どうも動きがおかしい。
通常モジュールが正常にデプロイされ、tomcatが起動するときに「モジュール上がりましたよー」みたいなログが出てもいいものだがそれがでない。

そんな中一日明、けネットの海に潜っていると一つの記事が目に入った。

この記事のラストの文を引用させて頂く。

そのためSpring Boot 3.0.0で作ったwarはTomcat 10.0.x以上でなければ正常に動作しない。逆にSpring Boot 2.7.x以前で作ったwarはTomcat 9.x以前でなければ正常に動作しない。

まじか

Tomcat側、Spring Boot側の確認をしてみる。

Tomcat

The Jakarta EE platform is the evolution of the Java EE platform. Tomcat 10 and later implement specifications developed as part of Jakarta EE. Tomcat 9 and earlier implement specifications developed as part of Java EE.

Spring Boot 3.0 Release Notes

Spring Boot 3.0 has migrated from Java EE to Jakarta EE APIs for all dependencies. Wherever possible, Jakarta EE 10 compatible dependencies have been chosen, including:
<割愛>
We’ve also upgraded to the latest stable releases of third-party jars wherever possible. Some notable dependency upgrades here include:
<割愛>
● SnakeYAML 1.32
● Tomcat 10
● Thymeleaf 3.1.0.M2

早い話、
「Spring Boot3から Java EEからJakarta EEに変わるわ。サードパーティ製のjarは気を付けてね。
大体以下のやつらは気を付ける対象やで」
という対象にTomcatがいたということだ。

Tomcatの準備（再）

なんか、ここからへんから脱力しもうどうでもよくなってきたけど、せっかくなので最後まで動かしてみる。

Tomcat10を手に入れる

Apache TomcatからTomcatをDL。
versionは 10.1.5 を選択。

適当な場所に配置してzipを解凍。

いつもの通り、「SERVERS」の「Community Server Connector」を右クリック。
Create new Server... をクリック。

「Download server?」の問いに「No,use server on disk」。
先ほどDLしたtomcat 10.1.5 を選択。

Tomcat・・・入らない・・・（再）

が、だめ！
image.png

なんでじゃー！！と叫びながら、前に見たTomcatのリストは「10.0.8」が最大だったこと思い出す。
image.png

再度、Apache tomcatからTomcat 10.0.8をDL。
同じ手順で、Tomcat 10.0.8を構成。

無事！Tomcat 10が入りました！
image.png

起動・・・そして・・・

Add Deployment を押下し、対象warをデプロイ。

コマンドパネルでServers: Start Serverを選択。

「出力」タブの流れる文字ををみつめていると、あの文字が・・・

  .   ____          _            __ _ _
 /\\ / ___'_ __ _ _(_)_ __  __ _ \ \ \ \
( ( )\___ | '_ | '_| | '_ \/ _` | \ \ \ \
 \\/  ___)| |_)| | | | | || (_| |  ) ) ) )
  '  |____| .__|_| |_|_| |_\__, | / / / /
 =========|_|==============|___/=/_/_/_/
 :: Spring Boot ::                (v3.0.2)

http://localhost:8080/demo/を叩く。

image.png

ページのソース.html
<!doctype html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>Hello VSCode</title>
    </head>
    <body>
        <h1>Hello VSCode for JAVA !!</h1>
    </body>
</html>

終わりに

軽い気持ちではじめたサンプルの実行が思った以上はまってしまいました。
反省することが多く、恥ずかしいことばかりですがこの手順がどこかの誰かの一助になれば幸いです。

軽い気持ちでバージョンを決めてはならねぇ・・・

補足

実際は、もっと馬鹿なことをやってましがあまりにもバカすぎたので割愛しました。
また、もともともVSCodeはインストール済みでしたのである程度setteings.jsonはいじり済みです。

わけあってVSCodeでJava開発するという話になり今回挑みましたが、結局IDEはIntelliJに決定し徒労におわりました。
供養としてネットの海に放流しますが、恥ずかしさのあまりいずれ消すかもしれません。

3
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
3
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?