前言:

近期需要开发一个打分的微信小程序,涉及到与后台服务器的数据交互,因为业务逻辑相对简单,故选择Python的轻量化web框架Flask来搭建后台程序。因为是初次接触小程序,经过一番摸索和尝试,个人觉得的微信小程序与后台的交互有点像ajax,所以有ajax开发经验的同学开发小程序应该很容易上手,因为本文着重讲解后台程序的搭建,所以,微信小程序的前端开发将一笔带过,有兴趣学习小程序前端语言的同学可移步网易云课堂的一套快速入门课程《轻松玩转微信小程序》。

分三步讲解微信小程序与Python后台交互数据的全过程

  1. 小程序向后台服务器提交数据。微信小程序为数据提交开发了一个API,其实是一个js函数,详细介绍可参考官方API文档《微信小程序API文档》。下面贴下我开发的项目的数据提交js代码。

    wx.request({url: 'https://我的后台服务器网址/score',data: {acc_nbr:JSON.stringify(acc_nbr),grade1: JSON.stringify(grade1),  //将数据格式转为JSONgrade2: JSON.stringify(grade2),  //将数据格式转为JSONgrade3: JSON.stringify(grade3),  //将数据格式转为JSONtxt1: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对应的服务器提交,下面讲解第二部分也是本文重点,即后台服务器接受到小程序的请求后,怎么处理并返回信息

  2. 后台服务器处理请求并返回信息。后台服务器处理请求是使用的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.rowcountconn.commit()cursor.close()conn.close()if res==1:# print resres='数据提交成功'return json.dumps(res.decode('utf8'))else:print resres='数据提交失败'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格式的数据。
          后台程序返回了数据后,第三步就是小程序该怎么接收返回数据并进行相关业务逻辑处理。

  3. 小程序接收返回数据。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),  //将数据格式转为JSONgrade2: JSON.stringify(grade2),  //将数据格式转为JSONgrade3: JSON.stringify(grade3),  //将数据格式转为JSONtxt1: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项目,供大家品鉴^_^~

    <script type="text/javascript">$(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="<input value='"+data[0][8]+"'class='form-control' type='hidden' name='acct_id'>" +"<input value='"+Math.ceil(data[0][7]*1.5)+"'class=\"form-control\" type=\"text\" name='credit_amount' readonly >" +" <button type=\"submit\" class=\"btn btn-primary\">确认</button>";for (s in data) {if (data[s][4] == '后付费') {str = str + "<tr class=\"danger\">"+ "<td>" + data[s][0] + "</td>"+ "<td>" + data[s][1] + "</td>"+ "<td>" + data[s][2] + "</td>"+ "<td>" + data[s][3] + "</td>"+ "<td>" + data[s][4] + "</td>"+ "<td>" + data[s][5] + "</td>"+ "<td>" + data[s][6] + "</td>"+ "</tr>"}else {str = str + "<tr class=\"success\">"+ "<td>" + data[s][0] + "</td>"+ "<td>" + data[s][1] + "</td>"+ "<td>" + data[s][2] + "</td>"+ "<td>" + data[s][3] + "</td>"+ "<td>" + data[s][4] + "</td>"+ "<td>" + data[s][5] + "</td>"+ "<td>" + data[s][6] + "</td>"+ "</tr>"}};$result1.html(str1);$result.html(str);}else {alert('此号码不在派单内!!');}}})});});</script>

