在 Angular 中捕获 http 标头

Question

I would like to capture a token that I set in the http header inside my Angular application.

This is how I am serving my Angular application :

var express = require('express');
var app = express();
var port = process.env.PORT || 3000;
var router = express.Router();
var utils = require('./utils);

console.log('——————————- Run on port '+ port);

/****************************** Router ***************************/
router.get('*', function(req, res){
    token = utils.generateToken(); 
    res.set('X-Auth', token).sendFile('index.html', { root: __dirname + '/public/app' });
});

This token that I am setting in the header is what I would like to capture inside my Angular application. I am kind of lost on where and how to do that ? I am using Angular 9. Any hints where to start ?

Answer 1

the http clent return JSON data if you want to read all respond body you need to set observe option to response now the result will be of type HttpResponse you can now read all respond header ,type, status

http
  .get<any>('url', {observe: 'response'})
  .subscribe((res : HttpResponse) => {
    console.log(rep.headers.get('X-Token'));
    localStorage.setItem('token',res.headers.get('X-Token'))
  });

check this 👉 http reading the full response

Answer 2

You can get the headers from the Response Class like below:

http.get('/controller/action')
    .subscribe((response:Response) => {
       console.log(response.headers);
     });