如何使用React和aws-sdk将文件上传到S3 bucket与axios?

问题描述 投票:0回答:1

在看到这么多的帖子,关于上传文件到S3对我来说似乎不工作的任何方法。我已经结束了这个方法,似乎工作在几个帖子,我真的不知道我做错了什么。

presignedUrl 我是用 aws-sdk 在node服务器上,一切都很正常,但是当使用下面的方法上传实际文件时,它返回一个协议错误。

获取文件并请求签名

let file = target.files[0];
    // Split the filename to get the name and type
    let fileParts = target.files[0].name.split('.');
    let fileName = formatFilename(fileParts[0]);
    let fileType = fileParts[1];

    const { signedRequest } = await axios.post('/upload', { fileName, fileType })

创建一个 FormData

var bodyFormData = new FormData();
    bodyFormData.append('image', file)
    bodyFormData.append('name', fileName)

那我就上传文件

const uploadImageRequest = {
        method: 'PUT',
        url: signedRequest,
        body: bodyFormData,
        headers: {
            'Content-Type': 'multipart/form-data'
        }
    }

    axios(uploadImageRequest)
        .then(result => {
            console.log("Response from s3", result)
        })
        .catch(error => {
            console.log("ERROR ", error);
        })

最后,它返回以下错误

ERROR  TypeError: Cannot read property 'protocol' of undefined
    at isURLSameOrigin.js:57
    at xhr.js:109
    at new Promise (<anonymous>)
    at e.exports (xhr.js:12)
    at e.exports (dispatchRequest.js:50)
javascript reactjs amazon-s3 axios
1个回答
0
投票

确保你在axios中使用的url(signedRequest)不是未定义的。

© www.soinside.com 2019 - 2024. All rights reserved.