如何在 IDEA 中創(chuàng)建并部署 JavaWeb 程序
前言
在之前 Java 的學(xué)習(xí)中，我們可能更多地是和控制臺程序打交道，也就是我們?nèi)粘Ｕf的黑框框程序。 現(xiàn)在既然完成了 Java SE 部分的基礎(chǔ)知識，是時(shí)候來學(xué)習(xí) JavaWeb 部分。而隨著 IDEA 的強(qiáng)勢崛起和不斷更新，使用 Eclipse 的同學(xué)可能會有些不習(xí)慣 IDEA。這一點(diǎn)確實(shí)是，IDEA 不同版本之間的操作和設(shè)置可能都有微小的變動，就算你之前一直使用的 IDEA，也可能會隨著 IDEA 的更新找不到某些隱藏在犄角旮旯的操作。
今天我們就來看看，如何在 IDEA 最新版中從零創(chuàng)建一個(gè) Java Web 項(xiàng)目，然后將其部署到 Tomcat 中，實(shí)現(xiàn)一個(gè)最簡單的 JavaWeb 小程序。
前排提升，寫作本博客時(shí)，博主使用的環(huán)境如下：
- IDEA 2021.3.2(Ultimate Edition)。
- Windows 11。
- Tomcat 9.0.52。
- JDK 11.0.11。
接下來就主要從創(chuàng)建項(xiàng)目、配置 Tomcat以及驗(yàn)證訪問三個(gè)部分來看看，如何在 IDEA 中創(chuàng)建、部署、運(yùn)行一個(gè) JavaWeb 項(xiàng)目。
創(chuàng)建項(xiàng)目
新建一個(gè) Java 項(xiàng)目
具體操作如下，依次進(jìn)入 File -> New -> Project，然后選擇左側(cè)的 Java 選項(xiàng)后默認(rèn)點(diǎn)擊 Next 即可。
選擇是否從模板創(chuàng)建
如果不勾選，此時(shí)創(chuàng)建出來的項(xiàng)目就是一個(gè)空項(xiàng)目。如果勾選上，就會創(chuàng)建一個(gè)最簡單的模板程序。這里默認(rèn)不勾選即可，直接點(diǎn)擊 Next 進(jìn)入下一步。
設(shè)置項(xiàng)目名
這里需要自己設(shè)置自己項(xiàng)目名以及項(xiàng)目所存放位置，Project name 為項(xiàng)目名，Project location 為項(xiàng)目存放地址。關(guān)于 More Settings 部分則不用管，會隨著我們設(shè)置好項(xiàng)目名和項(xiàng)目存放地址后自動變化。設(shè)置好之后，直接點(diǎn)擊 Finish 即可。
添加 Web 支持
項(xiàng)目創(chuàng)建完成之后，我們發(fā)現(xiàn)和之前的 Java SE 項(xiàng)目并沒有什么不同，而要將項(xiàng)目變成一個(gè) Java Web 項(xiàng)目，就需要添加 Web 支持。具體操作為：在項(xiàng)目上單擊鼠標(biāo)右鍵，然后選擇 Add Framework Support 選項(xiàng)卡。
然后會出現(xiàn)如下的選項(xiàng)供我們選擇，這里勾選 Web Application 即可，最后點(diǎn)擊 OK 完成。
項(xiàng)目目錄
完成上面的步驟之后，一個(gè)空白的 Java Web 項(xiàng)目就創(chuàng)建好了。創(chuàng)建好之后的項(xiàng)目目錄如下，這里會在 web 目錄下自動生成一個(gè) index.jsp 文件，現(xiàn)在大家都基本上拋棄了 jsp，所以我們一般都是選擇將其刪除。
D:\個(gè)人文件\代碼\IDEA\JAVAWEB-IDEA-DEMO
├─src
└─web
└─WEB-INF
配置 Tomcat
點(diǎn)擊工具欄的 Add Configuration，彈出 Run/Debug Configurations 窗口。
點(diǎn)擊左上角 + 號，選擇 Tomcat Server 下的 Local，注意不要選成了 TomEE Server 下的 Local。
配置相關(guān)屬性
這里主要配置 Name，也就是我們 Tomcat 服務(wù)器的名稱，可以保持默認(rèn)不變，也可以設(shè)置為自己喜歡的名字。
Application Serveer，也就是我們本地 Tomcat 安裝的路徑。
如果勾選 After launch，那么就會在項(xiàng)目運(yùn)行起來后自動在瀏覽器中打開項(xiàng)目主頁，這里的瀏覽器可以根據(jù)自己平常用的進(jìn)行選擇。
URL，即運(yùn)行后默認(rèn)打開的網(wǎng)址。
最后，一般還需要點(diǎn)擊右下角的 Fix，IDEA 就會自動配置好項(xiàng)目的虛擬路徑 Application context。
點(diǎn)擊上面的 Fix 步驟后，會自動跳轉(zhuǎn)到 Deployment 選項(xiàng)卡下，同時(shí) Server 下的 URL 會變成以下形式：
http://localhost:8080/javaweb_idea_demo_war_exploded/。
這里如果要想訪問項(xiàng)目主頁就很麻煩，為了方便直接通過 http://localhost:8080 就能進(jìn)入我們的項(xiàng)目，我們需要做如下配置。
首先是 Deploy 選項(xiàng)卡下的 Application Context 修改成 /。
然后將 Server 選項(xiàng)卡下的 URL 修改為：
http://localhost:8080/。
注意以下設(shè)置。為了實(shí)現(xiàn)熱部署，我們通常將 On Update action 選擇為 Redeploy，同時(shí)將 On frame deactivation 選擇為 Update classes and resources。這樣一來，通過部署后一旦出現(xiàn)代碼改動，IDEA 就會自動將我們的項(xiàng)目重新部署，而不用再去重新啟動服務(wù)器，實(shí)現(xiàn)實(shí)時(shí)更新。此外，JRE 設(shè)置這里默認(rèn)的是使用項(xiàng)目的 JRE 版本，如果要單獨(dú)設(shè)置，則可以在這里進(jìn)行改動。
驗(yàn)證訪問
之前我們說過，在我們新建項(xiàng)目并添加 Web 框架支持后，默認(rèn)會生成一個(gè) index.jsp，我們需要將其刪除。
而為了驗(yàn)證我們程序是否配置成功，我們需要將其運(yùn)行起來進(jìn)行驗(yàn)證。這里我們選擇創(chuàng)建了一個(gè) index.html，讓項(xiàng)目啟動后去訪問該頁面，如果出現(xiàn)預(yù)期內(nèi)容，則說明項(xiàng)目部署成功，否則則說明部署失敗。
其中 index.html 的內(nèi)容如下：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>主頁</title>
</head>
<body>
<p>你好，我是村雨遙</p>
</body>
</html>
然后啟動我們的 IDEA 項(xiàng)目，控制臺中就會打印出如下信息：
同時(shí)，瀏覽器將會自動彈窗訪問我們的 index.html。如果瀏覽器中正確出現(xiàn)如下圖中的信息，則說明我們的項(xiàng)目創(chuàng)建和部署就成功了。
注意
一般來講，完成上述的步驟之后，我們的項(xiàng)目就算創(chuàng)建、部署、運(yùn)行成功了。不過其中還是有幾點(diǎn)需要注意的地方，這里分別說明一下。
編譯輸出目錄
默認(rèn)情況下，項(xiàng)目編譯輸出的結(jié)果是在項(xiàng)目的 out 目錄下的，如果我們要改成自定義的路徑，就需要自己進(jìn)行設(shè)置。
我們一般自定義是選擇在 WEB-INF 目錄下創(chuàng)建一個(gè) classes 目錄，然后依次進(jìn)入 File -> Project Structure ，選擇項(xiàng)目設(shè)置中的 Modules 選項(xiàng)卡，在右側(cè)的 Paths 選項(xiàng)卡下選擇 Use module compile out path，并將 Output path 設(shè)置為我們創(chuàng)建的 classes 目錄即可。
項(xiàng)目訪問端口
默認(rèn)情況下，IDEA 給每個(gè)新建的項(xiàng)目分配的接口都是 8080，如果我們想要自定義，則需要在配置 Tomcat 時(shí)注意，設(shè)置位置如下。
總結(jié)
OK，今天的學(xué)習(xí)就到這里了!
