我有下面的代码,我可以选择一个文档(pdf文件)使用了mart-document-picker,现在我想上传到cloudinary。然而,我得到了一个错误[SyntaxError: JSON Parse error: Unexpected token: <]
。我的假设是我错误地将formData发送到了Cloudinary API,但我不确定我到底做错了什么。我确实去了Cloudinary设置,并确保我启用了pdf和zip文件上传。
下面是我的代码:
import * as React from "react";
import * as DocumentPicker from "expo-document-picker";
const cloudName = "example";
const apiKey = "example";
export default function MyUploadScreen({ navigation }) {
const [pickedFile, setPickedFile] = React.useState(null);
const [uploadedFile, setUploadedFile] = React.useState(null);
const pickFile = async () => {
try {
const filePickResponse = await DocumentPicker.getDocumentAsync({
type: "*/*",
});
if (filePickResponse.type === "success") {
setPickedFile({
name: filePickResponse.name,
type: filePickResponse.mimeType,
uri: filePickResponse.uri,
});
}
} catch (error) {
console.log(error);
}
};
const uploadFile = async () => {
//Add your cloud name
let apiUrl = "https://api.cloudinary.com/v1_1/${cloudName}/document/upload";
const formData = new FormData();
formData.append("document", pickedFile);
formData.append("file", pickedFile);
formData.append("api_key", apiKey);
formData.append("upload_preset", "example");
const options = {
method: "POST",
body: formData,
headers: {
Accept: "application/json",
"Content-Type": "multipart/form-data",
},
};
try {
const fileUploadResponse = await fetch(cloudinaryBaseUrl, {
body: formData,
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "multipart/form-data",
},
});
const jsonResponse = await fileUploadResponse.json();
console.log(jsonResponse); // This will be the success response with id, secure_url, public_id, asset_id etc..
setUploadedFile(jsonResponse);
} catch (error) {
console.log(error);
}
};
字符串
文档能够被正确地拾取。这里出了什么问题,导致上传文档时出错?
1条答案
按热度按时间mm5n2pyu1#
返回错误
[SyntaxError: JSON Parse error: Unexpected token: <]
,因为你得到的是响应HTML而不是JSON,因此出现了意外的标记:<
。第一个可能导致此问题的原因是您尝试将上传请求发送到的URL-即
https://api.cloudinary.com/v1_1/${cloudName}/document/upload
。您使用document
作为resource_type,而document
不是有效值。您可以使用image
或raw
来处理PDF文件,或者使用auto
让Cloudinary自动分配resource_type
-对于PDF来说它将是“image”。PDF被认为是“image”resource_types,因为你可以对它们应用转换。https://cloudinary.com/documentation/paged_and_layered_media#deliver_a_selected_pdf_page_as_an_image其次,
apiUrl
的值是一个字符串,但你试图在那里插入cloudName
变量。你需要用反引号替换双引号。通过这些更改,您的代码可能看起来像这样:
字符串
我看到你也没有使用
apiUrl
,但你发送的请求cloudinaryBaseUrl
-值得仔细检查,以确保这个URL是正确的,在上述格式-或者你可以取代apiUrl
cloudinaryBaseUrl
。除此之外,您还需要对FormData进行以下更改:
api_key
可以被删除,因为使用未签名上传时不需要它document
不是有效的上载API参数,因此应将其删除FormData可以是:
型