言：在CGI（通用網關接口）編程風行的日子，人們紛紛尋思簡化并讓其更加靈活的新方法和新技術，包括PHP、JSP、ASP。1997年SUN公司推出了servlet，1999年初，SUN公司推出了JSP，實際上在servlet基礎上修改而成。JSP即Java服務器頁面（Java Server Page），將HTML和JAVA代碼使用某種方式結合起來，完成前后端的有效交互。本文通過JSP歷史回顧和應用總結來審視過去和開拓未來。

1.從實例項目入手

其實，從現在看來JSP依然極具魅力，據了解很多JSP老項目還在維護。下面使用STS作為IDE構建一個實例項目，先體驗其效果。

1.1 動態web項目模板

如下圖，使用new dynamic web project創建項目：

1.2修改文件編碼

進入preferences修改JSP文件的編碼：

1.3 編寫簡單的JSP文件

新增一個JSP文件到WebContent目錄，如下

然后檢查并修改編碼，應該都是UTF-8，如下圖：

如果不是，就修改。

1.4運行和測試

選中項目名稱，點郵件菜單的Run as ...-->Run on server

之后出現如下界面：

若沒有現存的tomcat server，就自己加一個。點Finish。然后自動調用chrome，界面如下：

自動調用瀏覽器設置的地方是windows-->Web browser菜單：

1.5增加功能：顯示IP地址

（1）顯示ip地址：getRemoteAddr

（2）變量聲明<%! %>

(3)表達式<%=%>

2.JSP語言介紹

2.1語法

2.2指令

2.3Page指令屬性

2.4行為標簽

行為標簽語法：<jsp:行為名稱 attribute="value" />

使用bean是最好用的行為標簽，例如，我們創建一個java類：

然后，在JSP中使用useBea/setProperty/getProperty三個行為標簽：

測試：

2.5隱含對象（默認創建的對象）

2.6判斷語句

判斷語句包括兩種：if else和switch case

示例如下：

2.7循環語句

循環語句包括兩種：for和while

示例如下：

2.8運算符

2.9變量類型

布爾值(boolean)：true 和 false;

整型(int)：與 Java 中的一樣;

浮點型(float)：與 Java 中的一樣;

字符串(string)：以單引號或雙引號開始和結束;

Null：null。

2.10表單處理

以下提供一個例子來說明：

（1）創建FormProcess.jsp文件：

其中提供了兩個input輸入框。

（2）再創建FormProcessMain.jsp文件，如下：

其中使用request對象的getParameter方法來獲取Get參數。

2.11過濾器

JSP過濾器實際上和Servlet過濾器一樣。

以下通過示例來說明：

（1）在web.xml中增加一個過濾器：

（2）然后創建過濾器處理類com.hunting.LogFilter，如下：

2.12JSTL（JSP標準標簽庫）

（1）核心標簽：

（2）格式化標簽：

（3）SQL標簽：

（4）XML標簽：

3.JSP歷史

下面從前后端分離角度展現JSP的產生和發展脈絡。

3.1互聯網的產生

1957年美國國防部（DoD）組建了高級研究計劃局（ARPA）。1961年7月，MIT工程師Leonard Kleinrock發表Information Flow in Large Communication Nets論文。1962年8月， MIT工程師J.C.R. Licklider和W. Clark發表On-Line Man Computer Communication論文。1967 2月，在ARPA IPTO PI會議上，Larry Roberts組織了有關ARPANET設計方案的討論?；ヂ摼W雛形ARPANET由此產生。

互聯網最初的目的是訪問和復制文件從一臺計算機到另一臺遠程計算機，兩臺計算機之間有網絡，但速度慢，而且經常專用于大學或者研究機構是昂貴的，不支持大規模用戶。1970年，ARPANET主機開始使用網絡控制協議(NCP)，這就是后來的傳輸控制協議(TCP)的雛形。

