小程序端 `wx.uploadFile` 上传文件,经 `node` 端中转到 `JAVA` 服务。

·  阅读 1020

小程序端使用 wx.uploadFile 上传文件,经 node 端中转到 JAVA 服务。
node 端,采用 koa-multer 接收文件实例,再用 axios 中转。

本实例主要说明,在服务端怎么获取 文件流formData 附加参数。

  1. 小程序端代码:
// 封装为一个 promise 方法,挂着
const upload = ({
  filePath,
  formData,
}) => {
    return new Promise((resolve, reject) => {
        wx.uploadFile({
          url: hostname + '/upload/file', // 上传到node服务端
          filePath: filePath,
          formData: formData,
          name: 'file',
          header: {
            'di': wx.getStorageSync('vid'), // device id
            'Cookie': utils.getCookies() // 读取cookie
          },
          success: res => {
            let data = JSON.parse(res.data)
            if (res.statusCode === 200 && data.code === 0) {
              resolve(data)
            } else {
              reject(data)
            }
          },
          fail: res => {
            reject(res)
          },
        })
    })
}
// 调用
this.$api.upload({
    filePath: item.temp, // 选择的图片
    formData: {
      uploadType: 2, // 1:头像 ,2:动态图片 3:身份证
    }
}).then(res => {}).catch(e => {})
复制代码
  1. node 端代码
const Router = require('koa-router')
const multer = require('koa-multer')
const router = new Router()
// 文件保存目录,未指定时,默认是系统临时文件夹,因本实例是中转,故未指定目录,若是服务端直接存储可参考 https://github.com/koa-modules/multer
router.all('/upload/file', multer().single('file'), ctx => {
  ctx.request.url = ctx.request.url.replace('/api', '')
  // 本实例是继续中转上传到 java 服务端
  // koa-multer 请求对象在 ctx.req 中
  console.log(ctx.req.body) // {uploadType: 2}
  return uploadApi.fetchJava(ctx, ctx.req.body).then(res => {
    ctx.body = res
  }, res => {
    ctx.body = res
  })
})

// uploadApi.fetchJava() 部分代码
const axios = require('axios')
const FormData = require('form-data')
class Api {
  constructor() {
    this.post = (baseUrl = '', ctx, data = {}) => new Promise((resolve, reject) => {
        let form = this.getData(ctx, data)
        let options = {
          method: method,
          url: url,
          data: form,
          withCredentials: true,
          timeout: config.timeout,
          headers: {
            'Accept': 'image/*,application/json;q=0.9, */*;',
            'Content-Type': 'multipart/form-data;boundary=' + form.getBoundary()
          }
        }
        axios(options).then(res => {
            //...
        })
       
    })     
  }
  getData(ctx, data){
    const form = new FormData()
    for (const key in data) {
      form.append(key, params[key] + '\r\n--' + form.getBoundary())
    }
    // 注意: koa-multer 文件对象在 ctx.req.file 不是 ctx.request.file
    let file = ctx.req.body
    form.append('fileStreams', file.buffer, {
      filename: file.fieldname,
      originalname: file.originalname,
      size: file.size,
      mimetype: file.mimetype,
      encoding: file.encoding
    })
    return form
  }
  fetchJava(req, data) {
    this.encryMode = 2
    return this.post(config['javaHost'], req, data)
  }
}
复制代码
分类:
前端
标签:
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改