全栈宝宝级教学—小程序前端+Express后端+MySQL数据库(下)

  这一节我们主要讲小程序作为前端,向后端发送请求的测试,为什么拿小程序呢,因为它真的极为方便。
  全栈宝宝级教学—小程序前端+Express后端+MySQL数据库(上)
  全栈宝宝级教学—小程序前端+Express后端+MySQL数据库(中)

五、小程序前端测试

首先,你需要下载微信开发者工具,下载安装后,进入程序如下图所示,我们需要创建一个新的小程序项目,AppID可以点击Test Account or 测试号 获取一个

启示界面

在正式写代码前,我们还需要修改一下开发工具的设置,按红框里面修改就行
开发者工具配置

然后我们进入pages/index/index.js文件里面,需要写一个测试函数,然后在onLoad函数里调用一下,需要注意的点已经用标出来了,代码如下:

testFunc () {
    console.log("start request")
    wx.request({
      url: 'http://***.***.***.***:3000/products/addProducts',
      data: {
        name: '变形金刚',
        price: 123123.12
      },
      header: {
        "content-type": "application/x-www-form-urlencoded"
      },
      method: 'POST',
      success: function (res) {
        console.log("success:" + JSON.stringify(res.data));
      }
    })
  },
index.js

然后我们按一下ctrl+S或者command+s,在我们满怀期待,即将成功的时候,是不是发现报错了


报错

因为我们还没开服务器啊!
在服务器端myProject目录下,输入以下代码

npm start

然后我们再在微信开发工具里面重新ctrl+S或者command+S(如果没反应按command+B)


测试成功

然后我们去数据库看一下有没有新数据,回到服务器端,终止服务器服务请按control + C,然后进入MySQL,输入以下代码:

use myProject
SELECT * FROM products;
数据库测试成功

至此,你已经完整的走了一遍前后端的交互过程,离全栈工程师又更近了一步✌

参考文章
初识NodeJS服务端开发之NodeJS+Express+MySQL

心得体验
  之所以在Django后又尝试Express作为服务器框架,是因为之前有看到说Express的性能和响应速度要更快一点,但是本人还未做严格的对比实验,所以无法给出具体的参考意见;对于轻量级应用来说,估计差别不是很大。

你可能感兴趣的:(全栈宝宝级教学—小程序前端+Express后端+MySQL数据库(下))