Displaying HTTP Headers in Your Browser

So you are curious what HTTP headers you can get from a specific (maybe your own) website? Well, you can list them directly in your (modern) browser.

Fetch and Display Headers

In order to do so, you just have to open your console, and put in the following:

fetch( 'https://tfrommen.de' )
    .then( ( r ) => console.table( [ ...r.headers.entries() ] ) );

Easy, right? 🙂

Configuring Fetch

By default, this will perform a GET request, but you can also send, for example, a HEAD request by specifying the method, like so:

fetch( 'https://tfrommen.de', { method: 'HEAD' } )
    .then( ( r ) => console.table( [ ...r.headers.entries() ] ) );

Results

If you were to put the last code snippet in your console, you should get something like the following:

I am using Firefox. In case you are using some other browser, the actual output will look different.