How can I set request header on React web?

Question

I've noticed my React web doesn't render img tags properly on IE browser with DOM7009 error. I've found the solution is that set request header added 'X-Content-Type-Options: nosniff', but I really don't have any idea how I can set the header for img tag's request. Does any body have any idea for this?

How are you hosting the react application? This is typically something you would configure at the host level, e.g. nodejs express — Daniel May, Sep 03 '17 at 15:19

score 1 · Answer 1 · answered Sep 03 '17 at 11:17

I don't think you can do this within React, since it's not an attribute that you could change like you would with className and similar things. You'd have to fix it with more low level html and javascript.

I found another similar question where they outline two options:

Proxy the request, through a server you control, where you can change the request header.
Use XmlHTTPRequest to build a request yourself, using setRequestHeader to fit your needs.

These two options are described in more detail in these two (1, 2) answers, for a similar question. (If you find their answers useful, be sure to upvote them.)

How can I set request header on React web?

1 Answers1