无法使用 axios 将文件上传到 Api

Question

无法将图像上传到 Microsoft Azure 人脸检测，文档说我应该上传 [二进制数据]，内容类型为：“application/octet-stream” https://northeurope.dev.cognitive.microsoft.com/docs/services/563879b61984550e40cbbe8d/operations/563879b61984550f30395236 。我正在上传 image.data （这是二进制数据），但我收到错误 400，但是我尝试使用邮递员上传文件并且它有效，这意味着我的发布请求有问题，但我发现没有问题

axios.post("https://northeurope.api.cognitive.microsoft.com/face/v1.0/detect", image.data, {
                    headers: {
                        "Ocp-Apim-Subscription-Key": "*************",
                        "Content-Type": "application/octet-stream"
                    }
                }).then(res => {
                    console.log(res)
                }).catch((error) => {
                    console.log(error)
                    throw error
                })

Error: Request failed with status code 400
    at createError (createError.js:16)
    at settle (settle.js:17)
    at XMLHttpRequest.handleLoad (xhr.js:59)
    at XMLHttpRequest.dispatchEvent (event-target-shim.js:818)
    at XMLHttpRequest.setReadyState (XMLHttpRequest.js:566)
    at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:388)
    at XMLHttpRequest.js:501
    at RCTDeviceEventEmitter.emit (EventEmitter.js:189)
    at MessageQueue.__callFunction (MessageQueue.js:395)
    at MessageQueue.js:106

Answer 1

我找到了解决方案，我必须将其发布为 BLOB（二进制大对象），我无法使用 axios 执行此操作，因此我暂时使用 RNFetchBlob，直到我了解如何使用 axios 发布 BLOB

RNFetchBlob.fetch('POST', "https://northeurope.api.cognitive.microsoft.com/face/v1.0/detect", {
                "Ocp-Apim-Subscription-Key": "***********",
                "Content-Type": "application/octet-stream",
            }, RNFetchBlob.wrap(image.path))
                .then((res) => {
                    console.log(" the res --> ")
                    console.log(res)
                })
                .catch((err) => {
                    console.log(" the error --> ")
                    cconsole.log(err)
                })

Answer 2

我认为您应该将图像作为FormData 和Content-Type 作为multipart/form-data 传递如下：

const data = new FormData();
data.append("pictures", { uri: image.uri, name: imageName, type: 'image/*' });
await axios.post(url, data, { headers }).then((response) => {
    console.log(response)
}).catch((error) => {
    console.log(error);
});