前言:
我需要在不久的将来开发一个评分微信小程序,其中涉及与后端服务器的数据交互。因为业务逻辑相对简单,所以我选择了Flask(Python的轻量级Web框架)来构建后端程序。因为这是我与小程序的第一次接触,所以经过一些探索和实验,我个人认为微信小程序与后端之间的交互有点像ajax,因此具有ajax开发小程序经验的学生应该很容易上手,因为本文着重于后端程序的构造,因此,微信小程序的前端开发将一举完成。有兴趣学习小程序前端语言的学生可以转到网易云课堂“ Easy Fun 微信小程序”中的一系列快速入门课程。
分三步讲解微信小程序与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:“我的后端服务器地址/分数”,url参数是提交数据的地址,有点像html中的表单提交操作,微信小程序对后端有很高的要求服务器访问,并且需要提交。可以解析的https域名,我的服务器使用阿里云,网站架构使用Nginx + supervisor + gunicorn + flask的经典Python_flask部署架构。该架构的部署和学习可以移到我的云笔记中。
data:data参数是要提交的数据。数据需要转换为json格式。使用JSON的stringify函数,您可以看到数据类型是JavaScript对象类型,通常称为键值对。
方法:这是数据提交的请求方法。默认为发布请求方法。后台将在处理请求时判断请求方法。
header:它是数据的头文件,字符类型需要设置为utf-8,即'charset':'utf-8',以防止在传输中文数据时出现乱码。
在调用wx.requset()函数之后,它将向后台服务器发起数据发布请求。此时,小程序将以post的形式将数据中的数据提交到与url相对应的服务器。第二部分说明如下。本文的重点是后台服务器收到小程序的请求后如何处理和返回信息。
后台服务器处理请求并返回信息。后端服务器使用Python-flask的轻量级Web框架处理请求。对于想学习烧瓶的学生,他们可以转到烧瓶的快速入门课程。粘贴到我开发的项目的后台处理部分的Python烧瓶代码下面。
# coding=utf8import sysdefaultencoding = 'utf-8'if sys.getdefaultencoding() != defaultencoding: reload(sys) sys.setdefaultencoding(defaultencoding)from flask import Flask,render_template,request,jsonfrom 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)
代码详细信息:
您可以看到这是一个非常基本的烧瓶代码。您应该看到句子@ app.route('/ score',methods = ['POST']),这是flask的路由功能,是的,/ score正好是小程序提交的请求是url中的分数路径,因此与此路由相对应的功能是处理请求的后台程序。 methods = ['POST']表示此路由仅处理POST请求。
in_acc_nbr = str(json.loads(request.values.get(“ acc_nbr”))),此语句用于获取所请求的数据,首先request.values.get()函数用于获取初始数据请求中的数据。 “ acc_nbr”是小程序数据对象中的键。由于数据中的数据为json格式,因此通过请求获得的数据也为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()函数中。
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 }) } })
代码的详细说明:分别说明成功回调函数。
成功:函数(res){
console.log(res.data);