私は HLS.js を使用して HLS ストリームを処理していますが、Android で正常に動作するようになりました。問題は、Safari iOS には HLS サポートが組み込まれているため、Media Source Extensions (MSE) をサポートしていないことです。これは、S3 でそのファイル チャンクにアクセスできるように、カスタム ローダーを使用して各ファイル チャンクの URL に署名することができないことを意味します。各ユーザーには独自の Cognito アクセス権があり、S3 バケット内の自分のフォルダーにのみアクセスできます。これにより、ユーザーは他の人のビデオを見ることができなくなります。これが、プレイリスト ファイルが署名される可能性があるため、プレイリスト ファイルの一般的な署名が十分でない理由ですが、ストリームがファイル チャンクにアクセスしようとするとすぐに、署名されていないためブロックされます。
if (Hls.isSupported()) {
class loader extends Hls.DefaultConfig.loader {
constructor(config) {
super(config);
var load = this.load.bind(this);
this.load = async function(context, config, callbacks) {
let signedVideoPlaylistUrl = await new Promise((resolve, reject) => {
s3.getSignedUrl('getObject', {
Bucket: 'bucket-name',
// Pass the URL and get the S3 key
Key: context.url.split("s3.amazonaws.com/")[1],
Expires: 60 * 60 * 1 // 1 hour
}, function(error, result){
if(error){
console.error(error);
reject(error);
} else {
resolve(result);
}
})
});
context.url = signedVideoPlaylistUrl;
load(context, config, callbacks);
};
}
}
var hls = new Hls({
loader: loader
});
hls.attachMedia(video);
hls.on(Hls.Events.MEDIA_ATTACHED, function(event, data) {
console.log(event, data);
});
hls.on(Hls.Events.MANIFEST_PARSED, function() {
console.log(event, data);
//video.play();
});
hls.loadSource(`"https://bucket-name.s3.amazonaws.com/users/random-user-id/category/video_hls/recordingId.m3u8`);
}
// hls.js is not supported on platforms that do not have Media Source Extensions (MSE) enabled.
// When the browser has built-in HLS support (check using `canPlayType`), we can provide an HLS manifest (i.e. .m3u8 URL) directly to the video element through the `src` property.
// This is using the built-in support of the plain video element, without using hls.js.
// Note: it would be more normal to wait on the 'canplay' event below however on Safari (where you are most likely to find built-in HLS support) the video.src URL must be on the user-driven
// white-list before a 'canplay' event will be emitted; the last video event that can be reliably listened-for when the URL is not on the white-list is 'loadedmetadata'.
else if (video.canPlayType('application/vnd.apple.mpegurl')) {
//THIS IS WHERE I'M STUCK
throw new Meteor.Error("Not Supported");
video.src = signedVideoPlaylistUrl;
video.addEventListener('loadedmetadata', function() {
video.play();
});
}
}
iOS の Safari は HLS.js をサポートしていないため、上記のコードのように URL をインターセプトすることはできません。これが可能かどうか誰にもわかりますか？video タグを使用してネイティブ HTML でそれを行う方法を見つけることができませんでした。
ありがとう！