Layui上传组件如何处理服务器返回的413状态码(文件过大)

雨辰君_2577

雨辰君_2577

2026-05-25

959人浏览

原创

能,但仅限于请求已发出且服务器明确返回413响应的场景;此时layui upload的error回调中data.status为413,否则可能为0(如Nginx或CDN拦截),需结合responseText内容和Network面板综合判断。

layui upload 的 error 回调能捕获 413 吗?

能,但仅限于请求已发出、服务器明确返回了 413 payload too large 响应的场景。此时浏览器会触发 error 回调(注意:不是 done),data 参数是原生 xmlhttprequest 实例,其 status 为 413,statustext 通常是 "request entity too large" 或类似字符串。

常见误判点:

  • 如果请求在 Nginx 层就被拦截(如 client_max_body_size 不足),且未配置 error_page 413,Nginx 可能直接返回空白响应或跳转,此时 error 回调里 data.status 可能为 0,而非 413
  • 若使用了 Cloudflare 等 CDN,它可能在到达 Nginx 前就返回 413,此时 error 回调中 data.status 仍为 0(跨域限制导致状态码不可读)

如何在 error 回调里区分 413 和其他网络错误?

不能只依赖 data.status === 413 —— 它在多数代理拦截场景下不可靠。更稳妥的做法是结合响应体内容和控制台 Network 面板确认实际状态码,并在前端做双重校验:

  • 上传前用 file.size 对比 layui 的 size 配置(单位 KB),提前拦截明显超限文件
  • 在 error 回调中检查 data.responseText 是否包含 "413"、"Payload Too Large" 或 "Request Entity Too Large" 字样(Nginx 默认响应体含此文本)
  • 若 data.status === 0 且 data.readyState === 4,同时控制台 Network 显示状态码为 413,则基本可判定是代理层拦截

示例判断逻辑:

error: function(data) {
  const is413 = data.status === 413 || 
                (data.status === 0 && data.responseText?.includes('413')) ||
                /entity too large|payload too large/i.test(data.responseText || '');
  if (is413) {
    layer.msg('文件过大,请上传小于 ' + (this.size || 2048) + 'KB 的文件');
    return;
  }
  layer.msg('上传失败,请检查网络');
}

layui 的 size 限制和服务器 413 是什么关系?

layui 的 size 是纯前端校验,单位是 KB;它和服务器返回的 413 没有因果关系,只是第一道防线。两者独立生效:

深蓝色网站后台管理系统layui框架模板-AdminPro
深蓝色网站后台管理系统layui框架模板-AdminPro

一款深蓝色网站后台管理系统layui框架模板

下载
  • size: 2048 → 上传文件超过 2MB 时,layui 直接不发请求,触发 choose 或 before 中的自定义提示
  • 服务器 413 → 文件虽 ≤ layui 的 size,但超过了 Nginx 的 client_max_body_size、PHP 的 upload_max_filesize 或框架中间件(如 Express 的 limit)设置,此时请求已发出,后端/代理拒绝接收

典型脱节场景:layui 设置 size: 10240(10MB),但 Nginx client_max_body_size 2m,用户选一个 5MB 文件,layui 允许上传,但 Nginx 立即返回 413。

为什么改了 Nginx 的 client_max_body_size 还报 413?

因为 413 可能来自链路中任意一环,不止 Nginx。必须逐层排查:

  • Nginx:确认修改的是**实际生效的 server 或 location 块**,不是 http 块(除非全局需要),且执行了 nginx -t && nginx -s reload
  • 后端框架:Express 要配 app.use(express.json({ limit: '50mb' })) 和 app.use(express.urlencoded({ limit: '50mb', extended: true }));Koa 需设 bodyParser({ jsonLimit: '50mb', formLimit: '50mb' })
  • PHP(如用 JFinal + PHP 上传接口):检查 php.ini 中 upload_max_filesize 和 post_max_size,二者都需 ≥ 目标值
  • 网关或 CDN:Cloudflare 免费版上限 100MB;微服务网关(如 Spring Cloud Gateway)需调大 spring.cloud.gateway.httpclient.response-timeout 和缓冲区参数

