Проблема с форматом загрузки видео в Safari на Mac и iPhone с помощью MediaRecorder ⇐ Javascript

[Anonymous]

В настоящее время я работаю над проектом, в котором
мы должны записать видео с передней камеры или веб-камеры пользователя,
а затем отправить записанное видео на сервер для проверки пользователя.
/>Вот как я записываю видео:

Код: Выделить всё

  const startRecording = () => {
setShouldShowPreRecordingTimer(false);
if (videoRef.current) {
const stream = videoRef.current.srcObject as MediaStream;
const recorder = new MediaRecorder(stream, {
mimeType: returnVideoMimeType(),
videoBitsPerSecond: 250000,
});
recorder.ondataavailable = handleDataAvailable;
recorder.start();
setMediaRecorder(recorder);
}
};
const startRecording = () => {
setShouldShowPreRecordingTimer(false);
if (videoRef.current) {
const stream = videoRef.current.srcObject as MediaStream;
const recorder = new MediaRecorder(stream, {
mimeType: returnVideoMimeType(),
videoBitsPerSecond: 250000,
});
recorder.ondataavailable = handleDataAvailable;
recorder.start();
setMediaRecorder(recorder);
setIsRecording(true);
setRecordingTimer(RECORDING_TIME);
}
};

const stopRecording = () => {
if (mediaRecorder) mediaRecorder.stop();
};

const handleDataAvailable = (event: BlobEvent) => {
if (event.data.size > 0) {
setRecordedChunks((prev) => [...prev, event.data]);
}
};

и чтобы гарантировать, что тип mime поддерживается браузером, я написал эту функцию:

Код: Выделить всё

export const returnVideoMimeType = () => {
const mimeTypes = [
'video/mp4;codecs=avc1.42E01E,mp4a.40.2',
'video/webm;codecs=vp9,opus',
'video/webm;codecs=vp8,opus',
'video/webm',
'',
];

if (MediaRecorder.isTypeSupported) {
return (
mimeTypes.find((mimeType) => MediaRecorder.isTypeSupported(mimeType)) ||
''
);
}

return 'video/mp4;codecs=avc1.42E01E,mp4a.40.2';
};

а вот форматы, которые поддерживаются конечной точкой серверной части:

Код: Выделить всё

png,jpeg,bmp,mpeg,webm,3gp,avi,ogg,mp4,mov,wmv,gif,doc,zip,rar,pdf,docx

Теперь, когда я пытаюсь проверить это в Chrome, Firefox или Edge, оно работает правильно и загружает видео.
Но всякий раз, когда я пытаюсь загрузить его на Mac или Iphone Я получаю сообщение об ошибке, что формат файла не поддерживается. Я проверил тип mime, возвращенный в Safari, и это

Код: Выделить всё

'video/mp4;codecs=avc1.42E01E,mp4a.40.2'

Я попробовал загрузить его в Chrome с тем же типом mime, и все сработало правильно.
В Safari запись работает правильно и без проблем, работает предварительный просмотр записанного видео. тоже хорошо, но по какой-то причине кажется, что окончательный тип mime меняется на что-то другое.
Я также использую эти ограничения видео при запуске камеры на случай, если у них возникнут какие-либо проблемы:

Код: Выделить всё

const videoConstraints = {
video: {
width: { max: 960 }, // Reduce resolution to 640px width
height: { max: 1280 },
frameRate: { max: 30 }, // Lower frame rate reduces file size
facingMode: 'user',
},
audio: true,
};

Есть идеи, почему загрузка в Safari работает неправильно?

Подробнее здесь: https://stackoverflow.com/questions/793 ... iarecorder