В настоящее время воспроизведение видео, по-видимому, в основном работает на всем, кроме iOS / Safari, на iOS и Safari. Я получаю ошибки «неправильная длина последнего блока» при попытке запуска видео. Я полагаю, что это может быть связано с диапазоном, например, в iOS / Safari первый запрос диапазона обычно равен 0-1, где на Chrome его 0-.
Вот мой текущий код бэкэнда.
const fileSize = currentFile.metadata.size;
console.log("range exists", headers.range);
const range = headers.range
const parts = range.replace(/bytes=/, "").split("-")
let start = parseInt(parts[0], 10)
let end = parts[1]
? parseInt(parts[1], 10)
: fileSize-1
const chunksize = (end-start)+1
const IV = currentFile.metadata.IV.buffer
console.log("start", start);
console.log("end", end);
// if (end === 1) {
// end = +fileSize - 1;
// }
let head = {
'Content-Range': 'bytes ' + start + '-' + end + '/' + fileSize,
'Accept-Ranges': 'bytes',
'Content-Length': chunksize,
'Content-Type': 'video/mp4'}
const readStream = fs.createReadStream(currentFile.metadata.filePath!,
{start: start,
end: end});
const CIPHER_KEY = crypto.createHash('sha256').update(password).digest()
const decipher = crypto.createDecipheriv('aes256', CIPHER_KEY, IV);
res.writeHead(206, head);
const allStreamsToErrorCatch = [readStream, decipher];
await awaitStream(readStream.pipe(decipher), res, allStreamsToErrorCatch);
Как вы можете видеть, я даже пытался создать оператор if, который изменяет конец на общий размер файла, если обнаруживается 0-1, но даже это казалось довольно удачным. Стоит отметить, что, хотя он работает на Android / Chrome (на ma c и windows), он все равно время от времени будет выдавать ошибки размера блока, но он все равно продолжает нормально воспроизводить видео на стороне клиента ,
<video className="popup-window__video"
src={this.props.state.video}
ref={this.props.video}
type="video/mp4"
controls>
Your browser does not support the video tag.
</video>
Вот тег привязки видео, на случай, если по какой-то причине это поможет.