Question

我正在使用react-native而我无法在FormData中将图像作为二进制数据获取。我需要这个能够将图像上传到我们的后端。我唯一能得到的就是对图像进行uri，然后将其作为hero_login: function(event){ event.preventDefault(); axios.post('API call here', { service:'client', user: this.user_email, password: this.user_password, json:true }) .then(function(response){ const status = JSON.parse(response.data.response.status); console.log(status); }) }发送到服务器，但不建议这样做，因为这需要对我们的后端进行一些基础设施更改。

是否有人知道有关此问题的解决方案或一些提示？

非常感谢任何想法或帮助。

Answer 1

如果您想将图像作为来自 react-native-camera 的二进制数据。我建议使用 react-native-fs 来阅读uri

示例

const RNFS = require("react-native-fs"); // response.uri from react-native-camera RNFS.readFile(response.uri, "base64").then(data => { // binary data console.log(data); });

如果您想通过FormData上传图片，我建议 rn-fetch-blob

示例

import RNFetchBlob from 'rn-fetch-blob' // response.uri from react-native-camera const path = response.uri.replace("file://", ""); const formData = []; formData.push({ name: "photo", filename: `photo.jpg`, data: RNFetchBlob.wrap(path) }); let response = await RNFetchBlob.fetch( "POST", "https://localhost/upload", { Accept: "application/json", "Content-Type": "multipart/form-data" }, formData );

Answer 2

如果您已经在使用 react-native-camera ，则可以在捕获图像时直接将其作为 base64 来请求：

takePicture = async function(camera) {
  const options = { quality: 0.5, base64: true, doNotSave: true }
  const data = await camera.takePictureAsync(options)

  console.log(data.base64)
}

如果您的目标是仅拍摄照片，显示预览，然后上传到服务器并继续操作，则此方法的好处是不会将照片保存在设备缓存中（{{1} }。这意味着您无需担心在完成后清理它们。

是否有可能从React-Native中的图像中获取二进制数据？

2 个答案: