vue 前端文件上传报错:上传失败,原因: 413 Request Entity Too Large

vue 前端文件上传报错:上传失败,原因: 413 Request Entity Too Large

先上报错效果图:

vue 前端文件上传报错:上传失败,原因: 413 Request Entity Too Large_第1张图片

1.问题:在本地开发中无论上传小文件还是大文件都可以上传成功,但将代码发布到测试环境后,超过1mb的文件就会报错,打开控制台一看413 Request Entity Too Large

2.排查我们的系统接口在node层做了一下转发代理用到了koaBody (有的没有加这个,可以忽略)

app.use(
  koaBody({
    parsedMethods: ['POST', 'PUT', 'PATCH', 'DELETE'],
    formLimit: '200mb',
    jsonLimit: '200mb', // ajax 请求
    textLimit: '200mb',
    multipart: false,
    formidable: {
      maxFieldsSize: 10 * 1024 * 1024
    },
  })
);

前端限制解除,重新打包上线,还是报错 413 Request Entity Too Large

继续排查:

Nginx默认最大能够上传1MB文件大于1MB的文件自然无法上传,打开nginx.conf(没权限找运维人员)在http{ }中设置:client_max_body_size 200m。这里根据自己公司的需求限制大小哈,我们这限制为200M.

vue 前端文件上传报错:上传失败,原因: 413 Request Entity Too Large_第2张图片

解除成功的案例:

vue 前端文件上传报错:上传失败,原因: 413 Request Entity Too Large_第3张图片

你可能感兴趣的:(VUE组件,vue.js)