error回调中需通过data.responsetext获取原始响应字符串,trim后尝试json.parse提取msg/message/error等字段,失败则直接使用原字符串;注意https页面下url必须为绝对https地址,否则请求被拦截导致无响应。

error回调里怎么拿到后端返回的错误信息
layui.upload 的 error 回调本身不自动解析响应体,它只传入原始 XHR 对象(参数名常为 data),而真正含错误详情的字符串在 data.responseText 里。别指望 res 或 index 里有 msg 字段——那得靠你自己从原始响应里抠。
常见错误现象:弹出“上传失败”但用户不知道哪错了;控制台打印 data 看起来是空对象,其实 responseText 没被展开查看。
- 必须显式读取
data.responseText,并做非空和 JSON 安全解析 - 不要直接
JSON.parse(data.responseText),先.trim()去 BOM 和空格,再 try/catch - 如果后端返回纯文本(如 "文件类型不支持")或 HTML 错误页,
JSON.parse会报错,此时应 fallback 到原字符串提示 - 示例逻辑:
error: function(data) {
const raw = (data.responseText || '').trim();
let msg = '上传失败,请检查网络或重试';
if (raw) {
try {
const res = JSON.parse(raw);
msg = res.msg || res.message || res.error || raw;
} catch (e) {
msg = raw; // 非 JSON,直接当错误信息用
}
}
layer.msg(msg, { icon: 5 });
}
为什么done回调里看不到失败信息
done 回调根本不会为失败文件触发——它只在服务端返回标准成功响应(code === 0)时执行。所以别在 done 里写错误处理逻辑,否则永远收不到。
容易踩的坑:把所有业务逻辑都堆在 done,结果失败时 UI 没反馈、控制台也没报错,用户以为“没点上”。
-
done的第三个参数index是文件序号,但仅对成功文件有效 - 失败文件的信息只能从
error回调的data(XHR 对象)中提取 - 如果后端批量返回(
unified: true),失败信息其实在done里,但这时error不会触发,需改用done+ 手动遍历res.data.results判断
后端返回格式不一致时怎么统一提取msg
现实后端字段五花八门:msg、message、error、detail 都可能出现。硬写 res.msg 会漏掉大量错误。
性能影响小,但逻辑必须健壮:每次解析都要覆盖常见键名,并留好兜底。
- 优先级建议:
res.msg→res.message→res.error→res.detail→JSON.stringify(res) - 避免直接访问
res.data.msg,除非你确定后端结构固定且data总存在 - 如果后端有时返回
{code:1, errors:[{field:"name", msg:"必填"}]},就得递归取第一个errors[0].msg,不能只看顶层
HTTPS混合内容拦截导致error回调都不执行
页面是 HTTPS,但上传 url 写成 http:// 或相对路径,浏览器会静默拦截请求,error 回调压根不触发,Network 面板显示 blocked:mixed-content,你连 responseText 都拿不到。
这是最隐蔽的“无错误信息”场景——不是后端没给,而是请求根本没发出去。
- 务必检查 Network 面板里该请求的状态列,是否标红为
blocked -
url必须是绝对 HTTPS 地址,例如"https://api.example.com/upload",不能是"/upload" - 本地开发时注意 mock 地址是否混用了
http://localhost,HTTPS 页面下会被拦
error 还是 done 去取。









