CDDN私信我,有关微信小程序的事情可以交流讨论,共同学习!
一、功能描述
针对微信小程序的A页面,有: A.js A.json A.wxml A.wxss 四个文件,此处需要在A.js文件里面获取到服务器的数据库里面的数据并保存在A.js的某一数组变量里,方便 A.wxml调用其值。
二、服务器、数据库与微信小程序逻辑的关系
服务器
简而言之就是你买了一个可以用http://xxx.xxx.xx.xx来访问的存储空间,类似于百度云盘一样,把一些图片、后端的文件存在这个http地址里面,以后你就可以用任何联网的手机、电脑来访问。购买服务器的话,一般推荐阿里云、腾讯云,最低配学生价大约为100¥。
数据库
当你买了服务器之后,可以在服务器里面安装php、mysql等等。服务器会伴生一个数据库给你用。例如,我买的是阿里云服务器,用的是宝塔镜像页面打开,数据库是phpMyAdmin可视化管理工具。
也就是你放在服务器里面的后端文件,可以直接访问你服务器相绑定的数据库。
与微信小程序逻辑关系
微信小程序里点击了一个按钮,触发js事件,js事件(也就是在js页面定义的函数)会调用微信小程序自带的wx.request({})来进行网络请求。然后请求了你服务器上的某个文件,通过这个后端文件,来对你服务器相绑定的数据库进行增删改查操作。
三、请求数据的代码(可当做模板用)
A.js页面的写法
onLoad: function (options) {//onLoad表示在该页面注册的时候就调用该部分的内容 var that=this;//定义this指针的别名,that和this在下面某处的作用域是不一样的 wx.request({//网络请求 url: 'http://47.103.21.63/jnSelfPick/php/req_postList.php',//网络请求的文件地址, //47.103.21.63是我的服务器ip地址,微信小程序在编程期间是可以用ip访问的,但是上线必须用域名代替ip //req_postList.php是我的后端文件,用php写的 data: { openid: '1234567890'//表示向req_postList.php文件传递的参数 }, method: 'GET', header: { 'content-type': 'application/json' }, success: function (res) {//请求成功的回调函数 //this.setData是微信小程序绑定数据的函数,由于作用域问题,这里用that.setData that.setData({ //绑定json格式的数据给postList变量,res.data即为req_postList.php文件返回的数据 postList: res.data }) }, fail: function (res) {//请求失败的回调函数,报错 wx.showModal({ title: '提示', content: res.data, }) } }) },
服务器端req_postList.php的写法
<?php //链接你的服务器对应端口,填入相应账号、密码 $con = mysql_connect("47.103.21.63:****","name","password"); if (!$con) { die('数据库连接失败: ' . mysql_error()); } $db=mysql_select_db("jnSlefPick");//选择数据库名称 $openid=$_GET["openid"]; $rs1 ="CREATE TEMPORARY TABLE tmp (SELECT * FROM toolTap WHERE openid='$openid')"; $r1=mysql_query($rs1); $rs="SELECT PUI.pno,ptimecollectionStatus FROM PUI left join tmp ON PUI.pno=tmp.pno"; $r=mysql_query($rs); while($obj = mysql_fetch_object($r)) { $array[]=$obj;//这里$array已经是获取到的数据了 } $jsoncode=json_encode($array);//把$array转化为json格式的数据,方便小程序调用 //返回数据,直接用echo 即为想微信小程序端返回数据,等同于微信小程序里面的res.data echo $jsoncode; ?>