在生产环境中的小程序中对外请求只能通过https,且需要在小程序后台配置了该请求的域名。在开发环境(本地),我们可以通过配置小程序,取消该限制。
点击开发工具“详情”,“本地配置” ,将“不校验合法域名、web-view(业务域名),TlS版本以及HTTPS证书”勾选即可请求我们的服务(如下图)。需要注意的是在生产环境中,必须按照微信官方的要求配置https.
二、通过前端请求后端拉取数据并展示

我们日常生活中见到的网页数据都不会硬编码在前端代码上,需要实时拉取数据库中的数据。操作数据库是需要密码的,将密码放在前端是一个十分危险的动作。故前端请求后端,后端拥有数据库的操作权限,将数据从数据库获取,返回到前端(当然后端不仅仅获取数据库数据,还有业务逻辑的处理)。本处我们就是在小程序中实现这个过程。
1.编写微信小程序的前端代码(index.wxml)
<view class="test_requests"> <view bindtap="click_fn"> <button> 请求后端 </button> <text>{{title}}</text> <text>{{time}}</text> </view> </view>
2, 编写动作函数(index.js)
Page({ // 定义点击事件 click_fn: function (params) { var self = this wx.request({url:"http://192.168.5.59:80/forTest", method: 'GET', header: { "content-type": "json" }, success: function (res) { console.log(res.data) console.log(res.data.d) self.setData({ title: res.data.d, time:res.data.f }) }, fail: function (error) { // fail console.log(error) } }) }})
我们自定义了一个函数叫click_fn 。 看到html代码,将其通过关键字bindtap绑定到了这个button 块上。
当我们点击这个块时,触发click_fn 函数,向后端服务“http://192.168.5.59:7998/lz/api/v1/alive”发送了一个GET 请求。同时将后端返回的数据 通过setDate( ) 更新到我们的变量上,然后通过前端页面展示。这样我们便完成了一次前端请求后端,获取到数据后重新展示到前端页面。
这里有点小坑,按照上文的经验。使用 this.setData() 方法可以将数据进行更新到我们的变量中。但是在这个我们自定义的函数click_fn 里是不能直接使用 this。必须要声明一个变量来承接这个 this(这里有点想不明白,清楚的朋友可以讨论下)。
最后附上python编写的后端接口代码
from flask import jsonifyfromflask_restfulimportResourcefrom utils.response_data import successclass ForTest(Resource):defget(self): data = success(title='这是一个标题', time='假装这是时间') return jsonify(data)