web-dev-qa-db-ja.com

React-Nativeの画像からバイナリデータを取得することは可能ですか？

react-native-cameraを使用していますが、react-nativeで画像をバイナリデータとして取得するのに問題があります。バックエンドに画像をアップロードできるようにするには、これが必要です。私がなんとか取得できるのは、イメージへのURIと、それをFormDataとしてサーバーに送信することだけですが、バックエンドのインフラストラクチャを変更する必要があるため、お勧めしません。

この問題に関する解決策やヒントを知っている人はいますか？

どんな考えや助けも大歓迎です。

react-nativereact-native-camerareact-native-image
6
nullforlife

react-native-cameraから画像をバイナリデータとして取得したい場合。 uriを読むにはreact-native-fsを使用することをお勧めします

例

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
);
9
hawkup