前言:
近期需要開發一個打分的微信小程式,涉及到與背景伺服器的資料互動,因為業務邏輯相對簡單,故選擇Python的輕量化web架構Flask來搭建背景程式。因為是初次接觸小程式,經過一番摸索和嘗試,個人覺得的微信小程式與背景的互動有點像ajax,是以有ajax開發經驗的同學開發小程式應該很容易上手,因為本文着重講解背景程式的搭建,是以,微信小程式的前端開發将一筆帶過,有興趣學習小程式前端語言的同學可移步網易雲課堂的一套快速入門課程《輕松玩轉微信小程式》。
分三步講解微信小程式與Python背景互動資料的全過程
小程式向背景伺服器送出資料。微信小程式為資料送出開發了一個API,其實是一個js函數,詳細介紹可參考官方API文檔《微信小程式API文檔》。下面貼下我開發的項目的資料送出js代碼。
wx.request({
url: 'https://我的背景伺服器網址/score',
data: {
acc_nbr:JSON.stringify(acc_nbr),
grade1: JSON.stringify(grade1), //将資料格式轉為JSON
grade2: JSON.stringify(grade2), //将資料格式轉為JSON
grade3: JSON.stringify(grade3), //将資料格式轉為JSON
txt1:JSON.stringify(txt1),
txt2:JSON.stringify(txt2),
txt3:JSON.stringify(txt3)
},
method: "POST",
header: {
'content-type': 'application/x-www-form-urlencoded',
'chartset': 'utf-8'
}
代碼參數講解:
url: 'https://我的背景伺服器位址/score',url參數是資料送出的位址,有點像html裡表單送出裡的action,微信小程式對背景接入的伺服器要求很高,需要具備已備案的能夠解析的https域名,我的伺服器使用的阿裡雲,網站架構使用的是
Nginx+supervisor+gunicorn+flask經典Python_flask 部署架構,此架構的部署學習可移步我的雲筆記flask部署。
data: data參數是要送出的資料,資料需要轉換成json格式,使用JSON的stringify函數,可以看到data的資料類型是JavaScript的對象類型,也就是俗稱的鍵值對。
methon:是資料送出的請求方式,預設是post請求方式,背景在處理請求時會判斷請求方式。
header:是資料的頭檔案,需要設定字元類型為utf-8,即'charset':'utf-8',防止傳輸中文資料時出現亂碼。
wx.requset()函數被調用後,會向背景伺服器發起資料的post請求,此時小程式會把data裡的資料以post形式向url對應的伺服器送出,下面講解第二部分也是本文重點,即背景伺服器接受到小程式的請求後,怎麼處理并傳回資訊
背景伺服器處理請求并傳回資訊。背景伺服器處理請求是使用的Python-flask的輕量化web架構,對于想學習flask的同學可以移步flask的快速入門課程。下面貼下我開發的項目的背景處理部分的Python-flask代碼。
# coding=utf8
import sys
defaultencoding = 'utf-8'
if sys.getdefaultencoding() != defaultencoding:
reload(sys)
sys.setdefaultencoding(defaultencoding)
from flask import Flask,render_template,request,json
from DB import *
app = Flask(__name__)
@app.route('/')
def hello_world():
return render_template('index.html')
@app.route('/score',methods=['POST'])
def score():
in_acc_nbr = str(json.loads(request.values.get("acc_nbr")))
input_grade1=int(json.loads(request.values.get("grade1")))
input_grade2 = int(json.loads(request.values.get("grade2")))
input_grade3 = int(json.loads(request.values.get("grade3")))
input_txt1=str(json.loads(request.values.get("txt1")))
input_txt2=str(json.loads(request.values.get("txt2")))
input_txt3=str(json.loads(request.values.get("txt3")))
score_db=db('mysql資料庫ip位址',3306,'資料庫使用者名','資料庫密碼','資料庫','utf8')
conn=score_db.connect_db()
cursor=conn.cursor()
sql=''' insert into grade (acc_nbr,grade1,grade2,grade3,txt1,txt2,txt3,insert_time) values (%s,%s,%s,%s,'%s','%s','%s',now())
'''%(in_acc_nbr,input_grade1,input_grade2,input_grade3,input_txt1,input_txt2,input_txt3)
cursor.execute(sql)
res=cursor.rowcount
conn.commit()
cursor.close()
conn.close()
if res==1:
# print res
res='資料送出成功'
return json.dumps(res.decode('utf8'))
else:
print res
res='資料送出失敗'
return json.dumps(res.decode('utf8'))
if __name__ == '__main__':
app.run(debug=True)
代碼詳解:
可以看到這是一段很基礎的flask的代碼。大家應該看到了 @app.route('/score',methods=['POST'])這條語句,這就是flask的路由函數,沒錯,/score 正是小程式送出請求是url裡的score路徑,是以這個路由對應的函數正是處理請求的背景程式。methods=['POST'] 說明這個路由隻處理POST請求。
in_acc_nbr = str(json.loads(request.values.get("acc_nbr"))),這段語句是擷取請求的資料,首先request.values.get()函數是獲得request請求裡最初的資料。"acc_nbr"是小程式data對象裡的鍵,因為data裡的資料是json格式,是以request擷取的資料也是json格式,使用flask自帶的json.loads 函數擷取字元資料。至此,我們已經拿到了小程式送出的資料了。
将json資料轉換成字元資料後,就可以進行相關業務邏輯的處理,這裡我的代碼是将相關資料送出到mysql資料庫裡。
業務邏輯處理完畢後,需要向小程式傳回消息和資料,return json.dumps(res.decode('utf8')) 這段語句是本文的核心。因為小程式接受資料需要json格式,是以我們的傳回資料也需要轉換成json格式,使用flask自帶的json.dumps函數即可将字元類型的資料轉換成json格式的資料。
背景程式傳回了資料後,第三步就是小程式該怎麼接收傳回資料并進行相關業務邏輯處理。
小程式接收傳回資料。Python-Flask向小程式傳回了JSON格式的資料後,小程式的wx.requset()函數裡的SUCESS回調函數用來處理傳回資料。下面貼下項目中wx.requset()函數中sucess回調函數。
wx.request({
url: 'https://我的背景伺服器網址/score',
data: {
acc_nbr:JSON.stringify(acc_nbr),
grade1: JSON.stringify(grade1), //将資料格式轉為JSON
grade2: JSON.stringify(grade2), //将資料格式轉為JSON
grade3: JSON.stringify(grade3), //将資料格式轉為JSON
txt1:JSON.stringify(txt1),
txt2:JSON.stringify(txt2),
txt3:JSON.stringify(txt3)
},
method: "POST",
header: {
'content-type': 'application/x-www-form-urlencoded',
'chartset': 'utf-8'
},
success: function (res) {
console.log(res.data);
wx.showToast({
title: res.data,//這裡列印出登入成功
icon: 'success',
duration: 1000
});
var acc_nbr = that.data.phoneNum;
wx.redirectTo({
url: '../graderesult/graderesult?phoneNum=' + acc_nbr
})
}
})
代碼詳解:單獨拿出sucess回調函數講解。
success: function (res) {
console.log(res.data);
wx.showToast({
title: res.data,//這裡列印出登入成功
icon: 'success',
duration: 1000
});
var acc_nbr = that.data.phoneNum;
wx.redirectTo({
url: '../graderesult/graderesult?phoneNum=' + acc_nbr
})
}
res入參存儲的資料,即res.data,就是第二步背景傳回的資料。可以用console.log(res.data)看下傳回的資料是否正确。
我的項目在拿到背景傳回的資料,進行了彈窗展示傳回資料wx.showToast和頁面的跳轉wx.redirectTo,大家可以根據自己的業務需求在sucess回調函數編寫自己的業務邏輯。
結尾:
至此,微信小程式和Python背景互動資料的步驟已經講完。正如文章開頭所講,學過ajax的同學讀完會發現微信小程式與背景互動資料非常像ajax,是以,文章結尾貼出一個彩蛋,即神奇的ajax代碼,出自我的另一個web項目,供大家品鑒^_^~
$(function () {
$('.btn').click(function () {
var $result = $('#result');
var $result1=$('#result1');
var $acc_nbr = $('input[name="acc_nbr"]').val();
$.ajax({
url: '/query',
data: $('form').serialize(),
type: 'POST',
dataType: 'json',
success: function (data) {
if (data.length !=0){
console.log(data.length);
var str = "";
var str1="" +
"" +
" 确認";
for (s in data) {
if (data[s][4] == '後付費') {
str = str + "
+ "
" + data[s][0] + ""
+ "
" + data[s][1] + ""
+ "
" + data[s][2] + ""
+ "
" + data[s][3] + ""
+ "
" + data[s][4] + ""
+ "
" + data[s][5] + ""
+ "
" + data[s][6] + ""
+ "
"
}
else {
str = str + "
+ "
" + data[s][0] + ""
+ "
" + data[s][1] + ""
+ "
" + data[s][2] + ""
+ "
" + data[s][3] + ""
+ "
" + data[s][4] + ""
+ "
" + data[s][5] + ""
+ "
" + data[s][6] + ""
+ "
"
}
};
$result1.html(str1);
$result.html(str);
}
else {
alert('此号碼不在派單内!!');
}
}
}
)
});
});
以上所述是小編給大家介紹的Python Flask 搭建微信小程式背景詳解整合,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回複大家的。在此也非常感謝大家對我們網站的支援!
本文标題: Python Flask 搭建微信小程式背景詳解
本文位址: http://www.cppcns.com/jiaoben/python/258480.html