Attempting to get string value from Response Header in Angular HTTP and map to local storage

Question

I'm attempting to get a Bearer token that is coming from a .NET Core API that is sent in the 'Authorization' header of a response. The response itself is a 200 OK response that works in Postman and returns 'Some Value' as the response. I've removed the URLs of the API for security reasons, but that's how the response and headers look in Postman

To attempt to get this value in Angular (latest stable version which I believe is 9) I'm using a service to intercept the pipe and map the response to a local session variable.

Service in angular:

createVisitor() {
  // Create the visitor to send to API
  // TODO: Capture the params of the URL and not the full URL
  this.visitor = {
    BrandCode: 'honey',
    QueryString: 'example=qstring'
  };

  // Set Token as Session & Return a Success/Fail
  return this.http.post(this.api + this.controller + 'createvisitor', this.visitor).pipe(
    map((response: any) => {
      console.log(response.headers.get('Authorization'));
      const visitor = response.headers.get('Authorization');
      if (visitor) {
        localStorage.setItem('visitor', visitor.Value);
        this.decodedToken = this.jwtHelper.decodeToken(visitor.Value);
      } else {
        console.log('No Visitor');
      }
    })
  );
}

I then subscribe to that response in an Route Guard:

this.visitorService.createVisitor().subscribe(
  (next) => {},
  (error) => {
    console.log("Create Token Error");
  }
);

The local storage item is not created and the console shows no error other than the one I created myself (Create Token Error). The request / response all look ok in Google Chrome's network tab too - so no errors there.

Can anyone see anything I'm doing wrong or missing there that would cause the error?