上传图片时出现错误 413 有效载荷太大答案

【问题标题】：Error 413 payload too large when upload image上传图片时出现错误 413 有效载荷太大
【发布时间】：2020-07-11 19:26:47
【问题描述】：

我正在尝试使用 base64 从本地上传图像来进行图像检测。
在本地主机和邮递员中一切正常。
但是在部署之后，我得到了 CROS 错误。

我已经在 server.js 中获得了 cors 中间件

const express = require("express");    
const cors = require("cors");
const bodyParser = require("body-parser");

const app = express();

app.use(cors());

app.use(bodyParser.json({ limit: "10000kb", extended: true }));
app.use(bodyParser.urlencoded({ limit: "10000kb", extended: true }));

cors 中间件在使用 url 获取图像时工作正常，
但是当我尝试使用 base64从本地上传图片时，控制台显示：

No 'Access-Control-Allow-Origin' header is present on the requested resource.

这是我尝试过的解决方案：

cors-任何地方

App.js

    const proxyUrl = 'https://cors-anywhere.herokuapp.com/';
    
    fetch(proxyUrl + API_CALL.IMAGE_URL, {
          method: 'post',
          headers: {'Content-Type': 'application/json'},
          body: JSON.stringify({
            inputLink: inputLink,
            inputMethod: inputMethod
          }),
          credentials: 'include'
        })

然后显示413 payload too large。

由于在localhost和postman中测试都没有报错，我发现有文章说可能还是cors错误。

CORS 预检

server.js

    const corsOptions = {
        origin: 'https://front-end-url/',
        methods: 'GET, POST, PUT',
        credentials: true,
        allowedHeaders: 'Content-Type,Authorization',
        exposedHeaders: 'Content-Range,X-Content- Range'
    };
    app.options('/imageUrl', cors(corsOptions));

显示错误：

CORS policy: Response to preflight request doesn't pass access control check: 
The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' 
when the request's credentials mode is 'include'

删除credentials: 'include' 后，又显示413 payload too large。

我很困惑...有人知道如何解决吗？谢谢。

【问题讨论】：

这根本不会发生在本地主机上？
@PayamBeirami 它在本地主机和邮递员上工作正常，没有错误。
413 错误是实际问题。这就是导致浏览器记录 CORS 消息的原因——而不是相反。您没有 CORS 问题。你有413问题。如果您修复了 413 问题的原因，您可能会发现您现有的 CORS 配置已经按预期工作。
首先，您需要确定谁在回答 413 错误。它可能是您的快递服务器，也可能是其他东西。例如，将请求重定向到您的 express 服务器的 nginx 代理。如果是这种情况，您应该检查这些是否有任何设置，如缓冲区大小等
您好@sideshowbarker，我将bodyParser限制更改为100000000kb，并在node_modules > body-parser > lib文件夹中更改了json.js和text.js的限制，但它仍然显示413错误。我正在部署heroku。错误不是关于bodyParser，而是关于heroku？

标签： javascript node.js reactjs http-status-code-413

【解决方案1】：

最后通过放置来修复错误 express.json() 之后 bodyParser.

像这样：

app.use(bodyParser.json({limit: '50mb'}));
app.use(bodyParser.urlencoded({limit: '50mb', extended: true}));
app.use(express.json());

如果先运行 express.json()，express 会将全局限制设置为 1mb。

对于下一个需要更多详细信息的人： Error: request entity too large
对于需要设置 Nginx 配置文件的人： Increasing client_max_body_size in Nginx conf on AWS Elastic Beanstalk

【讨论】：

我确定我的错误来自这里，我也在 ELB 上。当我的发布请求正文内容长度超过 1 MB 时，我的服务器会引发 CORS 错误！还是解决不了。

【解决方案2】：

快速使用

app.use(bodyParser.json({ limit: '50mb' }))
app.use(bodyParser.urlencoded({ limit: '50mb', extended: true, parameterLimit: 50000 }))

但是在 Nginx 中，您还必须编辑 /etc/nginx/nginx.conf 并在 http 块内添加以下行：

client_max_body_size 50M;

然后用sudo service nginx restart重启Nginx

【讨论】：

我们可以在 ElasticBeanstalk 上找到该文件/etc/nginx/nginx.conf
我不知道ElasticBeanstalk 是什么意思，但是要在Unix 中搜索文件中的单词，请使用grep：grep ElasticBeanstalk /etc/nginx/nginx.conf