人們基于TCP/IP構建了更快的網絡，其中應用層文件傳輸協議(FTP)規范提供了交換這些文件的標準方法。1973年，文件傳輸協議(FTP)推出，用于在異構系統之間交換文件。FTP傳輸的文件并不能有效查看，因此發明了超文本標記語言(HTML)，使我們能夠在互聯網上看到文檔。

3.2萬維網的產生

1989年蒂姆伯納斯-李寫了一份關于建立一個通過網絡傳輸超文本系統的報告，其中創建了單行 HTTP 協議，這個協議在1991年被命名為HTTP/0.9，萬維網由此產生，1996年超文本傳送協議HTTP 1.0發布。

盡管FTP可以傳輸HTML文件，但是并沒有提供有效小文件傳輸機制和無狀態管理能力，超文本傳輸協議(HTTP)才被發明出來專門用于傳輸HTML文檔，HTTP是一種無連接/無狀態協議，這使得許多短連接更加有效，而且可以不使用密碼就可以獲取HTML文檔，這讓萬維網真正到來，真正體現了互聯網的快捷、免費思維。

3.3通用網關接口的產生

上面提到了TCP/IP，HTTP，FTP都是通信管道，后來大家把注意力轉向內容。我們感興趣的文件隨著IT技術的發展而快速爆發，例如數據庫快速發展導致各種應用系統快速發展。同時，數據的更新頻度更加快速，這種即時信息推動了互聯網流量快速增長。通過基于HTTP的HTML，最終用戶可以瀏覽位于遠程服務器上的文件。

當時，遠程服務器屬于局域網，局域網連接到互聯網需要專用設備，可惜的是這種專用設備并不好用（直到后來路由器和交換機被思科發明出來），因此通用網關接口(CGI)規范被制定出來，它允許Web服務器超越文件服務器并從內部數據庫中獲取數據，并動態更改HTML。

最初，CGI是在1993年由美國國家超級電腦應用中心（NCSA）為NCSA HTTPd Web服務器開發的，當年NCSA內部有一份簡單的CGI規范說明，后來在1997年Ken Coar領導的團隊制定了CGI1.1規范，并提交RFC。CGI規范是Web應用程序開發中的一個重大突破，確保了相同的CGI程序在不同的Web服務器上工作。

CGI成為傳遞動態內容的最常用手段。只是互聯網發展太快了，CGI的性能無法跟上，每個對CGI腳本的請求都會產生一個單獨的進程。這種設計讓CGI在高峰負載時也消耗大量資源。解決方案非常多，功能性和可伸縮性成為關鍵。

許多CGI替代者都采用服務器端編程技術來實現業務邏輯，包括ASP、ColdFusion、PHP和Perl等等，其中至今仍然在大量使用的是PHP ，PHP 繼承自一個老的工程，名叫 PHP/FI，PHP/FI 在 1995 年由 Rasmus Lerdorf 創建，最初只是一套簡單的 Perl 腳本，用來跟蹤訪問他主頁的人。然后，即使是PHP，最終由于可移植性和面向對象的編程設計，Java超越了PHP和其他CGI平臺。

3.4 JSP的產生

Java自1991年誕生以來已經走過了很長的一段路，當時Sun公司推出了“綠色計劃”，試圖集成數字消費設備，如電視機、CD播放機和計算機。OAK(名字來自高斯林窗外的一棵橡樹!)誕生了，但直到出現HotJava和小程序，才開始活躍起來。1995年，Sun發布了開源Java，向微軟發起了挑戰，反響巨大。這促使Java深入到服務器端開發領域。

Sun在Java中加入了Internet功能，并在1997年6月發布了servlet接口。servlet以CGI替代為目標。與CGI為每個請求啟動一個進程不同，servlet使用更細粒度的線程在單個進程中運行。servlet采用了更有效的體系架構，能夠應對互聯網上的復雜情況。Java servlet為開發Java Web組件提供了基礎。servlet優點是每個額外的并發請求帶來的額外開銷非常小。

