Hello everyone. I ran into a problem when uploading files to s3.
I use Yandex Object Storage (works also like aws s3 and supports aws-sdk)
I use a presigned url to upload the file. And then I upload the file directly to bucket.
I use Capicatior with VUE. And when you start the dev server from a browser on a PC or in chrome, everything works fine. Files are being uploaded.
But when you open it in the android application, the file is created but loaded empty. I’ve tried everything I think. I used both the HttpCapacitor and Axios and fetch
The same result is everywhere.
Here is my coder code:
// Getting presigned url for upload
const uploadLinkRequest = {
url: 'https://functions.yandexcloud.net/******',
headers: { 'Content-Type': 'text/plain' },
data: { action:'getUploadLink',key:this.file.name, type:this.file.type, size:this.file.size},
};
let signedUrl = await CapacitorHttp.post(uploadLinkRequest);
signedUrl = signedUrl.data
let formData = new FormData();
formData.append("file", this.file);
let axiosTest = await this.axios.put(signedUrl, formData, {headers: {"Content-Type": "multipart/form-data"}});
console.log(axiosTest)
Here is Event Response from android app
{
"data": "",
"status": 200,
"statusText": "",
"headers": {
"connection": "keep-alive",
"content-type": "image/jpeg",
"date": "Tue, 30 May 2023 14:33:10 GMT",
"etag": "\"d41d8cd98f00b204e9800998ecf8427e\"",
"keep-alive": "timeout=60",
"server": "nginx",
"transfer-encoding": "chunked",
"vary": "Origin, Access-Control-Request-Headers, Access-Control-Request-Method",
"x-amz-request-id": "4524ddaac507b8df",
"x-android-received-millis": "1685457191681",
"x-android-response-source": "NETWORK 200",
"x-android-selected-protocol": "http/1.1",
"x-android-sent-millis": "1685457191593"
},
"config": {
"transitional": {
"silentJSONParsing": true,
"forcedJSONParsing": true,
"clarifyTimeoutError": false
},
"adapter": [
"xhr",
"http"
],
"transformRequest": [
null
],
"transformResponse": [
null
],
"timeout": 0,
"xsrfCookieName": "XSRF-TOKEN",
"xsrfHeaderName": "X-XSRF-TOKEN",
"maxContentLength": -1,
"maxBodyLength": -1,
"env": {},
"headers": {
"Accept": "application/json, text/plain, */*",
"Access-Control-Allow-Origin": "*"
},
"method": "put",
"url": "https://*******.storage.yandexcloud.net/%D0%A4%D0%BE%D1%82%D0%BE%202012-09-21%2012.35.55%20%D0%B4%D0%BE%20%D0%BF%D0%BE%D0%BB%D1%83%D0%B4%D0%BD%D1%8F.jpg?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=YCAJE77M81VmLecdUn1EHKKa3%2F20230530%2Fru-central1%2Fs3%2Faws4_request&X-Amz-Date=20230530T143310Z&X-Amz-Expires=3600&X-Amz-Signature=ee1c3e50bee3f1b7abe308a5527e7d3e49c7e846554c4ccc23c9b97c5d81ec21&X-Amz-SignedHeaders=host&x-amz-acl=public-read&x-id=PutObject",
"data": "[object FormData]"
},
"request": "[object XMLHttpRequest]"
}
AND THIS IS FROM SAME PHONE BUT IN CHROME BROWSER
{
"data": "",
"status": 200,
"statusText": "",
"headers": {
"content-type": "image/jpeg"
},
"config": {
"transitional": {
"silentJSONParsing": true,
"forcedJSONParsing": true,
"clarifyTimeoutError": false
},
"adapter": [
"xhr",
"http"
],
"transformRequest": [
null
],
"transformResponse": [
null
],
"timeout": 0,
"xsrfCookieName": "XSRF-TOKEN",
"xsrfHeaderName": "X-XSRF-TOKEN",
"maxContentLength": -1,
"maxBodyLength": -1,
"env": {},
"headers": {
"Accept": "application/json, text/plain, */*",
"Access-Control-Allow-Origin": "*"
},
"method": "put",
"url": "https://*********.storage.yandexcloud.net/Screenshot_2023-05-16-00-23-54-79_cc1c09618b367c44db4f10cd11235963.jpg?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=YCAJE77M81VmLecdUn1EHKKa3%2F20230530%2Fru-central1%2Fs3%2Faws4_request&X-Amz-Date=20230530T144335Z&X-Amz-Expires=3600&X-Amz-Signature=31bf9657ae55d82d32747f99d491b52d19afa6ce0e34f6f7d25bbad4512d7713&X-Amz-SignedHeaders=host&x-amz-acl=public-read&x-id=PutObject",
"data": "[object FormData]"
},
"request": "[object XMLHttpRequest]"
}
As I see, additional Headers have appeared in the Android app version
"connection": "keep-alive",
"content-type": "image/jpeg",
"date": "Tue, 30 May 2023 14:33:10 GMT",
"etag": "\"d41d8cd98f00b204e9800998ecf8427e\"",
"keep-alive": "timeout=60",
"server": "nginx",
"transfer-encoding": "chunked",
"vary": "Origin, Access-Control-Request-Headers, Access-Control-Request-Method",
"x-amz-request-id": "4524ddaac507b8df",
"x-android-received-millis": "1685457191681",
"x-android-response-source": "NETWORK 200",
"x-android-selected-protocol": "http/1.1",
"x-android-sent-millis": "1685457191593"
So what’s the problem and why are the files being uploaded empty?? Or they don’t load at all. But the file is being created, it’s just 0 kb
Please help.