Axios получают доступ к полям заголовка ответа

Я создаю внешнее приложение с 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"}

Здесь отображается вкладка сети браузера, так как вы можете видеть все остальные поля.

BESTS.

Ответы

Ответ 1

В случае запросов CORS браузеры могут использовать только следующие заголовки ответов по умолчанию:

Cache-Control
Content-Language
Content-Type
Истекает
Last-Modified
Pragma

Если вы хотите, чтобы ваше клиентское приложение имело возможность доступа к другим заголовкам, вам необходимо установить заголовок Access-Control-Expose-Headers на сервере:

Access-Control-Expose-Headers: Access-Token, Uid

Ответ 2

Это действительно помогло мне, спасибо Нику Уралцеву за ваш ответ.

Для тех, кто использует nodejs с CORS:

...
const cors = require('cors');

const corsOptions = {
  exposedHeaders: 'Authorization',
};

app.use(cors(corsOptions));
...

В случае, если вы отправляете ответ способом res.header('Authorization', 'Bearer ${token}').send();

Ответ 3

Я столкнулся с той же проблемой. Я сделал это в моем "WebSecurity.java", это о методе setExposedHeaders в конфигурации cors.

@Bean
CorsConfigurationSource corsConfigurationSource() {

    CorsConfiguration configuration = new CorsConfiguration();
    configuration.setAllowCredentials(true);
    configuration.setAllowedOrigins(Arrays.asList(FRONT_END_SERVER));
    configuration.setAllowedMethods(Arrays.asList("GET", "POST", "PUT", "DELETE"));
    configuration.setAllowedHeaders(Arrays.asList("X-Requested-With","Origin","Content-Type","Accept","Authorization"));

    // This allow us to expose the headers
    configuration.setExposedHeaders(Arrays.asList("Access-Control-Allow-Headers", "Authorization, x-xsrf-token, Access-Control-Allow-Headers, Origin, Accept, X-Requested-With, " +
            "Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers"));

    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    source.registerCorsConfiguration("/**", configuration);
    return source;
}

Надеюсь это работает.

Ответ 4

Пользователи php делают это

header('Access-Control-Expose-Headers: Authentication');

Ответ 5

Столкнулся с той же проблемой в ядре asp.net Надеюсь, это поможет

public static class CorsConfig
{
    public static void AddCorsConfig(this IServiceCollection services)
    {
        services.AddCors(options =>
        {
            options.AddPolicy("CorsPolicy",
                builder => builder
                .WithExposedHeaders("X-Pagination")
                );
        });
    }
}