Search code examples
javascriptx-frame-options

How can I set X-Frame-Options in javascript?


A while ago, I tried to embed a youtube video on my website. It gave me an error: that its X-frame-options was set to sameorigin and therefore could not load. After some research I learned that X-frame-options was an attribute which controlled whether a webpage could be embedded onto a different webpage. How can I set the X-frame-options header in my javascript code on my webpage? If this is not possible, please may you guide me to how I could control this on the server side?


Solution

  • With JavaScript? You can't.

    Setting X-Frame-Options inside the <meta> element is useless! For instance, <meta http-equiv="X-Frame-Options" content="deny"> has no effect. Do not use it! X-Frame-Options works only by setting through the HTTP header,

    It can only be done from the server.

    From the server, it's simple - just don't set such a header to begin with. For the header to be sent, you have to do so explicitly, so if you leave out code that sets the header, the header won't be sent. (Though, note that there are some services like Helmet that alter headers for you - it depends what you're using. Figure out what you have, if it's setting headers, and then use whatever the appropriate command is to not send such headers.)