0

我正在尝试以可以在移动 safari 上播放的格式在节点的后端将 .webm 转换为 .mp4。

这样做的原因是我们使用 getUserMedia() 和 getDisplayMedia 来记录用户的相机/屏幕,而 webm 不能在移动 ios safari 上播放。

在这个答案的第二部分之后 - https://stackoverflow.com/a/63463669

在前端 -

        mediaStreamConstraints: {
          video: { width: 1280, height: 720, frameRate: { min: 24, ideal: 30, max: 60 } },
          audio: true,
          ...mediaStreamConstraints,
        },
        mediaRecorderOptions: {
          videoBitsPerSecond: 4000000,
          mimeType: 'video/webm;codecs=h264',
        },
      });

在后端

async uploadVideo(id: string, readableStream: stream.Readable, options: UploadBlobOptions) {
    if (disableVideoEncoding) {
      return this.uploadBlob(id, readableStream, options);
    }

    const buffer = await readableStreamToBuffer(readableStream);
    const inputData = new Uint8Array(buffer);
    const result = ffmpeg({
      MEMFS: [{ name: 'input', data: inputData }],
      print: () => {},
      printErr: () => {},
      arguments: [
        ...['-i', 'input'],
        // Encode audio with AAC https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Audio_codecs#choosing_an_audio_codec
        ...['-c:a', 'aac'],
        // Copy video
        ...['-c:v', 'copy'],
        // Output
        'output.mp4',
      ],
    });
    const out = result.MEMFS[0];
    const outStream = new Duplex();
    if (out) {
      outStream.push(out.data);
      outStream.push(null);
    } else {
      throw new Error('Could not find output file');
    }

    return this.uploadBlob(id, outStream, {
      ...options,
      mimeType: 'video/mp4',
    });
  }

输出视频以 chrome 格式运行,格式为 .mp4,但仍无法在 safari 中播放。如果有人能解决我不胜感激!!

这是使用上述代码生成的视频:

https://tendon-user-files-public.s3.eu-west-1.amazonaws.com/tendon-production/bc8cd560-4898-402b-8aa3-041937adf725.mp4

这是我不久前上传的另一个视频,它在 safari 中工作: https ://tendon-user-files-public.s3.eu-west-1.amazonaws.com/tendon-production/bafybeihjwawyuvirf4ymwununm25skxvzedlsd33ztav3rbofekv7z6yzu.mp4

谢谢! 在此处输入图像描述

4

0 回答 0