I'm trying to import an image from the upload button to a specified folder. I couldn't get the media manager upload backend to work for me because I couldn't figure out how to get the image from the front-end upload button to the backend to be uploaded (buffer is apparently too above my head). So I was trying this method with importing from a URL, but apparently the type of URL I'm passing is wrong.
Front end:
export function button39_click(event) {
$w("#uploadButton1").startUpload()
.then( (uploadedFiles) => {
console.log("File url:" + uploadedFiles.url);
let url = uploadedFiles.url;
let name = $w("#uploadButton1").value[0].name;
let mime = get_url_extension(uploadedFiles.url)
console.log(url+" "+name+" "+mime)
importFile(url,name,mime);
})
}
function get_url_extension( url ) {
return url.split(/[#?]/)[0].split('.').pop().trim();
}
export function uploadButton1_change(event) {
console.log($w('#uploadButton1').value)
}
Backend:
import { mediaManager } from 'wix-media-backend';
export function importFile(url, name, mime) {
return mediaManager.importFile(
"/Cats",
url,
{
"mediaOptions": {
"mimeType": "image/" + mime,
"mediaType": "image"
},
"metadataOptions": {
"isPrivate": false,
"isVisitorUpload": false,
"fileName": name,
"context": {
"someKey1": "someValue1",
"someKey2": "someValue2"
}
}
}
);
}
Error:
"code": -2100,
"message": "incorrect external url",
"payload": {
"key": "wpm_error.missing_mandatory_parameter"
}
Any help would be GREATLY appreciated. I've been trying to solve this one problem for a month and it's the last piece of the puzzle I need for my project.
First of all, .startUpload got deprecated and you may want to switch to the newer method.
Second, it should be:
let url = "https://static.wixstatic.com/media/" + uploadedFiles.url.split('/')[3];//to convert it to external URL.
Third, keep in mind that this way you will have each image file twice: 1 the file that got uploaded via the upload button and a copy that you imported from the url.