DEV Community

X-headers, what and why?

Jordan Finneran on May 27, 2021

Contents Intro X-Content-Type-Options X-XSS-Protection X-Frame-Options Summary Intro Continuing on from my prev...
Collapse
Β 
alexandriastech profile image
alex ➑️ web dev journey πŸ‘©πŸ½β€πŸ’»πŸ” β€’

This may be a silly question, but I am a beginner, beginner to web development and want to start good web security practices now. How exactly do I go about changing these policies for the header? Or can you point me in the right direction?

Collapse
Β 
jordanfinners profile image
Jordan Finneran β€’

Hey Alex, you can set the headers yourself, depending on how you are serving up your website depends how you do this.
If you are using express js you can use a library like npmjs.com/package/helmet to help set them.
If you are using nextjs you can do something like nextjs.org/docs/api-reference/next...
If you are serving up a file from blob storage (e.g. S3 in AWS or Blob Storage in Azure) you often set these headers by using a CDN infront of the files like so docs.microsoft.com/en-us/azure/cdn...

Collapse
Β 
alexandriastech profile image
alex ➑️ web dev journey πŸ‘©πŸ½β€πŸ’»πŸ” β€’

Thank you for helping! I haven't gotten that far yet in my journey since I only know HTML and CSS right now; I use Github for my web pages. I'll keep the resources bookmarked, thanks again!

Thread Thread
Β 
jordanfinners profile image
Jordan Finneran β€’

Yes its not possible to do it with Github Pages at the moment 😊

Collapse
Β 
eznix profile image
Bruno Bernard β€’

Hi there, actually those headers are added by the W3C its a standard for the web. Go see the github of W3C ;)

Collapse
Β 
alexandriastech profile image
alex ➑️ web dev journey πŸ‘©πŸ½β€πŸ’»πŸ” β€’

I couldn't find the 'header' related content on W3C's github (may have missed it ) unfortunately, but I took a short class on what a header is and looked at Mozilla's documentation for headers. Thank you!

Collapse
Β 
gypsydave5 profile image
David Wickes β€’

Nice article - as this is tagged up for beginners, maybe you could give a brief description of what you mean by "content sniffing"? Maybe with a link to a longer article?

Also, you might want to explain what the X is for in the header... and maybe even what a header is in the first place!

Collapse
Β 
jordanfinners profile image
Jordan Finneran β€’

Thanks David, that makes sense I will add some detail :)

Collapse
Β 
gypsydave5 profile image
David Wickes β€’

πŸ‘πŸ˜

Collapse
Β 
johnfrades profile image
John Frades β€’

if you're using Express, this can help npmjs.com/package/helmet

Collapse
Β 
moussa_fofana_855ce09212e profile image
Moussa Fofana β€’

hoelo