servlet技術需要真正的Java編程技能才能有效應用，外觀和良好體驗為web應用帶來了巨大方便，但是圖像支持還不是那么良好。于是Sun公司在1998年發布了JavaServer Pages (JSP)，這來自于微軟ASP的啟發，也有些人說是復制的，它使得編寫動態HTML頁面變得容易。

使用JSP的使用非常簡單，有些工具（例如Dreamweaver）能讓非程序員來構建WWW網站前端頁面，當然要servlet帶動后端服務器代碼（例如javabean）才能完成完整的WWW網站構建工作，這樣構建的WWW網站具有模塊化、可維護、可伸縮和可移植優點，從而完成簡單網站到復雜Web應用程序的轉變，從而實現前后端分離。

JSP官方版本1.0和1.1都出現在1999年，都很受歡迎，版本1.2出現于2001年，是目前最流行的實現。

3.5 Node的產生

JSP終究還是含有Java代碼，前后端沒有徹底分離，因此人們在2009年發明了node-js，這讓前端開發人員崛起，他們單純使用HTML+CSS+JavaScript前端語言就能完成前端頁面的開發，而不需要使用含有各種后端交互印記的標簽。

于是，基于node-js的React、Angela、VUE框架成為潮流。

1），模板modify_jsp.ftl文件

<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<%
String childPath = request.getContextPath();
String basePath = request.getScheme()+"://"
	+request.getServerName()+":"+request.getServerPort()+ childPath +"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title></title>
	<%@ include file="/pub/scripts.jsp"%>

    <script type="text/javascript">

		function submit_save() {

			var varName_ = $("#name_").val();
			if(varName_ == null || varName_ == '') {
			    alert("請先輸入名稱！")
			    return false;
			} else {
                $("#modifyForm").submit();
			}
        }
			

		// 循環字段集，名稱字符與元素id獲取元素
		<#list mapDataList as listItm >
			美元符("井號${listItm.columnName}").val() 雙斜桿 ${listItm.columnComment}
		</#list>
				
    </script>
    
  </head>
  <body>
  		
		<!-- 標題區域 -->
		<div class="tleBg">
			<div class="title">
				<span class="txt"> <em></em><#list mapDataTableComment as listItmCom > ${listItmCom.columnComment} </#list>- 修改
				</span> <a href="javascript：;" class="search-hide"></a>
			</div>
			<div class="clr"></div>
		</div>
  		
  		<!-- 查詢維度區域 -->
		<div class="t_list" id="addtable">
			<form name="modifyForm" id="modifyForm" action="<%=childPath %>/<#list mapDataTableComment as listItmCom > ${listItmCom.columnName} </#list>Conter/<#list mapDataTableComment as listItmCom > ${listItmCom.columnName} </#list>ModifySave" method="post">
				<input type="hidden" name="tid" value="美元符左大括<#list mapDataTableComment as listItmCom > ${listItmCom.columnName} </#list>Dto.tid右大括" />

				<table border="0" cellspacing="0" width="100%" cellpadding="0" class="t_list_1">
					<tbody>

					
					<#list mapDataList as listItm >
						<tr style="line-height: 36px;">
							<td width="15%">
								 
							</td>
							<td width="20%" class="text" style="text-align: right;">
								${listItm.columnComment}：
							</td>
							<td>
								<input type="text" id="${listItm.columnName}" name="${listItm.columnName}" style="width: 300px;" class="inputStyle" value="美元符左大括${listItm.columnName}Dto.name_右大括" />
							</td>
							<td width="15%">
								 
							</td>
						</tr>
					</#list>
					
						
						<tr>
							<td width="15%">
								 
							</td>
							<td width="20%" class="text" style="text-align: right;">
								 
							</td>
							<td>
								<input type="button" id="btn_add" value="保 存" class="t_button_gray" onclick="return submit_save();" />
								<input type="reset" id="btn_rest" value="重 置" class="t_button_gray" />
							</td>
							<td width="15%">
								 
							</td>
						</tr>

					</tbody>
				</table>
			</form>
		</div>
  		
  </body>
