使用 putString 调用的 React-native Firebase 存储上传 [英] React-native Firebase storage upload using putString call

问题描述

我设置这个线程是为了澄清，firebase 存储 putString 方法 是否 或 不 在 React-native 中工作.

I'm setting up this thread in order to clarify, whether firebase storage putString method does or does not work in React-native.

根据我的搜索，目前无法使用 put 方法将文件或 Blob 类型上传到 Firebase 存储.

From what I've searched there is currently no way to upload File or Blob types to Firebase Storage using put method.

React Native 不支持 File 和 Blob 类型，因此 Firebase 存储上传无法在此环境中工作.但是文件下载确实有效.

React Native does not support the File and Blob types, so Firebase Storage uploads will not work in this environment. File downloads do work however.

来源:Firebase 博客

因此调用

firebase.storage().ref()
.child(userID)
.put(new File(['this is a small amount of data'], 'sample-text.txt', { type: "text/plain" }), { type: "text/plain" })
.then(p => {console.log(p)})
.catch(p => {console.log(p)})

不起作用并以响应结束

代码:存储/未知"消息:Firebase 存储:未知错误发生，请检查服务器响应的错误有效负载."名称:"FirebaseError" serverResponse : "Multipart body 不包含 2 或3 部分."

code : "storage/unknown" message : "Firebase Storage: An unknown error occurred, please check the error payload for server response." name : "FirebaseError" serverResponse : "Multipart body does not contain 2 or 3 parts."

不过，还有另一个选项可以使用 Firebase 存储 putString 方法将数据上传到 Firebase 存储.它适用于纯字符串.但是即使我用这种方法上传.我得到了和以前一样的服务器响应.

Nevertheless there is another option to upload data to Firebase Storage, using Firebase storage putString method. Which works with plain string. But even if I use this method to upload. I'm getting the same server reponse as before.

firebase.storage()
.ref()
.child(userID)
.putString('string')
.then(p => {console.log(p)})
.catch(p => {console.log(p)});

我从 这个答案.putString 方式应该 有效.

Bu from what I've learned from this answer. The putString way should work.

我做错了什么?该代码在 React 中对我来说很好用.每当我粘贴到 React-native 时.它停止工作.

What am I doing wrong? The code works fine for me in React. Whenever I paste to React-native. It stops working.

推荐答案

我刚试过 react-native-fetch-blob 正如 Ven 之前评论的那样，我能够让它工作，尝试使用 索引文件:

I've just tried react-native-fetch-blob as Ven commented before, and I was able to make it work, try using this snippet from the index file in the example:

1) 类声明前:

import RNFetchBlob from 'react-native-fetch-blob';
const Blob = RNFetchBlob.polyfill.Blob;
window.XMLHttpRequest = RNFetchBlob.polyfill.XMLHttpRequest;
window.Blob = Blob;

2) 存储方法内部:

let filePath = 'YOUR/FILE/PATH';
let fileName = 'file_name.jpg';
let rnfbURI = RNFetchBlob.wrap(filePath);
// create Blob from file path
Blob
.build(rnfbURI, { type : 'image/png;'})
.then((blob) => {
  // upload image using Firebase SDK
  firebase.storage()
    .ref('images')
    .child(fileName)
    .put(blob, { contentType : 'image/jpg' })
    .then((snapshot) => {
      console.log('Uploaded', snapshot.totalBytes, 'bytes.');
      console.log(snapshot.metadata);
      var url = snapshot.metadata.downloadURLs[0];
      console.log('File available at', url);
    }).catch(function(error) {
      console.error('Upload failed:', error);
    });

这篇关于使用 putString 调用的 React-native Firebase 存储上传的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！