vue中使用axios获取不到响应头Content-Disposition的解决办法

在Vue中使用axios获取不到响应头Content-Disposition的问题通常是因为跨域(CORS)策略导致的。CORS规定浏览器不能暴露一些认为敏感的头信息，Content-Disposition就是其中之一。

解决办法：

1. 如果你控制着服务器端，确保服务器在响应CORS预检请求时，在Access-Control-Allow-Headers字段中包含Content-Disposition。

服务器端示例代码（以Node.js和Express为例）：

app.options('/endpoint', function(req, res, next){
    res.header("Access-Control-Allow-Headers", "Content-Disposition");
    res.send();
});

2. 如果你不控制服务器，但是你有权限修改你的Vue应用，可以在服务器配置中添加代理，将请求发送到本地服务器，然后由本地服务器转发请求到目标服务器，从而绕过CORS限制。

Vue CLI代理配置示例：

// vue.config.js
module.exports = {
    devServer: {
        proxy: {
            '/api': {
                target: 'http://target-server.com',
                changeOrigin: true,
                onProxyRes: function(proxyRes, req, res) {
                    const contentDisposition = proxyRes.headers['content-disposition'];
                    if (contentDisposition) {
                        res.append('Access-Control-Expose-Headers', 'Content-Disposition');
                    }
                }
            }
        }
    }
};

在这个配置中，当你向/api发送请求时，Vue开发服务器会将请求转发到http://target-server.com，并且通过changeOrigin选项将请求头中的Origin改为开发服务器的地址，从而绕过CORS的限制。通过onProxyRes钩子函数，你可以修改响应头，使得Content-Disposition头信息可以被客户端访问。