时间戳

首页 > 解决方案 > 使用 React Native 将视频上传到 Parse 平台

react-native - 使用 React Native 将视频上传到 Parse 平台

问题描述

我有这段代码，它允许用户从库中选择一个视频，并将返回包含视频 uri、持续时间、类型、宽度的结果。

我想要做的是将此视频上传到Parse服务器，我尝试了很多解决方案，但每次我都遇到同样的错误

选择视频的代码

import * as ImagePicker from "expo-image-picker";

    let result = await ImagePicker.launchImageLibraryAsync({
        mediaTypes: ImagePicker.MediaTypeOptions.All,
        allowsEditing: true,
        aspect: [4, 3]
    });
    if (!result.cancelled) {
        this.setState({
            image: result.uri
        });
    }

选择视频后的结果：

Object {
  "cancelled": false,
  "duration": 4716.66650390625,
  "height": 720,
  "type": "video",
  "uri": "file:///var/mobile/Containers/Data/Application/C925E9FC-54F4-470D-97A6-F1D72D396151/Library/Caches/ExponentExperienceData/%2540yousefalsbaihi%252FFUNTime_Beta/ImagePicker/74FF55E0-4653-4856-BF39-A67ECB3B560C.mov",
  "width": 1280,
}

保存到 Parse

let base64 = this.state.image
imageFile = new Parse.File("Video.mp4", base64);
imageFile.save().then(
    function() {
        posts.set("postFile", imageFile, "video/mp4");
        posts.save().then(posts => {
            Alert("DONE")
        });
    },
    function(error) {}
);

我每次得到的错误：

[Unhandled promise rejection: TypeError: Cannot create a Parse.File with that data.]
- node_modules/parse/lib/react-native/ParseFile.js:170:28 in ParseFile
* src/screens/AddPost.js:689:39 in <unknown>
- node_modules/promise/setimmediate/core.js:37:14 in tryCallOne
- node_modules/promise/setimmediate/core.js:123:25 in <unknown>
- ... 8 more stack frames from framework internals

我尝试过的解决方案：

  1. 将视频转换为 Base64

我尝试将“base64”添加到数据中也没有工作我还尝试添加“video/mp4;base64”也得到了同样的错误，即使使用此代码将视频转换为base 64。

    _videoTo64 = async videoURL => {
        const options = { encoding: FileSystem.EncodingType.Base64 };
        const data = await FileSystem.readAsStringAsync(videoURL, options);
        let vids = "base64:"+ data;
        console.log(vids);
        this.setState({
          image: vids
        });
      };
  1. 试图从视频 uri 中修剪“file://”，这也导致了同样的错误

image.replace("file://", "")

即使我将解析保存文件更新为

imageFile = new Parse.File("Video.mp4", this.state.image);

我正在使用Expo平台，将图像转换为base64后，图像上传工作正常，但视频是问题所在。

标签： react-nativeparse-platformexporeact-native-ios

解决方案

您未在 中编码base64，因此当前用法不正确。

Parse将根据文件扩展名自动检测您正在上传的文件类型，但您可以使用Content-Type第三个参数指定：

用法

imageFile = new Parse.File("Video.mp4", this.state.image, "video/quicktime");

base64 示例

var base64 = "V29ya2luZyBhdCBQYXJzZSBpcyBncmVhdCE=";
var file = new Parse.File("myfile.txt", { base64: base64 });

推荐阅读