Я использую Dropbox API v2, в частности конечную точку загрузки. Я использую React-Native с expo, чтобы выбрать изображение для загрузки в правильную папку. Я могу получить uri выбранной фотографии, но при загрузке файл поврежден и не может быть просмотрен. Когда изображение выбрано, я вижу на своем устройстве путь file: /// для местоположения изображения на моем устройстве (я полагаю).
Я готовлю что-то только о двоичных загрузках, но не нашел ничего, что действительно объясняло бы это или как я бы это сделал для загрузки.
Я вижу uri и могу просматривать изображение на устройстве, но не могу правильно загрузить его, см. Изображение ниже.
import React, { useState, useEffect, useContext } from "react";
import { View, Text, StyleSheet, TouchableOpacity } from "react-native";
import * as ImagePicker from "expo-image-picker";
import { UserContext } from "../context/UserContext";
export default function PostScreen() {
const [user] = useContext(UserContext);
const [imageSelected, setImageSelected] = useState("");
const [imageFilename, setImageFilename] = useState("");
const [image, setImage] = useState(null);
const [fileType, setFileType] = useState("");
useEffect(() => {
(async () => {
if (Platform.OS !== "web") {
const {
status,
} = await ImagePicker.requestMediaLibraryPermissionsAsync();
if (status !== "granted") {
alert("Sorry, we need camera roll permissions to make this work!");
}
}
})();
}, []);
useEffect(() => {
if (!image) {
return;
}
let i = 1;
function http_header_safe_json(v) {
return JSON.stringify(v);
}
var myHeaders = new Headers();
myHeaders.append(
"Authorization",
"Bearer TOKEN"
);
myHeaders.append(
"Dropbox-API-Arg",
http_header_safe_json({
path: `/${user.username}/UserUploaded_1234.${fileType}`,
mode: {
".tag": "add",
},
autorename: true,
})
);
myHeaders.append("Content-Type", "application/octet-stream");
var file = image;
var requestOptions = {
method: "POST",
headers: myHeaders,
body: file,
redirect: "follow",
};
fetch("https://content.dropboxapi.com/2/files/upload", requestOptions)
.then((response) => response.json())
.then((result) => {
console.info(result);
i + 1;
})
.catch((error) => console.info("error", error));
}, [image]);
const chooseFromLibrary = async () => {
let result = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.All,
allowsEditing: true,
aspect: [4, 3],
quality: 1,
});
console.info(result);
if (!result.cancelled) {
setImage(result.uri);
let cut = result.uri.split(".");
setFileType(cut.pop());
}
}
return (
<View style = {styles.wrapper}>
<TouchableOpacity
activeOpacity = {0.8}
style = {styles.button}
onPress = {chooseFromLibrary}
>
<Text style = {styles.buttonText}>Choose From Library</Text>
</TouchableOpacity>
<TouchableOpacity
activeOpacity = {0.8}
style = {styles.button}
onPress = {takePhotoFromCamera}
>
<Text style = {styles.buttonText}>Take Photo From Library</Text>
</TouchableOpacity>
{image ? <Text>{image}</Text> : <Text>None Selected</Text>}
</View>
);
}





[Перекрестная ссылка для справки: dropboxforum.com/t5/Dropbox-API-Support-Feedback/…]