レガシーなプロジェクトにあたると、いまだに JSP 書いていたりすることがあります。IDE も eclipse だったりするのですが、eclipse 以外で開発できないか気になったので、 VS Code で試してみました。
サンプルはこちらに上げています。
https://github.com/zu-min-g/apache-tomcat-vscode
Tomcat を入れるのが面倒だったので Docker で環境を作っています。Apache と AJP で繋ぐところも実現したかったので Apache も入れています。
結論としては Java 部分はデバッグや入力補完、その他もろもろ実用的なレベルです。ただ、 JSP はソースに色が付く程度で、ブレークポイント置いてステップ実行はできません。他の IDE だと、 IntelliJ IDEA は JSP デバッグできるらしいので、そちらを導入した方がよさそうです。
以下は実際に行ったことです。
必要な VS Code 拡張
{
"recommendations": [
"pthorsson.vscode-jsp",
"vscjava.vscode-java-pack",
"ms-vscode-remote.remote-containers"
]
}
- JSP の色付け
- Java の拡張パック
- コンテナの中で開発する
今回は上記の Visual Studio Code 拡張機能を使用します。
使うイメージ
version: '3'
volumes:
m2:
driver: local
networks:
backend:
driver: bridge
services:
tomcat:
image: tomcat:10-jdk11
volumes:
- m2:/root/.m2
- ./_docker/tomcat/server.xml:/usr/local/tomcat/conf/server.xml
- ./_docker/tomcat/tomcat-users.xml:/usr/local/tomcat/conf/tomcat-users.xml
- ./_docker/tomcat/context.xml:/usr/local/tomcat/webapps/manager/META-INF/context.xml
networks:
- backend
httpd:
image: httpd:2.4
volumes:
- ./_docker/httpd/httpd.conf:/usr/local/apache2/conf/httpd.conf
ports:
- 10080:80
networks:
- backend
使うイメージは以下の2つです。
- tomcat:10-jdk11
- httpd:2.4
tomcat は何となく新しいものにしました。JDK 11 なのは、 VS Code のプラグインが JDK 11 以上を必要としているためです。tomcat のコンテナに maven を入れるので、 `~/.m2` ディレクトリを残すように設定しています。
Apache (httpd) は 2.4 を入れます。
必要な設定ファイルだけローカルにコピーして修正し、マウントしています。設定は後述します。
AJP を設定
AJP を設定し、 Apache を経由して表示するようにします。
_docker/httpd/httpd.conf
に以下を追加しています。
ProxyPass / ajp://tomcat:8009/webapp/
今回 Tomcat のアプリは1つのみなので、 Apache のアクセスは全部 webapp アプリに回すようにしています。
_docker/tomcat/server.xml
に AJP の設定を入れます。
<Connector protocol="AJP/1.3"
address="0.0.0.0"
port="8009"
redirectPort="8443"
secretRequired="false" />
基本はコメントアウトされているものをそのまま使っていますが、secretRequired=”false” と address=”0.0.0.0″ を追加しています。Apache と Tomcat は別の IP になり、localhost での接続ではないためです。
manager アプリの有効化
コマンドでデプロイできるようにするため、manager アプリを有効化します。
.devcontainer/Dockerfile
に以下の記述を追加しています。
RUN cp -r /usr/local/tomcat/webapps.dist/manager /usr/local/tomcat/webapps/manager
manager はデフォルトだと無効なので、 webapps.dist ディレクトリから webapps へコピーしてあげる必要があります。
_docker/tomcat/tomcat-users.xml
に以下の設定を追加しています。
<role rolename="manager-gui"/>
<role rolename="manager-script"/>
<user username="admin" password="password" roles="manager-gui,manager-script" />
manager に接続するための ID とパスワードです。tomcat7-maven-plugin の設定で必要になります。
_docker/tomcat/context.xml
を編集して、以下をコメントアウトしましたが、今回は使用しませんでした。ローカル以外から manager にアクセスでないようにする設定を外す処置です。
<!-- <Valve className="org.apache.catalina.valves.RemoteAddrValve"
allow="127\.\d+\.\d+\.\d+|::1|0:0:0:0:0:0:0:1" /> -->
maven のインストール
.devcontainer/Dockerfile
に以下の記述を追加しています。
RUN curl -OL https://downloads.apache.org/maven/maven-3/3.6.3/binaries/apache-maven-3.6.3-bin.tar.gz && \
tar xzvf apache-maven-3.6.3-bin.tar.gz && \
mv apache-maven-3.6.3 /opt/ && \
rm -f apache-maven-3.6.3-bin.tar.gz
ENV MAVEN_HOME=/opt/apache-maven-3.6.3
ENV PATH=$PATH:$MAVEN_HOME/bin
特に特殊なことはしていません。落としてきた maven を/opt に配置してパスを通しています。
webapp プロジェクトの作成
Webapp Archetype
https://maven.apache.org/archetypes/maven-archetype-webapp/
上記を使用して、プロジェクトを初期化しました。
javax.servlet
サーブレットを作れるようにするため、以下の設定を pom.xml に追加しました。
<dependencies>
<!-- https://mvnrepository.com/artifact/javax.servlet/servlet-api -->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>servlet-api</artifactId>
<version>2.5</version>
<scope>provided</scope>
</dependency>
</dependencies>
tomcat7-maven-plugin
webapp/pom.xml
に以下を追加しました。
<!-- Tomcat plugin -->
<plugin>
<groupId>org.apache.tomcat.maven</groupId>
<artifactId>tomcat7-maven-plugin</artifactId>
<version>2.2</version>
<configuration>
<url>http://localhost:8080/manager/text</url>
<username>admin</username>
<password>password</password>
</configuration>
</plugin>
tomcat7 という名前ですが 10 でも使用できました。既に立ち上がっている tomcat にアプリをデプロイします。
先ほど設定した manager の ID とパスワードを指定しています。
tomcat を JPDA 有効にして立ち上げ
.devcontainer/Dockerfile
に以下の記述を追加しています。
ENV JPDA_ADDRESS=8000
CMD ["catalina.sh", "jpda", "run"]
デバッグするため、引数に JPDA を指定しています。参考
デバッグ設定
.vscode/launch.json
は以下のようにしました。
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "java",
"name": "Debug",
"request": "attach",
"hostName": "localhost",
"port": 8000,
"preLaunchTask": "deploy"
}
]
}
preLaunchTask の 定義は以下の通りです。(.vscode/tasks.json
)
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
{
"label": "deploy",
"type": "shell",
"command": "mvn -B tomcat7:redeploy -f \"${workspaceFolder}/webapp/pom.xml\"",
"group": "build"
}
]
}
デバッグ開始ボタンを押した時に、 tomcat7 の redeploy を実行してコンパイル&tomcat 配置を行います。その後 JPDA の 8000 ポートにアタッチしてデバッグを開始します。
まとめ
個人的に進めているなんでも VS Code で開発する計画がとん挫しそうですが、 eclipse ではいろいろ勝手にやってくれるので見えていなかった部分を触れたので勉強になったなと思います。
上記で紹介した以外の部分、 .devcontainer や .vscode 配下の設定ファイルも作りこんでいるので、 VS Code の環境設定の参考にしていただければと思います。