【初心者向け】.jspファイルを始めて触るときの注意点・やるべきこと

Webサイトを作っていると、静的なサイトを作る際でも先方の環境によりいろいろなファイル形式で納品を求められることがあります。

今回はHTMLサイトかと思ったら.jspというファイル形式で納品してくださいと求められた話です。

この記事内では.jspファイルを納品する際の

• .jsp形式とは？
• 注意点
• やるべきこと
• 確認方法

をまとめています。

下手したら納品先で文字化けした、サイトが映らないなどのトラブルが発生します。

トラブル回避のため、全体感と回避策を知っておきましょう！

この記事を書いた人

ばく

• HTMLとPHP(WordPressしか勉強してない
• フリーのWebコーダーとして活動中

.jspとは?HTMLにJAVAを組み込めるファイル形式

.jspファイルとはそもそも何？
HTMLとは何が違うの？

.jspファイルはJavaServer Pages(JSP)という技術で使われる、「サーバー側で動くWebページのファイル」です。

HTMLをベースとしたコードにJAVAを埋め込むことができ、サイトを動的ページ生成するものです。

WordPressの関数などのイメージ近いですね！

HTML(静的なサイト)は内容を変更するのにコードを書き直す必要がありますが、動的なサイトは外部から情報を取り入れて、サイトに表示する内容を変更できます。

主に社内退勤管理システム、金融システム、官公庁・自治体システムなどで利用されています。

すこし古いシステム、レガシーと呼ばれるようなシステムに多く組み込まれているファイル形式です。

学んでおく必要はあるかな？

ガッツリ学ぶ必要はなく、注意点、動作方法、仕組みを知っておけばHTMLを制作出来る人なら問題ないと思います。

本格的に関わる人、社内業務に携わる人などは詳しく知っておいたほうがいいかもしれません。

フリーのWebコーダー・デザイナーであれば最低限の動かし方を案件が来た時に覚えればいいです。

.jspで納品するときの注意点

.jspファイルはHTMLをベースとしてJAVAが埋め込まれる。

それならHTMLで作ったファイルを名前変えるだけでいいじゃん、思いました。

単純にHTMLファイルを変換するだけでは

• 文字化けを起こす可能性
• サイトが表示されない可能性

などがあります！

.jspの作法に則った書き方をして、「このファイルはjspだよ」とサーバー側に教える必要があります。

具体的にどんなところでつまずくのか、僕がやってみて分かったポイントを並べておきます。

特に①②は最初の関門です。「拡張子だけ変えれば動くでしょ」と思って納品すると、先方から「文字化けしてます」と連絡が来て焦るパターンです。

.jspファイルでやるべきこと

HTMLから.jspにリネームした時に一番最初やりたいことは

<%@ page language=”java” contentType=”text/html; charset=UTF-8″ pageEncoding=”UTF-8″%>

このコードを１行目に入れることです。

HTMLから.jspにリネームした時に、最低限やるべきことをまとめます。これだけやっておけば、ほとんどの納品は問題なく通ります。

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

今だったら、AIにコードをコピペしてjspに最適化して、といった指示出しで修正されます。

情報の取り扱いに気をつけつつ、便利に使いましょう。

.jspファイルの動作確認方法

.jspファイルはサーバー側で動くので、HTMLみたいにダブルクリックでブラウザに表示、というわけにはいきません。動作確認の選択肢を3つ並べておきます。

① 先方の環境にアップして確認してもらう（一番ラク）

正直、これが一番早いです。.jspが動く環境はクライアント側にすでにあるはずなので、ファイルを納品してテスト環境に置いてもらうのが確実。

「文字化け・表示崩れがないか確認お願いします」と一言添えると、先方も気持ちよくチェックしてくれます。

② Dockerで動作確認する【推奨】

Tomcatを直接インストールするのは大変ですが、Dockerなら3行のコマンドで.jsp環境が立ち上がります。一度試したら破棄もカンタンなので、Webコーダーにはこれが一番おすすめです。

手順1：作業フォルダに移動

ターミナルで、.jspファイルや画像・CSSが入っているフォルダに移動します。

cd /path/to/your-project

手順2：Tomcat コンテナを起動

以下のコマンド1行で、Tomcatサーバーが立ち上がり、現在のフォルダの中身が公開されます。

docker run -d --name jsp-test -p 8080:8080 -v "$(pwd)":/usr/local/tomcat/webapps/ROOT tomcat:10

初回はイメージのダウンロードに数分かかります。2回目以降は数秒で立ち上がります。

手順3：ブラウザで動作確認

ブラウザで以下のURLを開きます。

http://localhost:8080/index.jsp

ファイル名は対象の.jspに合わせて変更してください。文字化けなく表示されれば成功です。

手順4：ファイルを修正したら

.jspファイルを編集して保存すれば、ブラウザをリロードするだけで変更が反映されます。Tomcatを再起動する必要はありません。

※たまにキャッシュで反映されない場合は、シークレットウィンドウで開くか、Tomcatコンテナを再起動します。

再起動の際は以下のコマンドを叩きます。

docker restart jsp-test

手順5：終わったらコンテナを止める

動作確認が終わったら、コンテナを止めて削除します。

docker stop jsp-test
docker rm jsp-test

これで完全にクリーンな状態に戻ります。次の案件でまた使いたい時は、手順2のコマンドを叩くだけです。

③ オンラインのJSP実行環境を使う

OnlineGDB や paiza.io のようなオンラインIDEで、サクッとJSPの動作を試すこともできます。簡単な動作確認だけなら、これが一番手軽です。

個人的にはどれがおすすめ？

正直、フリーのWebコーダーレベルなら①の先方環境確認で十分です。Tomcat構築は重いので、案件が定期的に来るようになってから検討すればOK。

FAQ

HTMLファイルを.jspにリネームするだけで動きますか？

多くの場合、動きますが文字化けする可能性が高いです。1行目に page ディレクティブを追加して、UTF-8で保存し直すのを必ずやってください。

文字化けが直りません。どうすれば？

3つチェックしてみてください。①page ディレクティブが入っているか ②ファイル自体がUTF-8で保存されているか ③HTML内の meta charset も UTF-8 になっているか。この3つが揃えば、ほぼ解決します。

JSPのJavaコードまで書ける必要はありますか？

Webコーダーの納品レベルなら不要です。Javaコード部分は先方のエンジニアが書くケースがほとんどで、こちらはHTML/CSSを.jspの作法に沿って整えるだけでOKです。

フリーランスとして.jsp案件は受けるべき？

HTML/CSSが書けるなら受けてOKです。.jsp対応は他のコーダーが避けがちなので、できると単価が上がりやすいです。ただし「Javaコード書くところまで」と言われたら別の話になるので、最初に範囲を確認しましょう。

まとめ：HTMLさえ分かればすこしの工夫で.jspファイルも怖くない

.jspファイル、最初は身構えますが、HTMLが書ける人なら少しの工夫で対応できる形式です。

「.jspでお願いします」と言われた時に、慌てずに対応できる準備ができていれば、それだけで他のWebコーダーと差別化できます。

レガシーシステムの案件は地味に多いので、対応できると仕事の幅が広がりますよ。