普通はeclipseでJavaの開発をするでしょう。しかし所詮ペダンチストの私はもっと軽いもので作成したくてVsCodeを使うことにしました。
VsCodeは Microsoft Visual Studio Codeのことで、各種プログラムの開発、HTMLの開発で使用されています。いままで、PythonやJavaの開発で使ってきましたが、Javaをeclipseでやると私のパソコンでは重すぎて起動だけでもストレス。そこでVsCodeはJavaServletもできるはずだと、ググったら色々でてきて、開発もできそうなのでまとめてみます。
MAVENを(メイヴェン)を使ってみる
MAVENというC言語のmakeのような開発ツールを使います。しかし、VsCodeでJavaを開発しようとすれば当然Extension Pack For Javaを入れていると思います。実はそこにMaven for Javeがすでに入っています。なのでそれを使うことにします。
コマンドプロンプトでもMAVENが使いたい人は、apache mavenをダウンロードして適当なフォルダーに展開し、binフォルダーにPathに通しておけば使えます。
VsCodeでMAVENを起動するには
CTRL+Shift+Pを使うか、表示メニューのコマンドパレットを使ってコマンドを入力します
そこで create mavenと入力して検索させると、Maven: Create Maven Projectと出てくるので、これを選択します。
次の一覧からmaven-archetype-webappを選択すると、今回やろうとしているwebアプリ用の環境を作るウイザードが走ります。
まずフォルダーを作る
ここで質問に答えていくと、ひな形のフォルダーが作成されます。
archetypeのバージョンを選びます。1.4にしました。今回は実験なのでとりあえず最新で。
次にグループIDを求められますが、これはドメイン名の逆さまでいいと思います。自分の所属する会社のドメイン名や架空のドメイン名で、他人との区別ができれば良いです。注意するべきは小文字しか使えないこと。何回も失敗して気づきました。私は架空のjp.co.etlabにしました。
次もまた小文字でartifact Idです。プロジェクトの識別IDです。
次にそのプロジェクトを保存するフォルダーを指定しますが、まだ作ってないはずですから、適当なworkspaceに当たるフォルダーの中にフォルダーを新規で作って実際のフォルダー名とします。これは大文字が入ってもいいです。そしてSelect Distinatinary Folderをクリックします。
すると、ターミナルにするするっとコマンドが流れて、次の画面を出して停止します。
一度、ターミナルの画面の中でクリックして黒いカーソルを出してからEnterキーを押します。
すると、指定した名前等が表示されて、Yと聞いてきます、これはYes?ということですので、yと小文字で入れてEnterキーを押します。
Enterキーを押せば終了です
左の上を見ると今作成されたプロジェクトができているので展開するとこんな風にできています。
当初、これでできたと思った私は何回も失敗することになるのですが、つまりこれは本当にひな形だけでまだ先があったんですね。
しかし、それだけでは足りない
eclipseで作成した時も、すこしフォルダーを修正したと思いますが、今回も修正が必要です。
\---vsservhello | pom.xml | \---src \---main \---webapp | index.jsp | \---WEB-INF web.xml
今回作成されたのはプロジェクト直下にpom.xmlという、得体のしれないxml
そして、srcフォルダーの配下にmain、webappと続き、その中にindex.jsp。これはとりあえずのものです。そして、そのまた配下にWEB-INFがありその中にweb.xmlがあるひな形になります。
ここに、今回のソースを作っていきます
まずsrc\mainの配下にjavaを作ります。
src\main\webappと表示されているエクスプローラーのmainをクリックしてから新しいフォルダーのアイコンをクリックすると、mainの配下にフォルダーを作れますので名前をjavaにします。
javaの配下にjpその配下にcoその配下にetlabのようにグループIDで宣言したドメイン名の逆の階層をを作っていきます。
そして最下位のフォルダーの中にサーブレットのjavaソースを作ります。こんな感じになります。
\---vsservhello | pom.xml | +---src | \---main | +---java | | \---jp | | \---co | | \---etlab | | ServHello.java | | | \---webapp | | index.jsp | | | \---WEB-INF | web.xml
ソースを入力
最下位のフォルダーに新規ファイルを追加、名前を入力すると、自動的にpackage名がつけられてクラスができるので内容を作ります。
しかし、import javax.servlet.ServletException;などと入力するとエラーになります。これはlibが通っていないからです。そこでpom.xmlを開いて次のdependencyをdependenciesの中に追加します
<dependency> <groupId>javax.servlet</groupId> <artifactId>javax.servlet-api</artifactId> <version>4.0.1</version> </dependency>
保存すると、ビルドファイルが書き変わったから作り直す?と聞いてきたらnowを押してください
MAVENのdependenciesの+アイコンから入れる方法もあるのですが、同じ名前の違うものがいっぱいありすぎて難しいので、このようにします。ただしバージョンはTOMCATのバージョンによって違うので調べてください。今回はTOMCAT 9.0.*なので4.0.1にしました。
package jp.co.etlab; import java.io.IOException; import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; @WebServlet("/ServHello") public class ServHello extends HttpServlet { private static final long serialVersionUID = 1L; protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //HTMLを出力 response.setContentType("text/html; charset=UTF-8"); PrintWriter out = response.getWriter(); out.println("<html>"); out.println("<head>"); out.println("<title>Hello, world</title>"); out.println("</head>"); out.println("<body>"); out.println("<p>Hello, world</p>"); out.println("</body>"); out.println("</html>"); } }
Mavenでコンパイル
ソースが書けたところで、コンパイルをしますが、今回はMavenを使ってみましょう。
手順があります。installしてcompileしてpackageする流れです。
左下の作成したいprojectのMavenを右クリックして最初installします。
続いて、compile、packageします。いずれもBUILD SUCCESSが表示されれば成功です。
packageができたら、プロジェクトのtargetフォルダーの中にwarファイルができています。
\---vsservhello | pom.xml | +---src | \---main | +---java | | \---jp | | \---co | | \---etlab | | ServHello.java | | | \---webapp | | index.jsp | | | \---WEB-INF | web.xml | \---target | vsservhello.war | +---classes | \---jp | \---co | \---etlab | ServHello.class | +---generated-sources | \---annotations +---maven-archiver | pom.properties | +---maven-status | \---maven-compiler-plugin | \---compile | \---default-compile | createdFiles.lst | inputFiles.lst | +---test-classes \---vsservhello | index.jsp | +---META-INF \---WEB-INF | web.xml | +---classes | \---jp | \---co | \---etlab | ServHello.class | \---lib javax.servlet-api-3.1.0.jar
TOMCATの起動
javaをWeb上で起動するにはServer側のサービスが必要です。今回はTOMCATを使います。以前はTOMCAT FOR JAVAを使用していましたが、斜線が入って使わないでくれということでしたのでCommunity Server conectorsに変えました。
ところが、これがなかなかうまくいかなくて1か月くらいここで時間が掛かりました。原因は、TOMCATのバージョンです。私はよかろうと思って最新の11にしていたんですが、動かず、10にして動かず、こりゃだめだと思ってもう一度検索していたら、結局Community server connectorsのサイトにたどりつき、よくよく見ればTOMCAT 9.0まで対応と書いてありました。
では、拡張機能でcommunity server connectorsを探してインストールしてください。この機能はTOMCATの保存場所であって、これでTOMCATができるわけではありません。インストールが終わったら、ここからTOMCATをINSTALLしていきます。
installができると、vscodeの左下にServersが追加されます。
そこのommunication...が入っていますので、右クリックして「Create New Server...」を選びます。
するとvscodeの上の方にServerを新たにdownloadするのか聞いてきますので「Yes」を選びます
今回は9.0.41を選びました。9.0.*の一番新しいものを選んでください。(2024/6/5現在。今後バージョンアップして10や11も使用できるようになると思います)。少しdownloadに時間が掛かります
downlooadできたらライセンスが表示されますので、「Continue」を押して内容を確認してください。
同意する場合は「Yes」をクリックします。
もしも、Defenderがinstallの同意を求めてきたら「アクセスを許可」してください。
installが終わったら左下のServersにtomcatが入ります。tomcatを右クリックして、「Start Server」をしてください。
プロジェクトの起動
targetフォルダーにできたwarファイルを右クリックして、メニューの一番下のRun on Serverをクリックします
これでlocalhost:8080/vsserverhello/が動けるようになっているはずなので、ブラウザーを開いてアドレスを入力します。
これはindex.jspの方の出力です。次に、urlに/ServHelloを追加してエンターして出てきたものがServLetが表示したものです。
Mavenで勝手にindex.jspが作られているので、こんがらがりますが、index.jspはh2で出ていますから大きいですね
さてこれでVsCodeでもServLetができることがわかりました。
warファイルは使いまわせる
さて今回作ったwarファイルですが、前回やったeclipseで作ったwarファイルと同様に、xamppのTOMCATに配置できます。やってみると同じになります。そりゃそうです、今回使ったTOMCATはxamppのTOMCATですから。次はデータベースともつないでみましょう