Я пытаюсь написать приложение, которое отправляет изображения с телефона в корзину Amazon S3.В настоящее время я тестирую приложение с файлами png.Кажется, все работает, примите, что изображения не отформатированы должным образом для веб-передачи.Я пробовал несколько разных вещей, но у меня нет идей.
Я загружаю свое изображение так:
onChange = () => {
let newfile = this.refs.file.files[0];
let reader = new FileReader();
let url = reader.readAsDataURL(newfile);
reader.onloadend = () => {
this.setState({
...this.state,
openModal: true,
imgSrc : [reader.result],
imageType: newfile.type,
})
}
}
Я знаю, что загрузка этого изображения работает, потому что я могу отобразитьмоя картинка с
<img src={this.state.imgSrc} />
ведением журнала консоли imgSrc выдает мне строку, которая продолжается до 26 000 символов "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASQAAAEjCAYAAACb/HxUAAAA..."
Я отправляю запрос put в мое ведро Amazon S3, но не могу получить изображениепоявиться!
var headers= {
'Content-Type': this.state.imageType,
};
return axios.put(signedUrl, this.state.imgSrc, {headers:headers})
Когда я консоль журнала ответ от Amazon, он выглядит следующим образом.
{data: "", status: 200, statusText: "OK", headers: {…}, config: {…}, …}
config:
adapter: ƒ xhrAdapter(config)
data: "["data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAS"
headers: {Accept: "application/json, text/plain, */*", Content-Type: "image/png"}
maxContentLength: -1
method: "put"
timeout: 0
transformRequest: {0: ƒ}
transformResponse: {0: ƒ}
url: "https://bucket.s3.us-east-2.amazonaws.com/1_1553270707390?Content-Type=image%2Fpng&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-
validateStatus: ƒ validateStatus(status)
xsrfCookieName: "XSRF-TOKEN"
xsrfHeaderName: "X-XSRF-TOKEN"
__proto__: Object
data: ""
headers: {}
request: XMLHttpRequest {onreadystatechange: ƒ, readyState: 4, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, …}
status: 200
statusText: "OK"
__proto__: Object