Hi,
I’m trying to upload file to Wix media using the signed URL which can be retrieved using getFileUrl().
After getFileUrl() is invoked on the wix backend, I get the signed Url without a token.
I’ve tried using fetch() and XMLHttpRequest() to upload the file with the Url I got from a wix page by I but I get 500 response error. I’ve tried both to send the file as ArrayBuffer or as DataURI (base64) but it does not work.
Did anyone knows how to do this properly ?
Below the two functions I’ve tried:
export function uploadFile(fileURL, content) {
const body = {
upload_token: fileURL.uploadToken,
file: {
value: content,
options: {
filename: “test.jpg” ,
contentType: “image/jpeg”
}
}
};
// …
fetch(fileURL.uploadUrl, {
“method” : “post” ,
“headers” : {
// both content types does not work
“Content-Type” : “application/x-www-form-urlencoded”
//“content-type”: “multipart/form-data”
},
“mode” : “no-cors” ,
“credentials”:“same-origin” ,
“body” : JSON.stringify(body)
})
.then((httpResponse) => {
if (httpResponse.ok) {
return httpResponse.json();
} else {
return Promise.reject( "Fetch did not succeed - response " +JSON.stringify(httpResponse));
}
})
.then((json) => console.log(json.someKey))
. catch (err => console.log(err));
}
export function uploadFileXHR(fileURL, content) {
const xhr = new XMLHttpRequest();
xhr.open( “POST” , fileURL.uploadUrl, true );
xhr.onload = () => {
const status = xhr.status;
if (status === 200 ) {
console.log( “File is uploaded” );
} else {
console.log( "Something went wrong!, status " + status);
}
};
xhr.onerror = () => {
console.log( "Something went wrong" );
};
xhr.setRequestHeader( 'Content-Type' , "image/jpeg" );
xhr.send(content);
}