videojs / http-streaming

HLS, DASH, and future HTTP streaming protocols library for video.js
https://videojs-http-streaming.netlify.app/
Other
2.53k stars 425 forks source link

How to set vhs to use customize xhr function? #1438

Closed ghost closed 1 year ago

ghost commented 1 year ago

I has implemented a load-balanced xhr function that can load .ts video data from multiple cdn server, how to make vhs use my xhr function?

welcome[bot] commented 1 year ago

👋 Thanks for opening your first issue here! 👋

If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can. To help make it easier for us to investigate your issue, please follow the contributing guidelines.

ghost commented 1 year ago

@Generalize Not sure what you are about to accomplish exactly, but I handle this myself in the backend, by analyzing every 10 seconds the metrics of an all my CDN instances and then just tell VideoJS from which of the Instances the Stream should get pulled, this way Load balancing works pretty well but also requires a lot of code, as you somehow need to set up a metrics endpoint on all your servers that serve content to users and your Backend will fetch and analyze ...

But to get back to your question, in this example I basically overwrite the domain to pull data from, are you about this?:

videojs.Vhs.xhr.beforeRequest = (options: any) => {

      // Set the Authorization header
      options.headers = { Authorization: this.file_response.access_token };

      // Enable withCredentials
      options.withCredentials = true;

      if (options.uri && options.uri.includes('cdn.old.com')) {

        // Replace the placeholder with the actual domain
        options.uri = options.uri.replace('cdn.old.com', 'cdn.new.com');
      }

      return options;
    };

So it should be like this: videojs.Vhs.xhr.beforeRequest

adrums86 commented 1 year ago

You can replace the xhr function entirely if desired or use the onRequest or onResponse hooks detailed in the docs here: https://github.com/videojs/http-streaming#vhsxhr