Question

我有一个Angular 2应用程序正在使用ng2-file-upload将文件上传到运行Nginx的服务器。当文件太大但浏览器（Chrome和Safari）似乎没有抓住它/解释它时，Nginx肯定会发送413。

Chrome控制台错误：

XMLHttpRequest cannot load <url>. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '<url>' is therefore not allowed access. The response had HTTP status code 413.

Safari控制台错误

XMLHttpRequest cannot load <url>. Origin <url> is not allowed by Access-Control-Allow-Origin.

Nginx配置

server {
  listen 80;

  server_name <url>;

  access_log /var/log/nginx/access.log main;

  client_max_body_size 4m;

  location / {
    proxy_pass http://<ip address>:3009;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
    proxy_set_header Host $host;
    proxy_cache_bypass $http_upgrade;
  }
}

Nginx访问日志

<ip address> - - [11/Oct/2016:17:28:26 +0100] "OPTIONS /properties/57fbab6087f787a80407c3b4/floors HTTP/1.1" 200 4 "<url>" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.143 Safari/537.36" "-"
<ip address> - - [11/Oct/2016:17:28:36 +0100] "POST /properties/57fbab6087f787a80407c3b4/floors HTTP/1.1" 413 601 "<url>" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.143 Safari/537.36" "-"

Nginx错误日志

2016/10/11 17:28:26 [error] 30847#0: *1489 client intended to send too large body: 34865919 bytes, client: <ip address>, server: <server>, request: "POST /properties/57fbab6087f787a80407c3b4/floors HTTP/1.1", host: "<host>", referrer: "<url>"

调用ng2-file-upload错误处理方法时，响应代码为0，标题为空对象。

非常感谢任何帮助！

Answer 1

似乎是一个古老的问题，但更令人遗憾的是，在2019年，Firefox和chrome仍然无法像您期望的那样处理413。尽管nginx发送了413，仍继续处理上传。

好的旧版Safari（我不常说的话）似乎是唯一可以满足您期望的现代浏览器，如果您发送自定义413错误，它将处理该错误。

关于此问题，您可以使用Angular来获取文件的大小，并具有简单的终结点，可以在发送实际文件之前验证其是否过大。

在JS中执行此操作将是最佳选择。

浏览器没有接收/解释来自Nginx的{41}的响应

1 个答案: