如何将视频上传到 Firebase Storage for React 应用

Question

我正在做一个类似社交媒体应用程序的 React 项目，用户可以在其中上传图片或视频。我正在使用 Firebase 存储来存储图像和视频。

我可以使用 React react-firebase-file-uploader 包完成图片上传，但由于我是网络开发新手，我正在努力寻找为 React 上传视频的解决方案。

我在网上搜索过，但找不到合适的解决方案来完成这些任务。

我只需要上传 video/videos 并希望在将数据上传到 Firebase 存储之前预览 it/them。
我需要在上传前或使用云功能上传到 Firebase 存储后压缩视频以减小文件大小。

Answer 1

你应该看看这个教程here and this gist there

您可以在上传后使用 Cloud Functions 进行一些处理，但请注意内存和执行时间是有限的，您的脚本在大文件上可能会失败。

Answer 2

值得再次说明的是视频文件are compressed by default。如果有的话，您可以调整文件大小以降低分辨率，或对其进行处理以添加水印。

这里有一个 that discribes how to resize a video file. And here 是关于如何在 Cloud Functions 上使用 moviepy 的教程。

Answer 3

你可以试试这个

<input type = "file"
onChange = {
  (e) => {
    let videoObj = e.currentTarget.files[0];
    // console.log(videoObj)
    let {
      name,
      size,
      type
    } = videoObj;

    size = size / 1000000
    //for not uploading the file more than 10 MB
    if (size > 10) {
      alert("please upload file less than 10 MB");
      return;
    }

    //code for only uploading the video

    type = type.split("/")[0];

    if (type != "video") {
      alert("please upload video only");
      return;
    }
  }
}
/>

如何将视频上传到 Firebase Storage for React 应用

How to upload videos to Firebase Storage for React app

video-processing

firebase

reactjs

google-cloud-functions