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

江屿
江屿
发布时间:2026-10-12 | 2人浏览过
原创

本文详解使用Python Flask框架搭建微信小程序后台的全过程。内容涵盖从Nginx+Gunicorn的经典部署架构,到小程序端通过wx.request提交JSON数据,再到Flask后端解析请求、处理业务逻辑并返回JSON响应,最后小程序接收回调数据的完整链路。适合有Ajax开发经验的开发者快速上手小程序后端交互。

前言:

近期因开发一款打分类微信小程序的需求,涉及与后台服务器的数据交互。鉴于业务逻辑相对简单,最终选定Python轻量级Web框架Flask来构建后台服务。由于是初次接触小程序开发,经过摸索发现,微信小程序与后台的数据交互机制与Ajax非常相似,因此具备Ajax开发经验的开发者可以较快地上手。本文重点在于后台程序的搭建,小程序前端部分将简略介绍;若对小程序前端感兴趣,可参考网易云课堂的《轻松玩转微信小程序》课程。

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

第一步:小程序向后台服务器提交数据。微信小程序提供了专门用于数据提交的API,本质上是一个JavaScript函数,详细说明可参考官方文档《微信小程序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',该参数指定数据提交的地址,类似于HTML表单中的action属性。微信小程序对服务器接入有严格要求,必须使用已备案且支持解析的HTTPS域名。我的服务器部署在阿里云,网站架构采用

Nginx+supervisor+gunicorn+flask 的经典Python Flask部署架构。关于此架构的部署细节,可参考我的云笔记中关于Flask部署的相关内容。 data: 该参数用于传递提交的数据,数据需转换为JSON格式,通常使用JSON.stringify函数处理。可以看到data的数据类型为JavaScript对象,即常见的键值对形式。

method:指定数据提交的请求方式,默认为POST请求,后台在处理时会校验请求类型。 header:设置请求头,需指定字符编码为utf-8,即'charset':'utf-8',以防止传输中文数据时出现乱码。

调用wx.request()函数后,小程序会向后台服务器发起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()函数从请求中提取原始数据。"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.request()函数中的SUCCESS回调函数用于处理返回数据。以下展示了项目中wx.request()函数中的success回调函数代码。

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
   })
   }
  })

代码详解:单独提取success回调函数进行讲解。

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操作。大家可以根据自身的业务需求,在success回调函数中编写相应的业务逻辑。

结尾:

至此,微信小程序与Python后台交互数据的步骤已讲解完毕。正如文章开头所述,学过Ajax的读者会发现,微信小程序与后台的数据交互方式与Ajax非常相似。文章最后附上一个彩蛋,即来自我另一个Web项目的Ajax代码,供各位参考品鉴^_^~

<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 相关产品和应用

全部下载

专题列表