</html>

（2），生成修改jsp文件

public class TestCls {

    public static void main(String[] args) throws Exception {
        TestCls testCls = new TestCls();
        String testT00_po = "testT00_user";
        String generFileName = testT00_po + "Modify.jsp";
        testCls.outTemplate(testT00_po, "用戶數據"
                , generFileName, "modify_jsp.ftl" );

        System.out.println("執行成功！");
    }

    // 輸出到模板
    private void outTemplate(String entryInfoPoName, String tableComment
            , String templateFileName , String templFileName ) throws Exception {

        Configuration configuration = new Configuration();
        String templateDir = "F:\\xbl\\myResource\\temp_test_";
        configuration.setDirectoryForTemplateLoading(new File(templateDir));
        Template template = configuration.getTemplate(templFileName);

        Map<String, List<EntryInfoPo>> dataMap = new HashMap<String, List<EntryInfoPo>>();
        List<EntryInfoPo> listEntryInfo = new ArrayList<EntryInfoPo>();
        listEntryInfo = testMetaAddComment();
        dataMap.put("mapDataList", listEntryInfo );

        // 表注釋
        dataMap.put("mapDataTableComment", testTableComment(entryInfoPoName, tableComment ));
        String generFileDir = "F:\\xbl\\myResource\\temp_test_\\gener_file_\\";
        File generFile = new File(generFileDir + templateFileName);
        if(generFile.exists()) {
            generFile.delete();
        }
        generFile.createNewFile();

        Writer outputWriter = new OutputStreamWriter(new FileOutputStream(generFile ) );
//        Writer outputWriter = new OutputStreamWriter(System.out );

        template.process(dataMap, outputWriter);
        System.out.println("輸出完成！");
        outputWriter.close();
    }

    // 表注釋
    private List<EntryInfoPo> testTableComment(String entryInfoPoName, String tableComment) throws Exception {

        List<EntryInfoPo> listTableComment = new ArrayList<EntryInfoPo>();
        EntryInfoPo entryInfoPo = new EntryInfoPo();
        entryInfoPo.setColumnName(entryInfoPoName);
        entryInfoPo.setColumnComment(tableComment);
        entryInfoPo.setUpperColumnName(firTextUpper( entryInfoPoName ) );
        listTableComment.add(entryInfoPo);
        return listTableComment;
    }

    // 首字母大寫
    private String firTextUpper(String scontext ) {
        int textLength = scontext.length();
        String sufText = scontext.substring(1, textLength);
        String firText = scontext.substring(0, 1);
        firText = firText.toUpperCase();
        String finText = firText + sufText;
        return finText;
    }

    private List<EntryInfoPo> testMetaAddComment() throws Exception {

        List<EntryInfoPo> listEntryInfoPo = new ArrayList<EntryInfoPo>();
        Connection connection = getDataBaseConnection();
        Statement statement = connection.createStatement();
        ResultSet resultSet = statement.executeQuery("show full columns from t00_user ");
        while (resultSet.next()) {

            String columnComment = resultSet.getString("Comment");
            String columnName = resultSet.getString("Field");
            columnName = columnName.toLowerCase();
            EntryInfoPo entryInfoPo = new EntryInfoPo();
            entryInfoPo.setColumnName(columnName);
            entryInfoPo.setColumnComment(columnComment);
            listEntryInfoPo.add(entryInfoPo);
        }
        return listEntryInfoPo;
    }
    private Connection getDataBaseConnection() throws Exception {
        // 連接數據庫
        Class.forName("com.mysql.jdbc.Driver");
        String databaseUrl = "jdbc:mysql://127.0.0.1:3306/grcdb05?useUnicode=true&characterEncoding=utf8";
        Connection connection = DriverManager.getConnection(databaseUrl, "root", "root");
        return connection;
    }
}

（3），注意替換空格及替換文字