整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
段時間博主也接觸了一些事情，感覺有必要專門把JSP的基礎拿出來說明一下，因為還是很多人和我說看不懂。
其實寫博文真的是挺有挑戰性的一件事情，如何把知識點用通俗易懂的語言來表述出來呢?這真的是不太容易的。
首先，寫教程需要大量的時間成本，我之前學習JavaWeb的時候，網上搜到的大部分博客，真心話我看不懂。因為那時候的水平太菜了，看視頻又嫌太慢。
當時我還喜歡抱怨，說網上那些大牛明明水平很高，可為什么都不肯用大白話把技術點給講出來呢？當時我記得，遇到問題上網隨便一搜，看到的大部分文章，都是代碼一貼就完了。最多就是在文章最后寫一行字說明一下。
這對當時小白的我真的是心累，而且，我往往看了很多博客，發現里面的代碼都是一樣的。這個時候就挺郁悶了。
博客精簡一些自然有精簡的好處，可是那主要是對于有好幾年工作經驗的程序員而言的，對新手來說，無疑增加了閱讀的難度。
那時候我總想著，要是有一個真正意義上的，完全面向初學者的博客系列就好了，而不是代碼一貼，你們自己去意會吧。
好在博主終于度過了那個難熬的階段，然后某一天發現了簡書這么好的互聯網產品，憑著一點激情和沖動，還有一絲絲天真，開始寫我的第一篇博客。
寫了之后才發現，寫教程不難，可是要寫出那種通俗易懂的教程是非常耗時間的，有的時候，我感覺知識點就應該是這樣的，可是為了讓新人容易理解，我不得不花時間去組織語言和編寫案例。
好幾次我都想退出簡書不寫了，因為寫教程真的很累。可是看到自己寫的文章閱讀量越來越多，而且大部分看我文章的人都是處于迷茫期的朋友。
我仿佛看到了當年，剛走出校門的我自己。
于是，我決定繼續寫下去，只是更新的話，不可能像之前有段時間那樣，仿佛打了雞血似地一天一更了。不過我還是盡量保證每周一到兩更，當然，斷更也是有可能的。（額，我感覺自己有點輕微的潔癖，我竟然總是忍不住要區分 的，地，得 ）
當然，不管怎樣，那個文章發布系統我肯定會堅持寫完的，畢竟做出了承諾。
好的，本系列對JSP，以及如何建立JavaWeb工程做一個講解，如果你在收看《文章發布系統》系列，而且基礎相對有些薄弱的話，也許這個系列可以幫到你。
這也算是《文章發布系統》系列的一個小分支，我會盡快寫完，為什么要寫呢？因為我發覺看我文章的大部分人還是初學者，有的甚至連web項目是啥都不知道，于是，我感覺有必要把基礎的東西做一個總結。
（假設你已經裝好了jdk，如果不會安裝jdk，請參考這篇文章）
1.1 安裝一個eclipse或者MyEclipse（本文以eclipse為例），其實所謂的安裝就是網上去下載一個eclipse，然后解壓一下就好了。
1.2安裝tomcat，網上下載一個，然后解壓一下。我這次使用的tomcat容器配的是8080端口。
1.3 將tomcat配置到eclipse中。具體步驟為：Window -- Preferences -- Server -- Runtime Environment -- Add 將tomcat解壓后的路徑配置上去就行了。
本文假設讀者已經對tomcat，eclipse有一定的了解。
2. 新建web項目
首先，一言不合就打開eclipse
我們新建一個項目，File -- new -- Dynamic Web Project。
項目名稱是web，點擊Next
build\classes是默認的編譯目錄，還是點擊Next
好的，最后點擊Finish，一個web項目就建立好了。
目錄結構
JavaWeb項目就是一個應用程序，你不要以為它有多么神秘。你每天打開的QQ就一個應用程序，你在手機上打開的微信，百度地圖等等，這些都是應用程序。
不同的是，QQ是一個本地客戶端程序，它需要你在自己的電腦上安裝一個客戶端，然后你打開QQ，可以登錄，聊天。
QQ肯定也分客戶端和服務端，我們電腦上裝的就是客戶端，你要知道的一點是，我們發送消息，發送到哪里去了呢？
沒錯，肯定是發送到QQ的服務器上了，那里保存著我們的所有數據。
想想也不可能在本地，因為我們在電腦上發送的消息，在手機QQ上不是也能看到嗎？這就說明，肯定是上傳到它的服務器然后保存下來了。
而Web項目是什么呢？
它也是一個應用程序，只不過它的客戶端是運行在瀏覽器上的。
我們打開瀏覽器，訪問一個地址，比如 https://mp.toutiao.com
這個就是我們的訪問路徑，我們通過這個URL向簡書的服務器提交請求，然后服務器進行處理，給你回應。
接下來，我們就看到出來一個網頁。
我們在這個網頁上可以寫文章，點贊，收藏，等等。
我們的每一步操作，其實都和服務器做了一個交互。
比如一個登錄功能，當我們鼠標點擊那個登錄按鈕，瀏覽器就向服務器提交了一個請求，服務器進行處理，然后操作數據庫。最終，它會得出一個結果，就是說，到底能不能讓你登錄，總會有個說法。
如果你密碼寫錯了，它可能就會得出一個用戶名或密碼錯誤的結論。然后，這個信息會從服務器返回到前臺，前臺就是瀏覽器。
所謂的前臺就是你的瀏覽器，沒什么神秘的。
前臺接受到后臺傳過來的信息后，進行一些處理，然后給你個提示，比如，告訴你用戶名或密碼錯誤。
這就是一個完整的交互過程。
現在隨著網速越來越好，瀏覽器的性能越來越強大，我想web肯定是未來的大趨勢。畢竟，誰都不希望在電腦上安裝一大堆客戶端吧。
只用一個瀏覽器多好。
有了web，我只需要有一個瀏覽器，然后就能通過互聯網獲取我想要的資源了。這樣不是很美妙嗎？
近幾年H5非常流行，尤其是移動端，因為手機瀏覽器基本上都支持css3。一樣的道理，我們肯定也不希望在手機上安裝一大堆應用，卡都卡死了，如果能直接訪問一個網頁，就能獲得我想要的服務就好了。
而且現在WIFI也普遍了，如果以后流量能沒有限制，那么APP的熱度很可能會逐漸被web取代。
當然，現在是不太可能的，畢竟訪問網頁要流量啊，而我在手機上安裝了APP，就好像電腦的QQ一樣，大部分資源文件就在我本地，我不需要每次都去聯網下載。比如圖片，app就沒事，因為就在本地，可是如果用web，我每次訪問那個網頁，就需要把圖片重新下載一遍。這樣不是很浪費流量嗎？
現在，為了說明服務器和web項目的概念，我們先不用eclipse，來手工搭建一個web項目。
服務器，正常情況下就是一臺配置高一點的電腦，除非是那種大型的專用服務器。
一般來說，所謂的服務器，就是電腦。
比如我現在有一臺電腦，給他裝了一個linux系統或者windos系統，然后我說，好了，從今以后，這就是服務器了。現在服務器一般都是用linux系統的。
那么tomcat又是什么？
tomcat其實也是一個應用程序，你網上下載的tomcat往往是一個壓縮包，然后我們解壓以后就相當于安裝好了。
可以這么理解：
服務器就是一臺電腦，而tomcat是一個容器，專門存放web項目的容器。
以下我都將tomcat稱為tomcat容器。
我們看到在tomcat容器根目錄下，有一個webapps文件夾
里面是這樣的：
好的，現在我要發布一個項目了，我只需要把一個已經做好的web項目往里面一丟就行了。
除了webapps，我們還發現一個bin目錄。一般來說，可執行的文件都放在bin目錄下。
打開bin，找到一個startup.bat文件。這就是啟動tomcat的東西，雙擊它，tomcat就被啟動了。
然后，瀏覽器可以訪問tomcat里面的項目。
現在我們來手工搭建一個web項目，首先，在webapps目錄下新建一個文件夾，是的，就是文件夾，不管你項目是什么，肯定還是放在文件夾里面的。
項目名稱就叫做webapp。
打開webapp，根據web項目的規范，我們需要有一個WEB-INF文件夾。
然后，在WEB-INF文件夾里面，必須要有一個web.xml文件。
xml文件，就是一個描述性的文件，我現在的觀點如下：
XML = JavaBean = Json = HashMap
它無非就是描述一些東西，保存一些數據而已。
好的，我們在里面新建一個web.xml。這個文件非常重要，正因為它的存在，tomcat容器才會知道這個文件夾里面竟然是一個web項目。
否則，tomcat容器是不知道這個web項目的，它只會將myapp文件夾看做是一個文件夾而已。
我們用記事本打開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> </web-app>
<?xml version="1.0" encoding="UTF-8"?>表示這是一個1.0版本的XML文件，編碼為UTF-8。
<web-app></web-app>就是這個XML文件的一個根節點，就是告訴你，我這個xml文件里面，有一個東西叫做web-app。
XML的一個作用就是配置文件，web.xml本身就是一個配置文件。在web項目中，我們應用xml最多的也就是配置一些參數。
配置參數，就是給屬性賦值嘛，沒什么神秘的。
包括我們學習JavaSE，歸根到底，一直在做的一件事就是new對象，然后調用方法，調用方法的目的一方面是做一些事情，另一方面不還是給屬性賦值嘛。
你可以把web.xml看做是一個java類，類名叫做 webApp。它里面有兩個屬性，分別是display-name和welcome-file-list。
display-name是發布名稱，也就是項目的名字。
welcome-file-list 是歡迎頁面，就是說，當你在瀏覽器直接訪問這個myapp項目，默認跳轉的頁面。
想象一下，應該會變得非常好理解。
XML就是一個數據描述語言，我們通過web.xml描述這個項目的構成和配置。
好的，接下來，我們是不是要給他一個歡迎頁啊。嗯，我們在webapp目錄下添加一個簡單的歡迎頁，里面就打印一個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指令，如果你用面向對象的思維來看待這個玩意，就是new了一個page對象，并且給它里面的language，contentType，charset，pageEncoding屬性分別賦了值。
language表示JSP頁面所用的語言，默認是java，其實你寫不寫都沒有關系，因為目前來說JSP它只支持Java。
我們來試一下，現在我們把language屬性去掉。就變成了這樣：
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
contentType="text/html; charset=UTF-8"：設置頁面的內容是文本或者html頁面，字符設置為UTT-8。
pageEncoding="UTF-8"：頁面編碼設置為UTF-8。
好的，現在我們在bin目錄，雙擊運行startup.bat
啟動完畢。
打開瀏覽器，在地址欄輸入http://localhost:8080/myapp/
回車
哇，是不是出來了。
太棒了。
這就是手工搭建一個web項目的過程。
只要你符合web項目的規范，包括文件夾的名字，文件的名字，就會被tomcat容器識別為一個web項目。
接下來，我們來寫服務器代碼。
在WEB-INF下面新建一個文件夾，名字叫做classes，這個也是規范，就叫這個名字，否則tomcat容器識別不了。
里面在創建一個java文件，名字就叫Hello吧
用記事本打開，將下面的代碼拷貝進去。
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("已經進入服務器...");
}
}
這是一個比較簡單的HttpServlet 程序，說到servlet，他的意思就是服務器小程序。
原來，在英文中，但凡是let結尾的單詞，都有微小的意思。比如servlet，server是服務器，let結尾，那么就是服務器小程序。
servlet是Server Applet的縮寫，我們再來看Applet，app是應用程序，又是let結尾，所以應該就是小的應用程序。
這個就是所謂的英文詞根，也是學英語的一個竅門。類似的例子還有很多，比如d開頭的單詞，大部分都有往下，分開，分散的意思。反正就是有一種往下，或者分發出去的韻味。
為了驗證這個事情，我們打開有道詞典隨便找幾個看看。
**distribution **
哦，對的，分配，配送，分發。這 不就是有分散，分出去的韻味嗎？
determine
確定，下決心。這不就是把什么什么東西定下來，定下來，不也是往下嗎？
所以，得出一個結論，d開頭的單詞，而且，第二個字母必須是元音字母，比如de，di等。那么，這一類單詞的情感色彩就有一種往下，或者分發出去的韻味。
再來說說servlet，let結尾都代表這個單詞是一個小型的東西，比如
piglet 小豬
starlet 小星星
再比如，psy開頭的單詞，情感色彩就是偏向于精神和心理學方面的，
Paste_Image.png
psychology 心理學
還有
這下子應該比較好理解了吧，所以它為什么叫servlet，也是有原因的。
繼續，我們用命令行的方式將java文件編譯成class文件。
在編譯之前，我們先去tomcat容器的lib目錄找一個jar：
找到servlet-api.jar,復制一份，拷貝到classes目錄下。
然后，我們在該classes目錄下，按住shift，鼠標右鍵，選擇在此處打開命令行窗口。
輸入javac -classpath servlet-api.jar Hello.java
class文件就出來了
再次打開web.xml，我們還需要把這個servlet配上去，不然tomcat怎么知道這個servlet需要加入我們的web項目呢？
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，啟動tomcat容器
然后，在瀏覽器的地址欄輸入http://localhost:8080/myapp/hello
發現網頁上一片空白，回顧我們的servlet程序，按理說控制臺會打印一句話的
Paste_Image.png
看看控制臺：
果然如此。
你應該也已經發現了，我們手工搭建web項目的話，是不是很麻煩呀？所以，這也是為什么我們現在都用eclipse，或者MyEclipse來開發項目了。
這些IDE工具就是為了解決手工編譯的麻煩而出現的。
一篇我們介紹了如何解析CSV和JSON數據：如何解析互聯網數據：CSV和JSON篇，今天我們將介紹如何解析HTML和XML數據。
今天的介紹能夠幫助你輕而易舉地從網頁中（比如下面的中航電子的2017年一季度交易數據）提取自己想要的數據：
準備
在Python中可以解析html和xml數據的軟件包很多，今天我們介紹的是lxml，先安裝：
$ pip install lxml
如果不熟悉pip的使用，可以參考另一篇文章：如何管理python軟件包。
解析HTML數據
首先，回顧一下HTML的一些基本概念：
標簽／tag：比如<html>, <h1>, <head>...一般成對出現，例如開始標簽<html>和結束標簽</html>
元素／element：開始標簽到結束標簽整段代碼，標簽對之間的即為內容(content)
屬性／attribute：標簽可擁有key=value形式的屬性，比如<div class="header">...</div>
簡單地理解，HTML網頁就是由一組元素構成的一個集合。另外，大多數HTML標簽是可以嵌套的，因此元素可以包含一系列子元素。有了這些概念做基礎，我們將能夠很容易理解軟件包lxml的使用。實際上，在lxml里面，每個HTML元素對應一個lxml.html.HtmlElement對象，該對象提供一組標準的方法取訪問包含在該元素內部的數據，比如屬性、內容和子元素等。
例子
考察下面的鏈接，它提供中航電子在2017年第一季度的交易數據，我們打算從里面提取一些數據：
>>> url = "http://quotes.money.163.com/trade/lsjysj_600372.html?year=2017&season=1"
先把該網頁爬取下來：
>>> import urllib2
>>> rsp = urllib2.urlopen(url).read()
>>> print rsp[0:15]
<!DOCTYPE html>
將字符串rsp轉換成HtmlElement對象：
>>> from lxml import html
>>> doc = html.document_fromstring(rsp)
>>> type(doc)
<class 'lxml.html.HtmlElement'>
>>> doc.tag
'html'
所以其實doc就是一個html元素，它包含一些元素，比如head, body, link, div...
比如，如果你想提取該網頁里面所有的鏈接(links)：
>>> links = [ link for link in doc.iterlinks() ]
>>> len(links)
106
>>> links[0]
(<Element link at 0x1029179f0>, 'href', 'http://img1.cache.netease.com/f2e/finance/gegu/s.1064000.css', 0)
>>> links[0][2]
'http://img1.cache.netease.com/f2e/finance/gegu/s.1064000.css'
如果你想查看元素直接包含哪些子元素，可以調用getchildren()方法：
>>> doc.getchildren()
[<Element head at 0x10299a0a8>, <Element body at 0x10299a470>]
對嵌套很深的元素，如果熟悉xpath表達式，最直接的辦法是調用xpath(...)方法：
>>> [ td.text for td in doc.xpath('/html/body/div[2]/div[4]/table/tr[1]/td')]
['2017-03-31', '19.02', '19.50', '19.02', '19.30', '0.36', '1.90', '102,212', '19,747', '2.53', '0.58']
此外，還可以通過find, findall, find_class, get_element_by_id等方法查找目標元素，比如：
>>> [ td.text for td in doc.findall('./body/div[2]/div[4]/table/tr[1]/td')]
['2017-03-31', '19.02', '19.50', '19.02', '19.30', '0.36', '1.90', '102,212', '19,747', '2.53', '0.58']
如果元素有屬性，提取屬性值也很方便，比如：
>>> form = doc.forms[0]
>>> form.tag
'form'
>>> form.attrib
{'action': '/trade/lsjysj_600372.html', 'id': 'date'}
>>> form.keys()
['id', 'action']
>>> form.get('action')
'/trade/lsjysj_600372.html'
>>> form.items()
[('id', 'date'), ('action', '/trade/lsjysj_600372.html')]
'>>> form.form_values()
[('year', '2017'), ('season', '1')]
>>> form.method
'GET'
做為一個完整的例子，下面的腳本就是爬取中航電子在2017年第一季度的數據：
輸出效果：
(test) $ head -3 600372.csv
日期;開盤價;最高價;最低價;收盤價;漲跌額;漲跌幅(%);成交量(手);成交金額(萬元);振幅(%);換手率(%)
2017-03-31;19.02;19.50;19.02;19.30;0.36;1.90;102,212;19,747;2.53;0.58
2017-03-31;19.02;19.50;19.02;19.30;0.36;1.90;102,212;19,747;2.53;0.58
解析xml數據
xml的格式和HTML類似，也是由標簽構成的，但是要比HTML文件簡單許多，看下面的xml文件片段處理：
>>> xmlstr="""\
... <target name="run" depends="jar">
... <java fork="true" classname="${main-class}">
... <classpath>
... <path refid="classpath"/>
... <path refid="application"/>
... </classpath>
... </java>
... </target>"""
>>> from lxml import etree
第一步是獲取根節點：
>>> root = etree.fromstring(xmlstr)
>>> root.tag
'target'
如果要提取節點屬性：
>>> root.items()
[('name', 'run'), ('depends', 'jar')]
>>> root.keys()
['name', 'depends'
>>> root.get("name")
'run'
>>> root.values()
['run', 'jar']
可以使用find, xpath等方法去獲取和查找子節點：
>>> java = root.find("./java")
>>> java.tag
'java'
>>> java.keys()
['fork', 'classname']
>>> [ path.get("refid") for path in root.xpath("http://path")]
['classpath', 'application']
lxml軟件的功能很強大，如果有興趣進一步了解，可以查看官方文檔：
http://lxml.de/index.html
今天就寫這么，歡迎大家留言、評論和關注。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<body>
<input type="text" id="a"/>
<input type="button" value="保存cookie" onclick="test()"/>
<input type="button" value="獲取cookie" onclick="alert(getCookie('userName'))"/>
</body>
<script language=javascript>
window.onload=function(){
document.getElementById("a").value=getCookie('userName');
}
function test()
{
var a = document.getElementById('a').value;
SetCookie('userName',a)
}
//獲得coolie 的值
function cookie(name){
var cookieArray=document.cookie.split("; "); //得到分割的cookie名值對
var cookie=new Object();
for (var i=0;i<cookieArray.length;i++){
var arr=cookieArray[i].split("="); //將名和值分開
if(arr[0]==name)return unescape(arr[1]); //如果是指定的cookie，則返回它的值
}
return "";
}
function delCookie(name)//刪除cookie
{
document.cookie = name+"=;expires="+(new Date(0)).toGMTString();
}
function getCookie(objName){//獲取指定名稱的cookie的值
var arrStr = document.cookie.split("; ");
for(var i = 0;i < arrStr.length;i ++){
var temp = arrStr[i].split("=");
if(temp[0] == objName) return unescape(temp[1]);
}
}
function addCookie(objName,objValue,objHours){ //添加cookie
var str = objName + "=" + escape(objValue);
if(objHours > 0){ //為時不設定過期時間，瀏覽器關閉時cookie自動消失
var date = new Date();
var ms = objHours*3600*1000;
date.setTime(date.getTime() + ms);
str += "; expires=" + date.toGMTString();
}
document.cookie = str;
}
function SetCookie(name,value)//兩個參數，一個是cookie的名子，一個是值
{
var Days = 30; //此 cookie 將被保存 30 天
var exp = new Date(); //new Date("December 31, 9998");
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
function getCookie(name)//取cookies函數
{
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null) return unescape(arr[2]); return null;
}
function delCookie(name)//刪除cookie
{
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null) document.cookie= name + "="+cval+";expires="+exp.toGMTString();
}
</script>
</html>
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
