如何让 HLS.js 从服务器端获取数据？

Question

我使用 hls.js 来实现我的视频播放器，我在 https:/// 中有一些 ts 文件和一个 m3u8 文件。

我用php读取m3u8文件并将内容发送到js（res [“manifest”] = m3u8的内容），然后将其放入hls.loadSource（），如下所示。

var manifest = res["manifest"];
var blob = new Blob([manifest]);
var hls = new Hls();
var url = URL.createObjectURL(blob);

hls.loadSource(url);
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED, function() {
    video.load();
});

在此之后，hls 开始通过以下方式获取 m3u8 中列出的文件

blob:https://<my domain>/<video name>.mp4

当然，它找不到文件，因为它们在

https://<my domain>/<video name>.mp4

代替

blob:https://<my domain>/<video name>.mp4

请求日志

The url starts with "blob:" is created by URL.createObjectURL in front-end,but now I want that hls sends requests to video.php,then video.php reads the ts files and responses the contents back from server side.

有什么方法可以做到这一点？ （修改源代码，更改设置，...等）

Answer 1

我不敢相信我做到了。

我在下面修改了 src/loader/fragment.ts 的源代码：

@@ -78,9 +78,7 @@ export class BaseSegment {
 
   get url(): string {
     if (!this._url && this.baseurl && this.relurl) {
-      this._url = buildAbsoluteURL(this.baseurl, this.relurl, {
-        alwaysNormalize: true,
-      });
+      this._url = 'video.php?f=' + this.relurl;
     }
     return this._url || '';
   }

然后用 webpack 重新编译。 现在它使用查询参数“f=<video name>.mp4”向video.php发送get请求，所以我可以用我的video.php处理请求。