在Express中请求其他server的接口，你需要知道…-一一网

新学了Express框架，于是把手上现有的项目，用Express包了一层，练练手。

1 创建项目

先全局安装Express脚手架，然后使用脚手架新创建一个Express项目。

// 全局安装脚手架 
npm install express-generator -g 

// 安装项目 
express lol-backend
复制代码

2 项目目录结构

根目录下创建controller文件夹，里面文件是各接口数据逻辑
根目录下的routes文件夹，里面的文件是路由

3 接口注册

routes下新创建一个文件夹 rest.js，里面定义接口
在app.js中，进行rest.js注册，定好前缀

例子

routes/rest.js部分代码 ↓

var express = require('express');
var router = express.Router();
const {  fetchMembers } = require('../controller/rest')

router.post('/*/fetch_info', (req, res, next) => {
  const result = fetchMembers(req)
  return result.then(data => {
    res.json(data)
  }).catch(e => {
    res.json(e)
  })
})
复制代码

app.js 部分代码 ↓

const restRouter = require('./routes/rest')

app.use('/rest', restRouter)
复制代码

4 client端发送请求时带过来的参数

路径参数：拼接在client请求链接中间的参数，使用 * 匹配

例子↓，client发送的post类型，/{path}/rest_info相关的请求，都会被匹配到

router.post('/*/rest_info', (req, res, next) => {
  const result = fetchMembers(req)
  return result.then(data => {
    res.json(data)
  }).catch(e => {
    res.json(e)
  })
})
复制代码

params参数：拼在client链接?后面的参数，在req.query对象中

例如，get_pay_list 接口

router.get('/get_pay_list', (req, res, next) => {
  const result = getPayList(req)
  return result.then(data => {
    res.json(data)
  }).catch(e => {
    res.json(e)
  })
})
复制代码

getPayList方法中，用qs.stringify(req.query)，将params参数到链接后面

const getPayList = (req) => {
  return new Promise((resolve, reject) => {
    fetch(`${API_URL}/setting?${qs.stringify(req.query)}`, {
      method: 'get',
      headers: getHeaders(req, true)
    }).then(response => {
      if(response.ok) {
        resolve(response.json())
      }else if(response.status === 401) {
        resolve({status: 401})
      }else {
        reject('getPayList failed!')
      }
    }).catch(e => {
      reject('getPayList error!')
    })
  })
}
复制代码

body参数：client带过来的body参数，在req.body中

const download = (req) => {
  const lang = req.params[0]
  const bodyData = req.body

  return new Promise((resolve, reject) => {
    fetch(`${APP_API_URL}/api/${lang}/v1/cards`, {
      method: "post",
      body: JSON.stringify(bodyData),
      headers: getHeaders(req, true),
    }).then(response => {
      if (response.ok) {
        resolve(response)
      } else if (response.status === 401) {
        resolve({ status: 401 })
      } else {
        reject('download failed')
      }
    }).catch(e => {
      reject('download error')
    })
  })
}
复制代码

5 fetch发送请求如何带参数

params参数，使用时，直接拼在链接后面。参照上面的getPayList方法
body参数，使用时，用JSON.stringify()转成字符串。参照上面的download方法

6 接口返回值判断

判断接口是否成功 response.ok
不成功的接口，返回的值，在response.ok以外处理

比如下面的↓

接口响应码是401时，返回给client一个对象 →response.status
非401和200时，如果有文案提示，将文案显示出来 →response.text()

const fetchMembers = (req) => {
  const lang = req.params[0]
  const bodyData = req.body

  return new Promise((resolve, reject) => {
    fetch(`${APP_API_URL}/api/${lang}/fetch`, {
      method: "post",
      body: JSON.stringify(bodyData),
      headers: getHeaders(req, true)
    }).then(response => {
      if (response.ok) {
        resolve(response.json())
      } else if (response.status === 401) {
        resolve({ status: 401 })
      } else {
        response.text().then(e => {
          try {
            e = typeof e === 'string' ? JSON.parse(e) : e
          } catch (error) { }
          reject(e)
        })
      }

    }).catch(e => {
      reject('fetch restaurant info error!')
    })
  })
}
复制代码

7 接口返回值格式化

json格式的数据, 参照上面的fetchMembers例子 →response.json()
arrayBuffer格式的数据，处理方法

download方法（参照上面的download）将接口请求的数据，原封不动返回给 router
router中通过arrayBuffer()方法，将arraybuffer格式的数据返回给client

router.post('/*/download', (req, res, next) => {
  const result = download(req)
  return result.then(blob => {
    blob.arrayBuffer().then((buf) => {
      res.send(Buffer.from(buf))
    })
  }).catch(e => {
    res.json(e)
  })
})
复制代码