如何在Flutter中使用http包获取content-disposition响应头

问题原因 #

你遇到的响应头不全的问题本质是Web端浏览器CORS策略的限制，你使用的http: ^0.13.3版本本身不存在响应头解析的bug，不需要调整依赖版本。从你提供的Flutter环境信息可以看到你当前是在Chrome Web平台运行项目：

• 默认情况下，浏览器只允许前端JS代码访问6种基础响应头：cache-control、content-language、content-type、expires、last-modified、pragma，其余所有自定义头或者非基础头都会被浏览器默认隐藏，即便网络请求实际返回了这些头，前端也无法直接读取。

解决方法 #

场景1：你可控制后端服务配置（生产环境可用）

在后端服务的响应头中添加Access-Control-Expose-Headers字段，将你需要前端获取的响应头全部填入该字段，多个值用逗号分隔即可。例如你需要获取content-disposition头，配置示例如下：

Access-Control-Expose-Headers: content-disposition, 其他需要暴露的头字段

配置完成后Web端即可正常读取对应的响应头信息。

场景2：仅本地调试用，无需修改后端

本地启动Flutter Web时添加禁用浏览器安全策略的启动参数，即可跳过CORS限制读取完整响应头：

flutter run -d chrome --web-browser-flag "--disable-web-security" --web-browser-flag "--disable-features=IsolateOrigins,site-per-process"

⚠️ 该方法仅可用于本地开发调试，禁止在生产环境使用。

场景3：无需兼容Web端

如果你的项目最终运行在移动端/桌面端，可直接切换到安卓/iOS/桌面端设备运行，Native平台没有浏览器CORS限制，可直接拿到完整的响应头信息。

内容的提问来源于stack exchange，提问作者Veljko Djuricic