thinkjs接收get请求、post请求

此文介绍使用 thinkjs 如何获取前端的请求参数。

文章目录

• ​​笔者使用环境：​​
• ​​服务端对前端请求进行校验​​
• ​​服务端接收前端的请求参数​​

• ​​GET请求​​
• ​​POST请求​​

笔者使用环境：

服务端：thinkjs

前端：react

请求：umi-request

服务端对前端请求进行校验

文件目录： src/logic/user.js

请确保logic的目录和controller目录结构一致

module.exports = class extends think.Logic {
  checkTools(rules) {
    // 想要拓展这个方法的话具体校验内容可参考https://thinkjs.org/zh-cn/doc/3.0/logic.html
    const msgs = {
      required: '{name} 不能为空',
      string: '{name} 必须是字符串类型',
      array: '{name} 必须是数组类型',
      boolean: '{name} 必须是布尔类型',
      int: '{name} 必须是整数',
      float: '{name} 必须是浮点数类型',
      object: '{name} 必须是对象类型'
    };

    const flag = this.validate(rules, msgs);
    if (!flag) {
      return this.fail(1002, '参数校验失败', this.validateErrors);
    }
  }

  addUserAction() {
    this.allowMethods = 'post'; // 如果请求不是post的话会直接终止后续操作返回前端错误。
    return this.checkTools({
      name: { required: true, string: true, trim: true },
    }) // 调用自定义的方法进行校验参数
  }
}      

服务端接收前端的请求参数

GET请求

thinkjs服务端这边可以通过俩种方法获取：

1. this.ctx.request.query
2. this.get()

前端使用umi-request发送请求：

import umiRequest from 'umi-request';

// 省略了非关键代码
// 第一种请求加参数的方法
umiRequest.get('http://127.0.0.1:8360/user/queryUsers?id=2&name=3')
  .then((response) => {
    console.log(response)
  })
  .catch(err => {
    console.log(err);
  });
  
// 第二种请求加参数的方法
umiRequest.get('http://127.0.0.1:8360/user/queryUsers', {
  params: { id: 111, name: '吴迪' }
})
  .then((response) => {
    console.log(response)
  })
  .catch(err => {
    console.log(err);
  });      

POST请求

thinkjs服务端这边可以通过俩种方法获取：

1. this.ctx.request.body
2. this.post()

import umiRequest from 'umi-request';

// 省略了非关键代码
umiRequest.post('http://127.0.0.1:8360/user/editUser', {
  body: vals,
  headers: {
    "Content-Type": "application/json;"
  }
})
  .then((response) => {
    console.log(response);
  })
  .catch(err => {
    console.log(err);
  });