table.set()仅设全局headers且后调用覆盖前调用,不适用于多表不同token场景;render中headers优先级更高,2.8+支持;旧版或动态token需用beforeSend;upload必须在before钩子中设置this.headers。
table.set() 只能设全局默认 headers,不能区分不同表格
如果你只有一张表,或者所有 table 请求都要带同样的 authorization,用 table.set() 最省事。但它必须在 table.render() 之前调用,且后一次调用会完全覆盖前一次 —— 所以它不适用于“这张表用 token a,那张表用 token b”的场景。
常见错误是:先 set 一个 headers,再 render 第一张表;接着又 set 另一个 headers,再 render 第二张表。结果第二张表的请求头生效了,第一张的被覆盖失效。
-
table.set({ headers: { 'Authorization': 'Bearer ' + localStorage.getItem('token') } })是可行的,但 token 必须在调用时已存在 - 如果 token 是异步获取(比如登录后才存入 localStorage),
table.set()里直接读可能拿到null - 它只影响
table模块的请求,不影响form、upload或手动$.get
render 时传 headers 参数,优先级高于 table.set()
当你要为某张特定表格单独加 Authorization,或需要和全局 headers 合并使用(比如全局有 X-Source,这张表额外加 Authorization),就在 table.render() 的配置里直接写 headers 字段。
注意:这个字段只在 Layui 2.8+ 支持;旧版本会忽略它,必须走 beforeSend。
- 同名 header 以
render配置为准 —— 比如table.set()设了Content-Type: text/plain,render里又写了Content-Type: application/json,最终发出去的是后者 -
headers是对象,不是字符串,别写成headers: 'Bearer xxx' - 示例:
headers: { 'Authorization': 'Bearer ' + localStorage.getItem('token') }
旧版本或需动态 token 时,必须用 beforeSend 修改 XHR
Layui 2.7.x 及更早版本不支持 headers 配置项,且即使新版,若 token 依赖运行时状态(比如登录态变化、JWT 刷新),render 里直接拼字符串也不可靠 —— 这时唯一稳定的方式是用 beforeSend 回调,在原生 XMLHttpRequest 实例上手动设头。
这个回调在每次请求发出前触发,能确保每次请求都读取最新 token。
- 写法:
beforeSend: function(xhr) { xhr.setRequestHeader('Authorization', 'Bearer ' + localStorage.getItem('token')); } - 务必检查 token 是否存在,避免发空值导致 401:
if (!localStorage.getItem('token')) return false; - 不要在
beforeSend里做异步操作(比如 fetch 新 token),它必须同步返回 - 这个方式对 POST/GET 都有效,但注意:如果 method 是
post且没设contentType,jQuery 默认用application/x-www-form-urlencoded,后端可能不校验该格式下的Authorization
上传组件 upload 的 headers 完全不走同一套机制
别指望 table.set()、ajaxPrefilter 或 beforeSend 能让 upload 带上 Authorization —— 它底层用的是原生 XMLHttpRequest + FormData,绕过了 jQuery 的所有拦截逻辑。
必须在 upload.render() 的 before 钩子里给 this.headers 赋值,而且每次上传前都要执行。
- 写法:
before: function() { this.headers = { 'Authorization': 'Bearer ' + localStorage.getItem('token') }; } -
this.headers是实例级属性,改它才生效;在配置项里写headers: {...}是无效的 - 切勿手动设置
Content-Type,浏览器会自动设为multipart/form-data;硬写反而导致后端解析失败 - 如果后端 CORS 白名单没包含你自定义的 header 字段(比如
X-Auth-Token),预检请求会被浏览器拦截,上传直接卡在 OPTIONS 阶段


















