Браузеры не получают / не интерпретируют ответ 413 от Nginx

#nginx #browser

#nginx #браузер

Вопрос:

У меня есть приложение Angular 2, которое использует ng2-file-upload для загрузки файлов на сервер под управлением Nginx. Nginx определенно отправляет 413, когда размер файла слишком велик, но браузеры (Chrome и Safari), похоже, не улавливают / не интерпретируют его.

Ошибка консоли 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, а заголовки представляют собой пустой объект.

Любая помощь будет высоко оценена!

Ответ №1:

Кажется, это старый вопрос, но еще печальнее, что в 2019 году Firefox и chrome по-прежнему не обрабатывают 413, как вы ожидали. Продолжают обрабатывать загрузку, несмотря на то, что nginx отправляет 413.

Старый добрый Safari (слова, которые я не часто произношу), по-видимому, является единственным современным браузером, который делает то, что вы ожидаете, и если вы отправляете пользовательскую ошибку 413, он обрабатывает ее.

Что касается этого вопроса, вы можете использовать Angular для получения размера файла и иметь простую конечную точку, которая проверяет, является ли она большой, прежде чем отправлять фактический файл.

Выполнение этого в JS было бы лучшим вариантом.

Комментарии:

1. Эта проблема все еще остается в 2022 году. Я попытался загрузить большой файл, который превышает настроенный client_max_body_size в Nginx. Даже если Nginx уже ответил кодом 413 (что я мог подтвердить в журналах сервера), Chrome все равно пытался продолжить процесс загрузки. Затем это закончилось ERR_CONNECTION_CLOSED , тогда как Safari (или даже Postman) немедленно прекратил загрузку и показал код 413 на вкладке Проверка сети.

Ответ №2:

Аналогичный вопрос также был опубликован здесь. Как указано в принятом ответе:

Проблема в том, что большинство HTTP-клиентов не читают ответ, пока не отправят все тело запроса. Если вы имеете дело с веб-браузерами, вам, вероятно, здесь не повезло.

Недавно я попробовал использовать последнюю версию Safari (версии 15.6 — 17613.3.9.1.5), и она обрабатывает ошибку, как я и ожидал. Он прерывает загрузку файла сразу после получения кода 413 с сервера.

В этом случае я согласен с ответом @AppHandwerker о том, что мы должны проверить размер файла на стороне клиента перед началом загрузки.