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

Question

我使用hls.js来实现我的视频播放器，我有一些ts文件在https:///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

请求日志

url以"blob:"是由URL创建的。createObjectURL在前端，但现在我想hls发送请求到video.php，然后video.php读取ts文件，并从服务器端响应内容。

有什么方法可以做到这一点?(修改源代码，更改设置，…等)

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重新编译。现在发送get请求和查询参数"video.php f = & lt;视频name> .mp4",所以我可以和我的video.php处理请求。