我正在用React和Redux构建一个前端应用程序,我正在使用axios来执行我的请求。我想访问响应头中的所有字段。在我的浏览器中,我可以检查标题,我可以看到我需要的所有字段都是存在的(如令牌,uid等…),但当我调用

const request = axios.post(`${ROOT_URL}/auth/sign_in`, props);
request.then((response)=>{
  console.log(response.headers);
});

我只是

Object {content-type: "application/json; charset=utf-8", cache-control: "max-age=0, private, must-revalidate"}

这里我的浏览器网络选项卡,正如你可以看到的所有其他领域都存在。

最好成绩。


当前回答

对于django help

CORS_EXPOSE_HEADERS = [
        'your header'
    ]

其他回答

在axios CORS请求中,默认情况下浏览器只能访问少数报头。

但是如果你需要从响应中访问一个自定义的头,你必须从你的后端服务器用access - control - expose - headers发送响应。

Hare是Nodejs后端和Reactjs前端的一个例子:

res.header('Access-Control-Expose-Headers', 'x-xsrf-token');

return res.header("x-xsrf-token", token).status(200)
           .send({
                id: user.id,
                email: user.email,
            });

res.header(“Access-Control-Expose-Headers”、“x-xsrf-token”);

对于这一行,我可以记录我的自定义标题

axios.post("/login", {
            email: emailInput.current.value,
            password: passwordInput.current.value,
        })
        .then(function (response) {

            console.log(response.headers["x-xsrf-token"]);

        });

在你的响应中没有Access-Control-Expose-Headers,你将在控制台日志中得到undefine。检查您的响应头在网络选项卡,它包含与您的自定义名称的头。

根据官方文件:

如果您需要服务器响应的HTTP报头,这可能会有所帮助。所有标头名称都是小写的,并且可以使用括号符号访问。例如:响应。Headers ['content-type']将给出如下内容:

对于Spring Boot 2,如果你不想使用全局CORS配置,你可以通过方法或类/控制器级别使用@CrossOrigin声明和exposedHeaders属性来实现。

例如,为YourController方法添加头授权:

@CrossOrigin(exposedHeaders = "authorization")
@RestController
public class YourController {
    ...
}

在这次谈话中还有一个暗示。 asp.net core 3.1 首先添加一个键,你需要把它放在头部,就像这样:

Response.Headers.Add("your-key-to-use-it-axios", "your-value");

在你定义cors策略的地方(通常是在Startup.cs中),你应该像这样将这个键添加到WithExposedHeaders中。

          services.AddCors(options =>
        {
        options.AddPolicy("CorsPolicy",
            builder => builder
                .AllowAnyHeader()
                .AllowAnyMethod()
                .AllowAnyOrigin()
                .WithExposedHeaders("your-key-to-use-it-axios"));
        });
    }

你可以在这里添加所有的键。 现在,在您的客户端,您可以通过使用响应结果轻松地访问“使用它的密钥”。

          localStorage.setItem("your-key", response.headers["your-key-to-use-it-axios"]);

你可以在所有客户端使用它,像这样访问它:

const jwt = localStorage.getItem("your-key")

对于django help

CORS_EXPOSE_HEADERS = [
        'your header'
    ]