What is the method to retrieve Response Headers in cases of an empty response?

Currently, I am working with Angular2 and dotcms. My goal is to retrieve response headers after making a call to subscribe.

const httpOptions = {
  headers: new HttpHeaders({ 'Content-Type': 'application/json' })
  .append('Access-Control-Expose-Headers', 'X-Custom-header')
};
let json = {..};
let apiURL = 'api/content/publish.1'
this.http.put(apiURL, JSON.stringify(json), httpOptions).subscribe((res:Response) => console.log(res.headers.keys()));

Although the response body appears empty, when checking in Chrome, all response headers are visible

HTTP/1.1 200 OK
X-Powered-By: Express
access-control-allow-origin: *
server: Apache-Coyote/1.1
location: http://localhost:3000/api/content/inode/bb23a6ac-f6f0-4ed3-8971-095dbc38ef52
inode: bb23a6ac-f6f0-4ed3-8971-095dbc38ef52
identifier: c05e9b20-46a4-4efc-9ded-b5d1a2613cad
access-control-allow-methods: GET, HEAD, POST, PUT, DELETE, OPTIONS
access-control-allow-headers: Authorization, Accept, Content-Type, 

Cookies
    content-length: 0
    date: Thu, 15 Feb 2018 12:34:27 GMT 
connection: close

Even though I received a status code of 200 and execution was successful, I am unable to retrieve the response headers

ERROR TypeError: Cannot read property 'headers' of null

Answer №1

To receive the complete response, include the observe property in the options object along with headers.

this.http.put(apiURL, JSON.stringify(json), 
 {observe:'response'}).subscribe((res:Response) => 
  console.log(res));

By doing this, you will obtain the entire response including headers.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Implementing a database-driven user value in an Angular Material dropdown

My code successfully populates input fields in a reactive form, but I'm facing an issue with the dropdown field not getting populated. user.component.ts: onSelect(user: User): void { this.draw.toggle(); this.userForm.reset({ displayNam ...

Using the VSCode debugger to place a breakpoint within a Typescript package that has been symlinked using `npm link`

I'm currently troubleshooting a NodeJS application and its associated typescript packages, which have been linked using `npm link`. The directory structure is as follows: /root/package-a # typescript package /root/package-b # another typescript packa ...

Update your AngularJS to the most recent version of Angular

We are faced with the task of upgrading a legacy MVC website that currently utilizes AngularJs to the latest version of Angular. Surprisingly, our current website only scratches the surface of what Angular has to offer - mainly using it for databinding and ...

What is the method for generating a data type from an array of strings using TypeScript?

Is there a more efficient way to create a TypeScript type based on an array of strings without duplicating values in an Enum declaration? I am using version 2.6.2 and have a long array of colors that I want to convert into a type. Here is what I envision: ...

Troubleshooting problem with sorting in Angular 4 material header

Using Angular 4 material for a table has presented me with two issues: 1. When sorting a table, it displays the description of the sorting order in the header. I would like to remove this. https://i.sstatic.net/5bHFO.png It displays "Sorted by ascending o ...

Is it possible to render several components for a single route in React?

My application has a layout featuring three columns: a navigation column, a toolbox, and a main content area. However, not all of these components are always present. I now want to display different components in each of these columns. Currently, I am har ...

What is the best way to set HTML content in the ElementRef's nativeElement?

I am trying to use a directive to set the content of an HTML element. export class AdvertisementDirective { constructor(el: ElementRef) { el.nativeElement.style.background = 'yellow'; el.nativeElement.content = '<p>Hello Wo ...

Error in Angular 12: Unable to access 'bootstrap' property from null

During the upgrade process of my Angular 10 application to Angular 12, I encountered an error that says: TypeError: Cannot read property 'bootstrap' of null Below are the files related to my Angular setup: tsconfig.json { "compileOnSave& ...

Angular 2 has its own version of $q.when called RxJs

Back in the AngularJS 1.* days, I used to have this code snippet to refresh the auth-token: ... if (!refreshTokenInProgress) { refreshTokenInProgress = AuthService.refreshToken(); } $q.when(refreshTokenInProgress, function () { refreshTokenInProgre ...

Issue with updating component

Currently facing an issue with a component that utilizes the changeDetection: ChangeDetectionStrategy.OnPush The component's logic is as follows: ngOnInit(){ this.serivce.something .subscribe( evt => { // Logic to update values of the ar ...

Exploring the Angular Heroes Journey: What's the significance of one being labeled with a colon while the other is identified

Setting: Angular 5+ Source: https://angular.io/tutorial Within the heroes.component.ts class, we see an assignment using a colon: export class HeroesComponent implements OnInit { heroes: Hero[]; However, in the app.component.ts class, a different as ...

Is there a way to transmit the wellness update of my Angular application to Akamai?

I currently have an Angular application and am utilizing the Akamai CDN. Can you advise me on the most effective method to relay the health status (200, 500, etc.) to Akamai? I want to ensure that in case it doesn't return a 200 code, Akamai is able t ...

Vitek - Uncaught ReferenceError: Document Is Not Defined

Why am I encountering an error when trying to use File in my vitest code, even though I can typically use it anywhere else? How can I fix this issue? This is the content of my vite.config.ts. /// <reference types="vitest" /> import { defin ...

Having trouble accessing the 'add' property of Rxjs Subscription

I have been working on optimizing my code and I encountered an issue with unsubscribing from multiple subscriptions in ngOnDestroy. Specifically, when trying to invoke the add() method to include additional child subscriptions, I keep getting an error me ...

This property cannot be found on the specified type

So, I have this TypeScript function that will return one of two different objects based on the input value: function myfunc(isError:boolean): {response:string}|{error:string} { if(isError) return {error:''} return {response:''} } N ...

Encountering an issue while constructing a JSON path in SQL using values from a column

When running the query below, I encountered an error: The second argument of "JSON_VALUE or JSON_QUERY" must be a string literal. SELECT JSON_QUERY(sr.Options, CONCAT('$[', sr.OptionId,']') FROM Survey as sr The 'Options' ...

Why am I encountering an issue while trying to access req.user.id?

Having set up passport authentication on my express, node project, I encountered an error when trying to access req.user. The error message displayed is Property 'id' does not exist on type 'User'.ts(2339). Below is the relevant code sn ...

How can I implement a recursive nested template call in Angular 2?

Hopefully the title isn't too misleading, but here's my dilemma: I am in the process of building an Angular 2 app and utilizing nested templates in multiple instances. The problem I am facing involves "widgets" within my app that can contain oth ...

Changing the selection on multiple input fields in Angular

I am working with two select elements in my form. Based on the selected value from the first select, I am filtering data for the second select. Additionally, I have an option to add the same row of form if desired. My issue is that when I select a value fr ...

Experimenting with NGXS selectors: A comprehensive guide

Hey there, I am currently utilizing the NGXS state management library in my application. I have a selector set up like this and everything seems to be functioning correctly. However, while testing the app, I encountered the following error message: "PrintI ...