Python Flask前后端Ajax交互的方法示例
之前總結(jié)過(guò)flask里的基礎(chǔ)知識(shí)，現(xiàn)在來(lái)總結(jié)下flask里的前后端數(shù)據(jù)交互的知識(shí)，這里用的是Ajax
一、 post方法
1、post方法的位置：在前端HTML里，綁定在一個(gè)按鈕的點(diǎn)擊函數(shù)里，或者一個(gè)鼠標(biāo)輸入框點(diǎn)擊離開(kāi)事件。
（1）數(shù)據(jù)附在URL里(請(qǐng)求路徑)，發(fā)送到后端。
/*前端HTML<script>里：*/
$.post("/js_post/"+ip, data_to_backend, function(data){alert("success "+data)} );
其中ip，data_to_backend是在此代碼前定義好的；data_to_backend一般是一個(gè)json數(shù)據(jù)(data_to_backend={'ip':$(this).parent().prev().text()})，而data是來(lái)自后端的返回?cái)?shù)據(jù)。
#后端py文件(路由啟動(dòng)前面的html的py文件)里：添加一個(gè)路由處理前端post請(qǐng)求
@app.route("/js_post/<ip>", methods=['GET', 'POST'])
def js_post(ip):
print ip
return ip +" - ip"
點(diǎn)擊按鈕后的效果：
前端定義彈窗數(shù)據(jù)
ip在URL里
（2）數(shù)據(jù)單獨(dú)發(fā)送給后端
var ip = $(this).parent().prev().prev().prev().prev().text();
data_tmp = {'ip':ip, 'text':"success for ajax"}; // data to send to server.
$.post('/js_call', data_tmp, function(data){alert(data)});
后端處理程序：
@app.route('/js_call', methods=['GET', 'POST'])
def js_call():
print request.values['ip']
print request.values['text']
# to send the command by ssh : os.system("ssh user@host \' restart(command) \' ")
return 'ok!!!!'
post獨(dú)立數(shù)據(jù)發(fā)送
二、get方法(同樣可以發(fā)數(shù)據(jù))
$.get('/js_get', {'method':'GET', 'text':"from-html"}, function(data){alert(data)})
后端路由接收處理：
@app.route('/js_get', methods=['GET'])
def js_get():
print "method: "+request.values['method']+" --- text: "+request.values['text']
return "get success!"
get成功
數(shù)據(jù)接收成功
注意的是：其中后端py文件的類(lèi)似request.values['method']的獲取數(shù)據(jù)的request是一個(gè)Python flask的模塊，需要導(dǎo)入。
總結(jié)：
- 在flask框架里，Ajax請(qǐng)求對(duì)于后端可以很容易實(shí)現(xiàn)，只需在后端Python代碼中對(duì)ajax路徑作出處理即可。
- Ajax的post, get方法均可以向后臺(tái)發(fā)送數(shù)據(jù)，只是一般用post發(fā)數(shù)據(jù)(做出改變)，get請(qǐng)求數(shù)據(jù)(不改變)。
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
解決pycharm remote deployment 配置的問(wèn)題
今天小編就為大家分享一篇解決pycharm remote deployment 配置的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-06-06
今天小編就為大家分享一篇selenium+python截圖不成功的解決方法 ，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-01-01
這篇文章主要介紹了Python中的迭代器與生成器高級(jí)用法解析,生成器在Python中是迭代器的一種,這里我們會(huì)講到生成表達(dá)式、鏈?zhǔn)缴善鞯壬顚哟蝺?nèi)容,需要的朋友可以參考下2016-06-06
高階函數(shù)指的是能接收函數(shù)作為參數(shù)的函數(shù)或類(lèi)，這篇文章主要介紹了Python中常用的高階函數(shù)，通過(guò)實(shí)例文字解釋相結(jié)合給大家介紹的非常詳細(xì),需要的朋友可以參考下2020-02-02
新一代爬蟲(chóng)利器Python?Playwright詳解
這篇文章主要為大家介紹了新一代爬蟲(chóng)利器Playwright，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助2021-12-12
創(chuàng)建Python Docker鏡像的詳細(xì)步驟
Python和Docker是兩個(gè)極其流行的技術(shù),結(jié)合它們可以創(chuàng)建強(qiáng)大的應(yīng)用程序,Docker允許將應(yīng)用程序及其依賴(lài)項(xiàng)打包到一個(gè)獨(dú)立的容器中,而Python則提供了豐富的庫(kù)和工具來(lái)開(kāi)發(fā)應(yīng)用程序,本文將提供如何創(chuàng)建Python Docker鏡像的全面指南,,需要的朋友可以參考下2023-12-12
利用ImageAI庫(kù)只需幾行python代碼實(shí)現(xiàn)目標(biāo)檢測(cè)
這篇文章主要介紹了利用ImageAI庫(kù)只需幾行python代碼超簡(jiǎn)實(shí)現(xiàn)目標(biāo)檢測(cè)功能，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-08-08
Python基于staticmethod裝飾器標(biāo)示靜態(tài)方法
這篇文章主要介紹了Python基于staticmethod裝飾器標(biāo)示靜態(tài)方法,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-10-10
python中有一個(gè)模塊sys,sys.argv這個(gè)屬性提供了對(duì)命令行參數(shù)的訪問(wèn),下面這篇文章主要給大家介紹了關(guān)于Python命令行參數(shù)實(shí)例的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-02-02
詳解修改Anaconda中的Jupyter Notebook默認(rèn)工作路徑的三種方式
這篇文章主要介紹了詳解修改Anaconda中的Jupyter Notebook默認(rèn)工作路徑的三種方式，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01