最易忽略的一点:若使用宝塔面板,修改 Nginx 配置后必须点击「重载配置」,而不仅是「保存」——保存不等于生效。

相关专题

更多
服务器是什么
服务器是什么

服务器是一种计算机硬件设备或软件程序,它具有强大的计算和存储能力,用请求、存储数据和提供服务。它在互联网中着关重要的作用,为用户提供各种服务和资源。本专题为大家提供服务器相关的文章、下载、课程内容,供大家免费下载体验。

2023.08.15

457

5

连接apple id服务器时出错
连接apple id服务器时出错

连接apple id服务器时出错的原因包括网络连接问题、服务器问题、Apple ID账户问题、设备问题、防火墙或安全软件问题、时间和日期设置问题、Apple服务器维护等。本专题为大家提供apple id相关的文章、下载、课程内容,供大家免费下载体验。

2023.09.08

920

5

搭建互联网服务器
搭建互联网服务器

搭建互联网服务器需要:1、选择合适的硬件和操作系统,第一步是选择合适的硬件和操作系统;2、安装和配置操作系统,是搭建互联网服务器的关键步骤;3、安装和配置服务器软件,是搭建互联网服务器的下一步,常见的服务器软件包括Apache、Nginx、Tomcat等;4、配置防火墙和安全性,是搭建互联网服务器的重要步骤;5、域名解析和配置,是搭建互联网服务器的最后一步。

2023.09.19

2972

5

如何查看服务器状态
如何查看服务器状态

查看服务器状态的方法有使用命令行工具、图形界面工具、监控工具、日志文件和远程管理工具等。本专题为大家提供服务器状态相关的文章、下载、课程内容,供大家免费下载体验。

2023.10.09

996

5

服务器域名转接慢怎么解决
服务器域名转接慢怎么解决

服务器域名转接慢的解决办法有DNS优化、服务器优化、CDN加速、前端优化和网络优化等。本专题为大家提供服务器相关的文章、下载、课程内容,供大家免费下载体验。

2023.10.17

889

5

服务器评测软件
服务器评测软件

服务器评测软件有PassMark Software、CPU-Z、GPU-Z、CrystalDiskMark、IOmeter、JMeter、LoadRunner、Apache Bench等等。详细介绍:1、PassMark Software是一款综合性的服务器性能测试软件,可以评估服务器在各种负载条件下的性能;2、CPU-Z是一款可以提供服务器CPU详细信息的软件等等。

2023.10.17

454

3

如何开启TFTP服务器
如何开启TFTP服务器

开启TFTP服务器的步骤包括选择TFTP服务器软件、下载和安装软件、配置TFTP服务器以及启动和测试服务器等。本专题为大家提供服务器相关的文章、下载、课程内容,供大家免费下载体验。

2023.10.18

2696

4

服务器负载不兼容怎么解决
服务器负载不兼容怎么解决

解决方法:1、增加服务器资源;2、负载均衡;3、优化应用程序;4、增加缓存机制;5、分布式架构;6、限流和熔断;7、自动化扩容。想知道更详细服务器负载不兼容的解决方法,可以访问本专题下面的文章。

2023.10.20

5032

4

宽带如何接入服务器
宽带如何接入服务器

宽带接入服务器的方法有ADSL宽带接入服务器、光纤接入服务器、无线接入服务器和以太网接入服务器等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2023.10.20

787

5

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
ThinkPHP配置开发与CMS后台实战
ThinkPHP配置开发与CMS后台实战

共87课时 | 12.9万人学习

第二十三期_综合实战
第二十三期_综合实战

共89课时 | 11.1万人学习

Layui 快速入门精讲
Layui 快速入门精讲

共5课时 | 1.6万人学习