前端時(shí)間我在寫(xiě)一個(gè)系列，是關(guān)于JavaWeb的一個(gè)入門(mén)級(jí)項(xiàng)目實(shí)戰(zhàn)，我的初衷就是打算寫(xiě)給初學(xué)者的，希望能對(duì)他們有所幫助。
這段時(shí)間博主也接觸了一些事情，感覺(jué)有必要專(zhuān)門(mén)把JSP的基礎(chǔ)拿出來(lái)說(shuō)明一下，因?yàn)檫€是很多人和我說(shuō)看不懂。
其實(shí)寫(xiě)博文真的是挺有挑戰(zhàn)性的一件事情，如何把知識(shí)點(diǎn)用通俗易懂的語(yǔ)言來(lái)表述出來(lái)呢?這真的是不太容易的。
首先，寫(xiě)教程需要大量的時(shí)間成本，我之前學(xué)習(xí)JavaWeb的時(shí)候，網(wǎng)上搜到的大部分博客，真心話我看不懂。因?yàn)槟菚r(shí)候的水平太菜了，看視頻又嫌太慢。
當(dāng)時(shí)我還喜歡抱怨，說(shuō)網(wǎng)上那些大牛明明水平很高，可為什么都不肯用大白話把技術(shù)點(diǎn)給講出來(lái)呢？當(dāng)時(shí)我記得，遇到問(wèn)題上網(wǎng)隨便一搜，看到的大部分文章，都是代碼一貼就完了。最多就是在文章最后寫(xiě)一行字說(shuō)明一下。
這對(duì)當(dāng)時(shí)小白的我真的是心累，而且，我往往看了很多博客，發(fā)現(xiàn)里面的代碼都是一樣的。這個(gè)時(shí)候就挺郁悶了。
博客精簡(jiǎn)一些自然有精簡(jiǎn)的好處，可是那主要是對(duì)于有好幾年工作經(jīng)驗(yàn)的程序員而言的，對(duì)新手來(lái)說(shuō)，無(wú)疑增加了閱讀的難度。
那時(shí)候我總想著，要是有一個(gè)真正意義上的，完全面向初學(xué)者的博客系列就好了，而不是代碼一貼，你們自己去意會(huì)吧。
好在博主終于度過(guò)了那個(gè)難熬的階段，然后某一天發(fā)現(xiàn)了簡(jiǎn)書(shū)這么好的互聯(lián)網(wǎng)產(chǎn)品，憑著一點(diǎn)激情和沖動(dòng)，還有一絲絲天真，開(kāi)始寫(xiě)我的第一篇博客。
寫(xiě)了之后才發(fā)現(xiàn)，寫(xiě)教程不難，可是要寫(xiě)出那種通俗易懂的教程是非常耗時(shí)間的，有的時(shí)候，我感覺(jué)知識(shí)點(diǎn)就應(yīng)該是這樣的，可是為了讓新人容易理解，我不得不花時(shí)間去組織語(yǔ)言和編寫(xiě)案例。
好幾次我都想退出簡(jiǎn)書(shū)不寫(xiě)了，因?yàn)閷?xiě)教程真的很累。可是看到自己寫(xiě)的文章閱讀量越來(lái)越多，而且大部分看我文章的人都是處于迷茫期的朋友。
我仿佛看到了當(dāng)年，剛走出校門(mén)的我自己。
于是，我決定繼續(xù)寫(xiě)下去，只是更新的話，不可能像之前有段時(shí)間那樣，仿佛打了雞血似地一天一更了。不過(guò)我還是盡量保證每周一到兩更，當(dāng)然，斷更也是有可能的。（額，我感覺(jué)自己有點(diǎn)輕微的潔癖，我竟然總是忍不住要區(qū)分 的，地，得 ）
當(dāng)然，不管怎樣，那個(gè)文章發(fā)布系統(tǒng)我肯定會(huì)堅(jiān)持寫(xiě)完的，畢竟做出了承諾。
======================= 我是萌萌的分割線 ===========================
好的，本系列對(duì)JSP，以及如何建立JavaWeb工程做一個(gè)講解，如果你在收看《文章發(fā)布系統(tǒng)》系列，而且基礎(chǔ)相對(duì)有些薄弱的話，也許這個(gè)系列可以幫到你。
這也算是《文章發(fā)布系統(tǒng)》系列的一個(gè)小分支，我會(huì)盡快寫(xiě)完，為什么要寫(xiě)呢？因?yàn)槲野l(fā)覺(jué)看我文章的大部分人還是初學(xué)者，有的甚至連web項(xiàng)目是啥都不知道，于是，我感覺(jué)有必要把基礎(chǔ)的東西做一個(gè)總結(jié)。
1. 實(shí)驗(yàn)環(huán)境準(zhǔn)備
（假設(shè)你已經(jīng)裝好了jdk，如果不會(huì)安裝jdk，請(qǐng)參考這篇文章）
1.1 安裝一個(gè)eclipse或者M(jìn)yEclipse（本文以eclipse為例），其實(shí)所謂的安裝就是網(wǎng)上去下載一個(gè)eclipse，然后解壓一下就好了。
1.2安裝tomcat，網(wǎng)上下載一個(gè)，然后解壓一下。我這次使用的tomcat容器配的是8080端口。
1.3 將tomcat配置到eclipse中。具體步驟為：Window -- Preferences -- Server -- Runtime Environment -- Add 將tomcat解壓后的路徑配置上去就行了。
本文假設(shè)讀者已經(jīng)對(duì)tomcat，eclipse有一定的了解。
2. 新建web項(xiàng)目
首先，一言不合就打開(kāi)eclipse
我們新建一個(gè)項(xiàng)目，F(xiàn)ile -- new -- Dynamic Web Project。
項(xiàng)目名稱(chēng)是web，點(diǎn)擊Next
build\classes是默認(rèn)的編譯目錄，還是點(diǎn)擊Next
好的，最后點(diǎn)擊Finish，一個(gè)web項(xiàng)目就建立好了。
目錄結(jié)構(gòu)
2.啥叫JavaWeb項(xiàng)目，它能干嘛？
JavaWeb項(xiàng)目就是一個(gè)應(yīng)用程序，你不要以為它有多么神秘。你每天打開(kāi)的QQ就一個(gè)應(yīng)用程序，你在手機(jī)上打開(kāi)的微信，百度地圖等等，這些都是應(yīng)用程序。
不同的是，QQ是一個(gè)本地客戶(hù)端程序，它需要你在自己的電腦上安裝一個(gè)客戶(hù)端，然后你打開(kāi)QQ，可以登錄，聊天。
QQ肯定也分客戶(hù)端和服務(wù)端，我們電腦上裝的就是客戶(hù)端，你要知道的一點(diǎn)是，我們發(fā)送消息，發(fā)送到哪里去了呢？
沒(méi)錯(cuò)，肯定是發(fā)送到QQ的服務(wù)器上了，那里保存著我們的所有數(shù)據(jù)。
想想也不可能在本地，因?yàn)槲覀冊(cè)陔娔X上發(fā)送的消息，在手機(jī)QQ上不是也能看到嗎？這就說(shuō)明，肯定是上傳到它的服務(wù)器然后保存下來(lái)了。
而Web項(xiàng)目是什么呢？
它也是一個(gè)應(yīng)用程序，只不過(guò)它的客戶(hù)端是運(yùn)行在瀏覽器上的。
我們打開(kāi)瀏覽器，訪問(wèn)一個(gè)地址，比如 http://www.itdecent.cn/
這個(gè)就是我們的訪問(wèn)路徑，我們通過(guò)這個(gè)URL向簡(jiǎn)書(shū)的服務(wù)器提交請(qǐng)求，然后服務(wù)器進(jìn)行處理，給你回應(yīng)。
接下來(lái)，我們就看到出來(lái)一個(gè)網(wǎng)頁(yè)。
我們?cè)谶@個(gè)網(wǎng)頁(yè)上可以寫(xiě)文章，點(diǎn)贊，收藏，等等。
我們的每一步操作，其實(shí)都和服務(wù)器做了一個(gè)交互。
比如一個(gè)登錄功能，當(dāng)我們鼠標(biāo)點(diǎn)擊那個(gè)登錄按鈕，瀏覽器就向服務(wù)器提交了一個(gè)請(qǐng)求，服務(wù)器進(jìn)行處理，然后操作數(shù)據(jù)庫(kù)。最終，它會(huì)得出一個(gè)結(jié)果，就是說(shuō)，到底能不能讓你登錄，總會(huì)有個(gè)說(shuō)法。
如果你密碼寫(xiě)錯(cuò)了，它可能就會(huì)得出一個(gè)用戶(hù)名或密碼錯(cuò)誤的結(jié)論。然后，這個(gè)信息會(huì)從服務(wù)器返回到前臺(tái)，前臺(tái)就是瀏覽器。
所謂的前臺(tái)就是你的瀏覽器，沒(méi)什么神秘的。
前臺(tái)接受到后臺(tái)傳過(guò)來(lái)的信息后，進(jìn)行一些處理，然后給你個(gè)提示，比如，告訴你用戶(hù)名或密碼錯(cuò)誤。
這就是一個(gè)完整的交互過(guò)程。
現(xiàn)在隨著網(wǎng)速越來(lái)越好，瀏覽器的性能越來(lái)越強(qiáng)大，我想web肯定是未來(lái)的大趨勢(shì)。畢竟，誰(shuí)都不希望在電腦上安裝一大堆客戶(hù)端吧。
只用一個(gè)瀏覽器多好。
有了web，我只需要有一個(gè)瀏覽器，然后就能通過(guò)互聯(lián)網(wǎng)獲取我想要的資源了。這樣不是很美妙嗎？
近幾年H5非常流行，尤其是移動(dòng)端，因?yàn)槭謾C(jī)瀏覽器基本上都支持css3。一樣的道理，我們肯定也不希望在手機(jī)上安裝一大堆應(yīng)用，卡都卡死了，如果能直接訪問(wèn)一個(gè)網(wǎng)頁(yè)，就能獲得我想要的服務(wù)就好了。
而且現(xiàn)在WIFI也普遍了，如果以后流量能沒(méi)有限制，那么APP的熱度很可能會(huì)逐漸被web取代。
當(dāng)然，現(xiàn)在是不太可能的，畢竟訪問(wèn)網(wǎng)頁(yè)要流量啊，而我在手機(jī)上安裝了APP，就好像電腦的QQ一樣，大部分資源文件就在我本地，我不需要每次都去聯(lián)網(wǎng)下載。比如圖片，app就沒(méi)事，因?yàn)榫驮诒镜?，可是如果用web，我每次訪問(wèn)那個(gè)網(wǎng)頁(yè)，就需要把圖片重新下載一遍。這樣不是很浪費(fèi)流量嗎？
3. 手工搭建web項(xiàng)目
現(xiàn)在，為了說(shuō)明服務(wù)器和web項(xiàng)目的概念，我們先不用eclipse，來(lái)手工搭建一個(gè)web項(xiàng)目。
服務(wù)器，正常情況下就是一臺(tái)配置高一點(diǎn)的電腦，除非是那種大型的專(zhuān)用服務(wù)器。
一般來(lái)說(shuō)，所謂的服務(wù)器，就是電腦。
比如我現(xiàn)在有一臺(tái)電腦，給他裝了一個(gè)linux系統(tǒng)或者windos系統(tǒng)，然后我說(shuō)，好了，從今以后，這就是服務(wù)器了?，F(xiàn)在服務(wù)器一般都是用linux系統(tǒng)的。
那么tomcat又是什么？
tomcat其實(shí)也是一個(gè)應(yīng)用程序，你網(wǎng)上下載的tomcat往往是一個(gè)壓縮包，然后我們解壓以后就相當(dāng)于安裝好了。
可以這么理解：
服務(wù)器就是一臺(tái)電腦，而tomcat是一個(gè)容器，專(zhuān)門(mén)存放web項(xiàng)目的容器。
以下我都將tomcat稱(chēng)為tomcat容器。
我們看到在tomcat容器根目錄下，有一個(gè)webapps文件夾
里面是這樣的：
好的，現(xiàn)在我要發(fā)布一個(gè)項(xiàng)目了，我只需要把一個(gè)已經(jīng)做好的web項(xiàng)目往里面一丟就行了。
除了webapps，我們還發(fā)現(xiàn)一個(gè)bin目錄。一般來(lái)說(shuō)，可執(zhí)行的文件都放在bin目錄下。
打開(kāi)bin，找到一個(gè)startup.bat文件。這就是啟動(dòng)tomcat的東西，雙擊它，tomcat就被啟動(dòng)了。
然后，瀏覽器可以訪問(wèn)tomcat里面的項(xiàng)目。
現(xiàn)在我們來(lái)手工搭建一個(gè)web項(xiàng)目，首先，在webapps目錄下新建一個(gè)文件夾，是的，就是文件夾，不管你項(xiàng)目是什么，肯定還是放在文件夾里面的。
項(xiàng)目名稱(chēng)就叫做webapp。
打開(kāi)webapp，根據(jù)web項(xiàng)目的規(guī)范，我們需要有一個(gè)WEB-INF文件夾。
然后，在WEB-INF文件夾里面，必須要有一個(gè)web.xml文件。
xml文件，就是一個(gè)描述性的文件，我現(xiàn)在的觀點(diǎn)如下：
XML = JavaBean = Json = HashMap
它無(wú)非就是描述一些東西，保存一些數(shù)據(jù)而已。
好的，我們?cè)诶锩嫘陆ㄒ粋€(gè)web.xml。這個(gè)文件非常重要，正因?yàn)樗拇嬖冢瑃omcat容器才會(huì)知道這個(gè)文件夾里面竟然是一個(gè)web項(xiàng)目。
否則，tomcat容器是不知道這個(gè)web項(xiàng)目的，它只會(huì)將myapp文件夾看做是一個(gè)文件夾而已。
我們用記事本打開(kāi)web.xml，將以下代碼拷貝進(jìn)去。
<?xml version="1.0" encoding="UTF-8"?>
<web-app>
<display-name>web</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
</web-app>
<?xml version="1.0" encoding="UTF-8"?>表示這是一個(gè)1.0版本的XML文件，編碼為UTF-8。
<web-app></web-app>就是這個(gè)XML文件的一個(gè)根節(jié)點(diǎn)，就是告訴你，我這個(gè)xml文件里面，有一個(gè)東西叫做web-app。
XML的一個(gè)作用就是配置文件，web.xml本身就是一個(gè)配置文件。在web項(xiàng)目中，我們應(yīng)用xml最多的也就是配置一些參數(shù)。
配置參數(shù)，就是給屬性賦值嘛，沒(méi)什么神秘的。
包括我們學(xué)習(xí)JavaSE，歸根到底，一直在做的一件事就是new對(duì)象，然后調(diào)用方法，調(diào)用方法的目的一方面是做一些事情，另一方面不還是給屬性賦值嘛。
你可以把web.xml看做是一個(gè)java類(lèi)，類(lèi)名叫做 webApp。它里面有兩個(gè)屬性，分別是display-name和welcome-file-list。
display-name是發(fā)布名稱(chēng)，也就是項(xiàng)目的名字。
welcome-file-list 是歡迎頁(yè)面，就是說(shuō)，當(dāng)你在瀏覽器直接訪問(wèn)這個(gè)myapp項(xiàng)目，默認(rèn)跳轉(zhuǎn)的頁(yè)面。
想象一下，應(yīng)該會(huì)變得非常好理解。
XML就是一個(gè)數(shù)據(jù)描述語(yǔ)言，我們通過(guò)web.xml描述這個(gè)項(xiàng)目的構(gòu)成和配置。
好的，接下來(lái)，我們是不是要給他一個(gè)歡迎頁(yè)啊。嗯，我們?cè)趙ebapp目錄下添加一個(gè)簡(jiǎn)單的歡迎頁(yè)，里面就打印一個(gè)HelloWorld。
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
這是一條JSP的page指令，如果你用面向?qū)ο蟮乃季S來(lái)看待這個(gè)玩意，就是new了一個(gè)page對(duì)象，并且給它里面的language，contentType，charset，pageEncoding屬性分別賦了值。
language表示JSP頁(yè)面所用的語(yǔ)言，默認(rèn)是java，其實(shí)你寫(xiě)不寫(xiě)都沒(méi)有關(guān)系，因?yàn)槟壳皝?lái)說(shuō)JSP它只支持Java。
我們來(lái)試一下，現(xiàn)在我們把language屬性去掉。就變成了這樣：
<%@ page contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
contentType="text/html; charset=UTF-8"：設(shè)置頁(yè)面的內(nèi)容是文本或者h(yuǎn)tml頁(yè)面，字符設(shè)置為UTT-8。
pageEncoding="UTF-8"：頁(yè)面編碼設(shè)置為UTF-8。
好的，現(xiàn)在我們?cè)赽in目錄，雙擊運(yùn)行startup.bat
啟動(dòng)完畢。
打開(kāi)瀏覽器，在地址欄輸入http://localhost:8080/myapp/
回車(chē)
哇，是不是出來(lái)了。
太棒了。
這就是手工搭建一個(gè)web項(xiàng)目的過(guò)程。
只要你符合web項(xiàng)目的規(guī)范，包括文件夾的名字，文件的名字，就會(huì)被tomcat容器識(shí)別為一個(gè)web項(xiàng)目。
接下來(lái)，我們來(lái)寫(xiě)服務(wù)器代碼。
在WEB-INF下面新建一個(gè)文件夾，名字叫做classes，這個(gè)也是規(guī)范，就叫這個(gè)名字，否則tomcat容器識(shí)別不了。
里面在創(chuàng)建一個(gè)java文件，名字就叫Hello吧
用記事本打開(kāi)，將下面的代碼拷貝進(jìn)去。
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class Hello extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request,response);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
System.out.println("已經(jīng)進(jìn)入服務(wù)器...");
}
}
這是一個(gè)比較簡(jiǎn)單的HttpServlet 程序，說(shuō)到servlet，他的意思就是服務(wù)器小程序。
原來(lái)，在英文中，但凡是let結(jié)尾的單詞，都有微小的意思。比如servlet，server是服務(wù)器，let結(jié)尾，那么就是服務(wù)器小程序。
servlet是Server Applet的縮寫(xiě)，我們?cè)賮?lái)看Applet，app是應(yīng)用程序，又是let結(jié)尾，所以應(yīng)該就是小的應(yīng)用程序。
這個(gè)就是所謂的英文詞根，也是學(xué)英語(yǔ)的一個(gè)竅門(mén)。類(lèi)似的例子還有很多，比如d開(kāi)頭的單詞，大部分都有往下，分開(kāi)，分散的意思。反正就是有一種往下，或者分發(fā)出去的韻味。
為了驗(yàn)證這個(gè)事情，我們打開(kāi)有道詞典隨便找?guī)讉€(gè)看看。
**distribution **
哦，對(duì)的，分配，配送，分發(fā)。這 不就是有分散，分出去的韻味嗎？
determine
確定，下決心。這不就是把什么什么東西定下來(lái)，定下來(lái)，不也是往下嗎？
所以，得出一個(gè)結(jié)論，d開(kāi)頭的單詞，而且，第二個(gè)字母必須是元音字母，比如de，di等。那么，這一類(lèi)單詞的情感色彩就有一種往下，或者分發(fā)出去的韻味。
再來(lái)說(shuō)說(shuō)servlet，let結(jié)尾都代表這個(gè)單詞是一個(gè)小型的東西，比如
piglet 小豬
starlet 小星星
再比如，psy開(kāi)頭的單詞，情感色彩就是偏向于精神和心理學(xué)方面的，
psychology 心理學(xué)
還有
這下子應(yīng)該比較好理解了吧，所以它為什么叫servlet，也是有原因的。
繼續(xù)，我們用命令行的方式將java文件編譯成class文件。
在編譯之前，我們先去tomcat容器的lib目錄找一個(gè)jar：
找到servlet-api.jar,復(fù)制一份，拷貝到classes目錄下。
然后，我們?cè)谠揷lasses目錄下，按住shift，鼠標(biāo)右鍵，選擇在此處打開(kāi)命令行窗口。
輸入javac -classpath servlet-api.jar Hello.java
class文件就出來(lái)了
再次打開(kāi)web.xml，我們還需要把這個(gè)servlet配上去，不然tomcat怎么知道這個(gè)servlet需要加入我們的web項(xiàng)目呢？
web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app>
<display-name>web</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>Hello</servlet-name>
<servlet-class>Hello</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>Hello</servlet-name>
<url-pattern>/hello</url-pattern>
</servlet-mapping>
</web-app>
雙擊startup.bat，啟動(dòng)tomcat容器
然后，在瀏覽器的地址欄輸入http://localhost:8080/myapp/hello
發(fā)現(xiàn)網(wǎng)頁(yè)上一片空白，回顧我們的servlet程序，按理說(shuō)控制臺(tái)會(huì)打印一句話的
看看控制臺(tái)：
果然如此。
你應(yīng)該也已經(jīng)發(fā)現(xiàn)了，我們手工搭建web項(xiàng)目的話，是不是很麻煩呀？所以，這也是為什么我們現(xiàn)在都用eclipse，或者M(jìn)yEclipse來(lái)開(kāi)發(fā)項(xiàng)目了。
這些IDE工具就是為了解決手工編譯的麻煩而出現(xiàn)的。
