react-native-blob-util
react-native-blob-util copied to clipboard
Error: ReactNativeBlobUtil.fetchBlobForm failed to create request body
Cannot find a correct way to upload file chosen from picker
"react-native-blob-util": "^0.18.2"
"react-native": "0.71.10"
import ReactNativeBlobUtil from "react-native-blob-util";
import { DocumentPickerResponse } from "react-native-document-picker";
const result = await pick({
mode: "import",
copyTo: "cachesDirectory",
allowMultiSelection: false,
});
const a = ReactNativeBlobUtil.wrap(document.uri).replace("file://", "");
const b = ReactNativeBlobUtil.wrap(document.uri.replace("file://", ""));
const c = ReactNativeBlobUtil.wrap(document.uri.replace("file://", "")).replace("file://", "");
ReactNativeBlobUtil.fetch(
"POST",
`${API_URL}/${API_VERSION}/cad/Convert?outputFormat=${format}`,
{
Authorization: `Bearer ${await connect()}`,
},
[
{
name: "drawing",
filename: document.name,
type: "application/dwg",
data: a,
},
],
)
.then((res) => {
console.log(res.text());
})
.catch((err) => {
console.error(err);
});
debug output:
uri:
file:///Users/indapublic/Library/Developer/CoreSimulator/Devices/3F85443D-E32A-4C49-B9D2-07226D514FAB/data/Containers/Data/Application/B9B3D42F-4B75-4F28-A60B-5ABD9EB84EDF/tmp/com.myapp-Inbox/%D0%90%D0%A0_%D0%9F%D0%BB%D0%B0%D0%BD%20%D0%BD%D0%B0%20%D0%BE%D1%82%D0%BC-%200-000.dwg
a:
ReactNativeBlobUtil-file:///Users/indapublic/Library/Developer/CoreSimulator/Devices/3F85443D-E32A-4C49-B9D2-07226D514FAB/data/Containers/Data/Application/B9B3D42F-4B75-4F28-A60B-5ABD9EB84EDF/tmp/com.myapp-Inbox/%D0%90%D0%A0_%D0%9F%D0%BB%D0%B0%D0%BD%20%D0%BD%D0%B0%20%D0%BE%D1%82%D0%BC-%200-000.dwg
b:
ReactNativeBlobUtil-file:///Users/indapublic/Library/Developer/CoreSimulator/Devices/3F85443D-E32A-4C49-B9D2-07226D514FAB/data/Containers/Data/Application/B9B3D42F-4B75-4F28-A60B-5ABD9EB84EDF/tmp/com.myapp-Inbox/%D0%90%D0%A0_%D0%9F%D0%BB%D0%B0%D0%BD%20%D0%BD%D0%B0%20%D0%BE%D1%82%D0%BC-%200-000.dwg
c:
ReactNativeBlobUtil-/Users/indapublic/Library/Developer/CoreSimulator/Devices/3F85443D-E32A-4C49-B9D2-07226D514FAB/data/Containers/Data/Application/B9B3D42F-4B75-4F28-A60B-5ABD9EB84EDF/tmp/com.myapp-Inbox/%D0%90%D0%A0_%D0%9F%D0%BB%D0%B0%D0%BD%20%D0%BD%D0%B0%20%D0%BE%D1%82%D0%BC-%200-000.dwg
a and b will cause error [Error: ReactNativeBlobUtil.fetchBlobForm failed to create request body]
c will not throw this exception but seems like tries to pass empty file
i picked file by react-native-document-picker, then uploaded to server. My file like this: { "fileCopyUri": "file:///var/mobile/Containers/Data/Application/.../PNG%20image.png", "name": "PNG image.png", "size": 2124954, "type": "image/png", "uri": "file:///private/var/mobile/Containers/Data/Application/.../PNG%20image.png" } and i resolved:
await ReactNativeBlobUtil.fetch( 'POST', url, { 'Content-Type': 'multipart/form-data', }, [ { name: 'FileData', filename: file.name, data: ReactNativeBlobUtil.wrap( Platform.OS === 'ios' ? decodeURIComponent(file.uri.replace('file://', '')) : file.uri, ), }, ......... i hope it can help u.