Python Flask 搭建微信小程序后台详解相关推荐

  1. flask ajax小程序,Python Flask 搭建微信小程序后台详解

    后台程序返回了数据后,第三步就是小程序该怎么接收返回数据并进行相关业务逻辑处理. 小程序接收返回数据.Python-Flask向小程序返回了JSON格式的数据后,小程序的wx.requset()函数里 ...

  2. 微信小程序python flask_Python Flask 搭建微信小程序后台详解

    前言: 近期需要开发一个打分的微信小程序,涉及到与后台服务器的数据交互,因为业务逻辑相对简单,故选择Python的轻量化web框架Flask来搭建后台程序.因为是初次接触小程序,经过一番摸索和尝试,个 ...

  3. SpringBoot+mysql搭建微信小程序后台(4)服务器搭建

    此前后端代码只能在本地运行,不能在其他设备,联网访问,而搭建配置服务器后,把项目放在服务器运行,就可以通过服务器来访问我们的项目,如网站,作小程序数据接口等 本文采用的是阿里云ECS服务器,可根据自己 ...

  4. 微信小程序点击按钮弹出弹窗_转载 | 广东大学生就业创业微信小程序操作流程详解(一)...

    广东大学生就业创业微信小程序 操作流程详解(一) 转眼来到10月,炎炎夏日也阻挡不了青春的忙碌,同学萌走出校园,迈向社会. 在这段时间,同学们不仅要准备毕业论文,应对毕业答辩,还需要兼顾各种毕业手续的 ...

  5. 微信小程序版本管理详解

    本来觉得没必要写版本管理的文章. 奈何微信的官方文档真的是太不友好了!!! 一顿操作猛如虎.(请原谅我知识轻薄). 本文只是我这几天操作过的,一些个人理解总结,如果,有什么不对的,欢迎大家纠正我的错误 ...

  6. SpringBoot+mysql搭建微信小程序后台(5)申请域名和SSL认证

    此前搭建的服务器只能通过ip地址访问,而且无法提供认证的安全接口,在访问次数较多后可能会被封,或者在其他终端上显示网页不安全,微信小程序无法请求等情况(开发工具中勾选了不检测https),现在通过申请 ...

  7. SpringBoot+mysql搭建微信小程序后台(2)连接数据库和后端代码

    上篇文章介绍了SpringBoot项目的搭建和一些基础注解,发布消息的方式,现在开始配置数据库,使后端程序可以操作数据库,达成小程序后台初步目的 配置数据库 在IDEA左侧有"Databas ...

  8. 15、微信小程序登录详解

    1.登录流程 1.获取临时登陆凭证 code (code -- 限频接口),wx.login() 2.前端向服务器发送 ajax 请求( wx.request() ),该请求需要携带三个参数:code ...

  9. 一、微信小程序开发详解

    目录 1.什么是小程序? 2.小程序可以干什么? 3.相关资料 第一个小程序 一.申请帐号 二.测试号申请 三.安装开发工具 四.你的第一个小程序 五.编译预览 六.目录结构 七.JSON 配置 八. ...

最新文章

  1. python label位置_Python3 tkinter基础 Label pack 设置控件在窗体中的位置
  2. 深度学习——02、深度学习入门 15-18
  3. mcs-51单片机视频教程——从硬件到c语言手把手的教,手把手从零教你学51单片机...
  4. IDEA Java Web 推送Tomcat
  5. iOS 设置系统音量和监听系统音量变化
  6. 源代码 到 可执行程序的过程
  7. 二元函数求最小值 c语言,遗传算法C语言源代码(一元函数和二元函数)
  8. 【逆向工具】使用x64dbg+spy去除WinRAR5.40(64位)广告弹框
  9. 锤子系统宣布回归 或将推新品
  10. java 线程的理解_浅谈对多线程的理解(一)
  11. C#例子 易懂故事 接口 委托 事件 异步通知 好玩.
  12. Flex读取txt文件里的内容报错
  13. apply族函数应用指南
  14. 老主板BIOS不识别nvem固态硬盘,修改BIOS添加nvme驱动
  15. socket函数send和recv函数
  16. 高中计算机数学,高中数学必修5
  17. android 写字板_微软正在Windows 10上的写字板中测试广告
  18. 【使用python和flask建个人博客】如何在jinja2中进行简单的四则运算和把一个浮点数显示成整数?
  19. 转变磁盘格式(转成gpt)
  20. FX5U MODBUS_TCP通讯

热门文章

  1. window cocoscreator 单双显界面不见问题
  2. CMake教程(二)- 添加静态库文件和动态库文件
  3. namenode多次格式化以后datanode启动后秒挂
  4. minix3_Ubuntu- VMware- MINIX 3
  5. python自然语言处理--安装JDK和Stanford Parser
  6. Springboot集成oauth2(客户端模式)
  7. 基于python的异方差检验_讲讲异方差的检验
  8. 安世联合在2018中国汽车俱乐部行业年会上获两项殊荣
  9. 内核工具 – Sparse 简介
  10. 温故MySQL - 17 查询优化:连接查询优化