提示：博主默認你已經具備了Python的基礎知識，已經能夠很順暢的編寫一些Python腳本，否則接下來你會比較難看懂。
這里先給出舊版本的一些使用截圖，初始化的時候的樣子
模糊查詢
精確查詢
這個應用比較簡單，所使用的技術也比較少，主要有以下技術要點
requests模擬請求
正則匹配關鍵字
web.py搭建web環境
vue.js做數據自動綁定
是不是很簡單？
Flask Web開發基于Python的Web應用開發實戰pdf
在這個小應用中使用web.py的時候目錄結構是這樣的
其中static目錄里面存放的是靜態資源
結構相當簡單
這里給出全部的Python代碼
#!/usr/bin/env python# coding=utf-8import requestsimport jsonimport webimport sysimport re
reload(sys)
sys.setdefaultencoding('utf8')
urls = ("/", "index","/query", "Query")
render = web.template.render('static', cache=False)class index:def GET(self):return render.index('static')class Query:def POST(self):
keywords = str(web.input().get('shopname'))
url_base = ""+keywords
headers = {"User-Agent": "iphone7"}try:
result_base = requests.get(url=url_base, headers=headers, timeout=15).content.replace('
', '').replace(' ','')
infostr = re.findall(r'j_shop_moreshop_more">(.+?)</div>', result_base)
shoplist = []for item in infostr:
scorelist = re.findall(r'">(.+?)</span><iclass="', item)
thisShopname = re.findall(r'<span>(.+?)</span>', item)[0]
shoplist.append('{"shopname": "'+ thisShopname +'" , "dsr": "'+scorelist[0]+'", "service": "'+scorelist[1].split('">')[1]+'","ship": "'+scorelist[2].split('">')[1]+'"}')return json.dumps({"code": 0, "rows":list(set(shoplist))})except Exception, e:print ereturn json.dumps({"code": -1, "msg": "沒查詢到相關店鋪"})if __name__ == "__main__":
app = web.application(urls, globals())
app.run()$def with (urlbase)<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hello world</title>
</head>
<body>
<input type="text" name="shopname">
<input type="button" value="提交" @click="query">
<div class="info" v-for="item in shopes" style="border-bottom: #ccc 1px dashed">
<p>店鋪：{{ item.shopname }}</p>
<p>描述相符:{{ item.dsr }}<br>服務態度:{{ item.service }}<br>物流服務:{{ item.ship }}</p>
</div>
<script type="text/javascript" src="$urlbase/jquery.min.js"></script>
<script type="text/javascript" src="$urlbase/vue.js"></script>
<script type="text/javascript" src="$urlbase/index.js"></script>
</body>
</html>var mainVM = new Vue({
el: 'body',
data: {
shopes:[
{
shopname:'未查詢',
dsr:'未查詢',
service:'未查詢',
ship:'未查詢'}
]
},
methods:{
query:function(){
var _self = this,keyword = $('input[name="shopname"]').val();
$.post('/query',{"shopname":keyword},function (data) {if(data.code == 0){
_self.shopes = [];for(var k in data.rows){
var thisdata = JSON.parse(data.rows[k]);
_self.shopes.push({
shopname:thisdata.shopname,
dsr:thisdata.dsr,
service:thisdata.service,
ship:thisdata.ship
})
}
}else{
alert('查詢出錯，錯誤信息：'+data.msg);
}
},"json");
}
}
});可以說代碼部分也是相當簡單，前端HTML和js的代碼就不解釋了，很容易看懂，這里只對app.py做簡單的解釋。
觀察天貓的搜索頁面，發現天貓pc端跟手機端頁面都可以輕松抓取，但是使用手機端頁面會更加快速方便，因為結構上更加清晰，而且數據量少，抓取速度更快
如何實現只抓取手機端頁面的數據呢？很簡單，這里我們只需要定義以下HTTP的請求頭信息就可以了，也就是headers，如下定義
headers={"User-Agent":"iphone7"}
天貓的搜索鏈接是使用的get請求，地址為
"https://list.tmall.com/search_product.htm?q="+keywords
參數只需要傳入一個關鍵字就可以了，前端使用ajax把數據POST給服務端，服務端接收使用下面的這句話
keywords=str(web.input().get('shopname'))
是不是馬上就搞定了關鍵的幾步了？接下來發起請求拿到數據就可以了
result_base=requests.get(url=url_base,headers=headers,timeout=15).content.replace(' ','').replace('','')
注意，這里我把返回的結果中的換行跟空格都去掉了，因為我這里所需要的數據很簡單，為了匹配方便我直接給替換成可空，也就是后面的這個
.replace(' ','').replace('','')
然后根據正則匹配的字符串進行遍歷組合成結果返回給前端就好了，前端直接使用vue.js進行數據的綁定，幾乎不需要DOM操作就可以完成結果列表的渲染，棒！（這里強行安利一波vue.js）
前后端通信使用json進行數據交互，友好而且方便。
上面給出了所需要的技術要點和關鍵代碼，那么現在我需要使用flask重寫一遍，當然了，關鍵部分還是不用變動，只是處理方式上稍微有些差異，如果會用web.py，那么使用flask上手應該是很快的。
在使用web.py的時候我們啟動一個web服務很簡單，通常執行以下命令
python app.py
這樣我們就啟動了一個web服務，但是這樣的話會有很多問題，主要有以下幾點
不能關閉終端窗口，否則應用結束，一般用于調試
多個應用的時候公用Python環境會引起沖突
web.py并不適合高并發的應用，但是作為一般應用還是可以輕松應對的。
以上命令執行后web.py會在8080端口綁定一個web服務，如果你想創建多個應用，那么你應該在后面加上端口號
如果你使用了多個域名指向一臺機器的多個應用，那么你應該使用nginx來轉發請求，而不是直接輸入域名加端口號
在遠程vps上運行開發完成的應用時，你可以執行以下命令把web以后臺服務的形式運行
nohup python app.py
這種方式簡單粗暴，但是僅僅作為臨時方案是可行的，運行上述命令后你可以安心的關掉終端，而且web服務依然在運行，但是一旦重啟了服務器，那么就得重新登錄vps再次執行命令，不是很方便。
flask和web.py類似，它自帶了一個web服務器，默認綁定在5000端口，但是它本身自帶的web服務器并不是很好，安全性也不高，作為開發使用還是足夠的，正式生產環境中不太建議直接使用flask自帶的web服務。
好了，現在可以開始了，為了解決上面提到幾個問題，這里咱們來使用一個新東西，上面說了多應用環境沖突的問題，在這兒可以使用一個叫做“虛擬環境”的東西解決。
“虛擬環境”就是直接復制一個Python的全局環境，但是是獨立出來的，你可以在這個環境里面安裝各種模塊，而且不會影響到Python的全局環境，也就是說如果你把其中的一個“虛擬環境”給玩壞了，起不來了，那么你只需要刪掉壞的“虛擬環境”重新創建一個就可以了，這些操作都不會對Python全局環境有任何的影響，安全又方便，下面咱們就來創建一個“虛擬環境”。
博主使用的開發環境是Ubuntu 16.04 并沒有自帶這個軟件，使用下面的命令安裝
sudo apt-get install python-virtualenv -y
安裝完之后測試下是否安裝成功
~$ virtualenv --version 15.0.1
接下來咱們創建一個叫 tmall 虛擬環境用于運行我們的應用
~$ virtualenv tmall Running virtualenv with interpreter /usr/bin/python2 New python executable in /home/kbdancer/tmall/bin/python2 Also creating executable in /home/kbdancer/tmall/bin/python Installing setuptools, pkg_resources, pip, wheel...done.
創建的時候會給出創建的位置，如果你需要在指定的目錄下面創建虛擬環境，那么你得切換到目標目錄，然后執行創建命令，博主這里直接在自己的用戶目錄下面執行的創建命令，自然就是在用戶目錄下面生成的一個 tmall 文件夾，文件夾下面自動生成了Python環境
安裝完之后需要將這個環境激活才能使用，執行下面的命令進行激活
~$ source tmall/bin/activate (tmall) :~$
接著在虛擬環境中安裝flask環境（博主默認你的Python全局環境中已經有了easy_install或者pip），博主這里使用pip進行安裝
~$ pip install flask
好了，所需要的環境配置完成，接下來就可以開始寫小應用了。
編碼這個環節應該是快速而且高效的，上面我們已經給出了舊代碼，關鍵部分直接復制過來就能用，稍微改改就可以跑起來了。
flask默認使用Jinja2作為模板引擎，Jinja2在進行模板渲染的時候通常會識別{{}}中的內容進行填充，但是這里博主遇到了一個尷尬的問題，Vue.js也是使用的{{}}作為標識符進行渲染，這就導致了沖突，訪問頁面的時候就會出現如圖所示的錯誤
當然，解決方法還是有的，參考這篇文章進行配置 解決Jinja2與Vue.js的模板沖突 解決思路也比較簡單，就是在需要Jinja2渲染的時候添加一個空格，而vue.js渲染的時候則不需要空格，python腳本如下
from flask import Flask, render_template
app = Flask(__name__)
app.jinja_env.variable_start_string = '{{ '
app.jinja_env.variable_end_string = ' }}'前端HTML代碼修改后就成了這樣
<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="renderer" content="webkit"><meta name="viewport" content="width=device-width, initial-scale=1"><title>Hello world</title></head><body><input type="text" name="shopname"><input type="button" value="提交" @click="query"><div class="info" v-for="item in shopes" style="border-bottom: #ccc 1px dashed"><p>店鋪：{{item.shopname}}</p><p>描述相符:{{item.dsr}}<br>服務態度:{{item.service}}<br>物流服務:{{item.ship}}</p></div><script type="text/javascript" src="{{ url_for('static', filename='jquery.min.js') }}"></script><script type="text/javascript" src="{{ url_for('static', filename='vue.js') }}"></script><script type="text/javascript" src="{{ url_for('static', filename='index.js') }}"></script></body></html>Jinja2默認會在templates目錄下面尋找模板文件，而靜態文件比如css，js之類的默認存儲在static目錄下面，這里我們按照Jinja2的默認設置稍微進行修改，當然，如果你想自定義模板目錄或者靜態文件的目錄也是可以的，只需要稍微的配置下就行了，博主這里按照默認的規則來設置。
很快，我們的小應用就跑起來了
這里還是需要提到幾個關鍵點：
flask中接收前端傳遞過來的參數用到的是request對象，前端使用json把數據post到后端，后端使用下面這句進行接收
request.form.get('shopname')更多詳細使用方法參考這個地址 淺入淺出Flask框架：處理客戶端通過POST方法傳送的數據 接著測試下小應用能不能正常運行
OK，測試通過。
由于這個小應用比較簡單，部署起來可以按照常規的部署方式進行，但是并不適合生產環境，所以這里暫時不寫如何部署，下次有大型網站案例的時候再詳細寫如何部署以及優化。
#!/usr/bin/env python# coding=utf-8from flask import Flask, render_template, requestimport requestsimport jsonimport re
app = Flask(__name__)
app.jinja_env.variable_start_string = '{{ '
app.jinja_env.variable_end_string = ' }}'@app.route('/')def index():return render_template('index.html')@app.route('/query', methods=['POST'])def query():
keywords = request.form.get('shopname')
url_base = "https://list.tmall.com/search_product.htm?q=" + keywords
headers = {"User-Agent": "iphone7"}try:
result_base = requests.get(url=url_base, headers=headers, timeout=15).content.replace('
', '').replace(' ', '')
infostr = re.findall(r'j_shop_moreshop_more">(.+?)</div>', result_base)
shoplist = []for item in infostr:
scorelist = re.findall(r'">(.+?)</span><iclass="', item)
thisShopname = re.findall(r'<span>(.+?)</span>', item)[0]
shoplist.append('{"shopname": "' + thisShopname + '" , "dsr": "' + scorelist[0] + '", "service": "' + scorelist[1].split('">')[1] + '","ship": "' + scorelist[2].split('">')[1] + '"}')return json.dumps({"code": 0, "rows": list(set(shoplist))})except Exception, e:print ereturn json.dumps({"code": -1, "msg": "沒查詢到相關店鋪"})if __name__ == "__main__":
app.run(debug=True)<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="renderer" content="webkit"><meta name="viewport" content="width=device-width, initial-scale=1"><title>Hello world</title></head><body><input type="text" name="shopname"><input type="button" value="提交" @click="query"><div class="info" v-for="item in shopes" style="border-bottom: #ccc 1px dashed"><p>店鋪：{{item.shopname}}</p><p>描述相符:{{item.dsr}}<br>服務態度:{{item.service}}<br>物流服務:{{item.ship}}</p></div><script type="text/javascript" src="{{ url_for('static', filename='jquery.min.js') }}"></script><script type="text/javascript" src="{{ url_for('static', filename='vue.js') }}"></script><script type="text/javascript" src="{{ url_for('static', filename='index.js') }}"></script></body></html>沒有做任何改動，就不貼出來了
寫這篇文章的目的一來是復習下flask的一些知識，二來是與web.py做個對比，再者就是給入門的朋友提供一個實戰的例子，方便參考。
聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
Copyright ? 2019-2025 51dongshi.com 版權所有
違法及侵權請聯系：TEL:177 7030 7066 E-MAIL:11247931@qq.com 本站由北京市萬商天勤律師事務所王興未律師提供法律服務
