Python Flask 搭建微信小程序后台详解


Posted in Python onMay 06, 2019

前言:

近期需要开发一个打分的微信小程序,涉及到与后台服务器的数据交互,因为业务逻辑相对简单,故选择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项目,供大家品鉴^_^~

<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 搭建微信小程序后台详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Python 相关文章推荐
python在多玩图片上下载妹子图的实现代码
Aug 13 Python
wxPython窗口的继承机制实例分析
Sep 28 Python
python之Socket网络编程详解
Sep 29 Python
Python变量和字符串详解
Apr 29 Python
Python中音频处理库pydub的使用教程
Jun 07 Python
如何利用python制作时间戳转换工具详解
Sep 12 Python
DES加密解密算法之python实现版(图文并茂)
Dec 06 Python
在python中使用xlrd获取合并单元格的方法
Dec 26 Python
详解python 爬取12306验证码
May 10 Python
python列表推导和生成器表达式知识点总结
Jan 10 Python
Python sklearn中的.fit与.predict的用法说明
Jun 28 Python
Python爬虫基础之简单说一下scrapy的框架结构
Jun 26 Python
Python玩转PDF的各种骚操作
May 06 #Python
使用Python和Prometheus跟踪天气的使用方法
May 06 #Python
Python中常用的8种字符串操作方法
May 06 #Python
基于python if 判断选择结构的实例详解
May 06 #Python
20行python代码的入门级小游戏的详解
May 05 #Python
python2.7 安装pip的方法步骤(管用)
May 05 #Python
Python中print和return的作用及区别解析
May 05 #Python
You might like
不用数据库的多用户文件自由上传投票系统(1)
2006/10/09 PHP
浅析echo(),print(),print_r(),return之间的区别
2013/11/27 PHP
分享一个超好用的php header下载函数
2014/01/31 PHP
php实现encode64编码类实例
2015/03/24 PHP
php使用pdo连接sqlite3的配置示例
2016/05/27 PHP
DEFER怎么用?
2006/07/01 Javascript
利用js的Node遍历找到repeater的一个字段实例介绍
2013/04/25 Javascript
JavaScript中的类数组对象介绍
2014/12/30 Javascript
基于dropdown.js实现的两款美观大气的二级导航菜单
2015/09/02 Javascript
javascript函数的四种调用模式
2017/01/08 Javascript
Canvas实现微信红包照片效果
2018/08/21 Javascript
vue2实现搜索结果中的搜索关键字高亮的代码
2018/08/29 Javascript
vue实现添加与删除图书功能
2018/10/07 Javascript
微信小程序自定义导航教程(兼容各种手机)
2018/12/12 Javascript
详解vue-cli 2.0配置文件(小结)
2019/01/14 Javascript
vue2配置scss的方法步骤
2019/06/06 Javascript
[05:17]DOTA2睡衣妹卖萌求签名 CJ第二天全明星影像
2013/07/28 DOTA
[01:36:17]DOTA2-DPC中国联赛 正赛 Ehome vs iG BO3 第一场 1月31日
2021/03/11 DOTA
python删除本地夹里重复文件的方法
2020/11/19 Python
python 扩展print打印文件路径和当前时间信息的实例代码
2019/10/11 Python
python3获取文件中url内容并下载代码实例
2019/12/27 Python
python3 配置logging日志类的操作
2020/04/08 Python
使用CSS3编写类似iOS中的复选框及带开关的按钮
2016/04/11 HTML / CSS
日本著名的服饰鞋帽综合类购物网站:MAGASEEK
2019/01/09 全球购物
波兰最大的宠物用品网上商店:FERA.PL
2019/08/11 全球购物
公司承诺书怎么写
2014/05/24 职场文书
企业宗旨标语
2014/06/10 职场文书
领导干部作风建设自查报告
2014/10/23 职场文书
2014年小学工作总结
2014/11/26 职场文书
2014年食品安全工作总结
2014/12/04 职场文书
全陪导游词
2015/02/04 职场文书
2015政治思想表现评语
2015/03/25 职场文书
保护地球的宣传语
2015/07/13 职场文书
nginx 配置缓存
2022/05/11 Servers
VMware虚拟机安装 Windows Server 2022的详细图文教程
2022/09/23 Servers
MySQL新手入门进阶语句汇总
2022/09/23 MySQL