Gli assi hanno accesso ai campi di intestazione della risposta

Sto costruendo un'app frontend con React e Redux e sto usando axios per eseguire le mie richieste. Vorrei avere accesso a tutti i campi nell'intestazione della risposta. Nel mio browser posso controllare l'intestazione e posso vedere che tutti i campi di cui ho bisogno sono presenti (come token, uid, ecc ...), ma quando chiamo

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

Ho appena

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

Qui la mia scheda di rete del browser, come puoi vedere tutti gli altri campi sono presenti.

Bests.

In caso di richieste CORS, i browser possono accedere alle seguenti intestazioni di risposta solo per impostazione predefinita:

• Cache-Control
• Content-Language
• Tipo di contenuto
• Scade
• Ultima modifica
• Pragma

Se desideri che la tua app client sia in grado di accedere ad altre intestazioni, devi impostare l'intestazione Access-Control-Expose-Headers sul server:

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

Questo mi ha davvero aiutato, grazie Nick Uraltsev per la tua risposta.

Per quelli di voi che usano nodejs con cors :

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

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

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

Nel caso in cui si stia inviando la risposta res.header('Authorization', `Bearer ${token}`).send();

Stavo affrontando lo stesso problema. Lo hai fatto nel mio "WebSecurity.java", riguarda il metodo setExposedHeaders nella configurazione 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;
}

Spero che funzioni.

Di fronte allo stesso problema nel nucleo di asp.net Spero che questo aiuti

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

Secondo i documenti ufficiali :

Ciò può essere utile se si desidera che le intestazioni HTTP con cui il server ha risposto . Tutti i nomi delle intestazioni sono in maiuscolo e sono accessibili utilizzando la notazione parentesi. Esempio: response.headers['content-type']darà qualcosa come: headers: {},

Per lo SpringBoot2 basta aggiungere

httpResponse.setHeader("Access-Control-Expose-Headers", "custom-header1, custom-header2");

al codice di implementazione del filtro CORS da inserire nella whitelist custom-header1e custom-header2così via

per l'aiuto di django

CORS_EXPOSE_HEADERS = [
        'your header'
    ]

Per Spring Boot 2 se non si desidera utilizzare la configurazione CORS globale, è possibile farlo in base al metodo o al livello di classe / controller utilizzando l' @CrossOriginannotazione con attributo exposedHeaders.

Ad esempio, per aggiungere un'intestazione authorizationper i YourControllermetodi:

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