Add custom headers to IMG, VIDEO and AUDIO requests

Question

I am working on a project where we need to add some custom headers to the HTTP requests for image, video and audio content in the browser. I\'ve been looking around and not rea

Answer 1

As far s I'm aware the only way to do this is with XMLHttpRequest or fetch, BUT you can tried l retrieve binary data for videos and stream it using native stream APIs.

If the server allows partial requests, which allows you to get a certain amount of bytes only

You can append the different bytes to a mediasource https://developer.mozilla.org/en-US/docs/Web/API/MediaSource

I almost got it working

Although the problem is that mediasource can only deal with fragmented mp4s https://github.com/w3c/media-source/issues/216 https://stackoverflow.com/a/18745164/2016831

But with some more research it should be possible to manually/automatically fragment the sections of the mp4 video with JavaScript after they're feutched, possibly using ffmpeg.js