Uploading images from backend using wix-media-backend

Ask the community
,
1

I’ve created a site API to upload images to the Media Manager. I used this documentation:
https://support.wix.com/en/article/wix-code-exposing-a-site-api-with-http-functions
https://www.wix.com/code/reference/draft/wix-media-backend.html
It is kind of strange to see ‘draft’ in the second URL. Brings me to my first question: is this API ready to be used and did someone has already managed to use the upload function?

Anyhow, in my http-functions.js I have

 
import {uploadImage} from 'backend/media';
...
 export function post_image(request) {

 let options = {
 "headers": {
 "Content-Type": "application/json"
    }
  };

 return request.body.text()
    .then((body) => {
 let record = JSON.parse(body);
 let image = CryptoJS.enc.Base64.parse(record.image);
 ...
 return uploadImage(image, record.filename, mime)
.then((fileInfo) =>
...
 .catch((error) => {
      options.body = {
        "error": error.message
       };
        return serverError(options);
  });

The image comes in as a base64 String. Is this the right way to convert it to a Buffer variable?

In media.js there is:

export function uploadImage(buffer, filename, mime) {
 
 return wixMedia.upload(
 "/Galleries/",
    buffer,
    filename,
    {
 "mediaOptions": {
 "mimeType": mime,
 "mediaType": "image"
      },
 "metadataOptions": {
 "isPrivate": false,
 "isVisitorUpload": false,
 "context": {
 "someKey1": "someValue1",
 "someKey2": "someValue2"
        }
      }
    }
  );
}

Result: upload() throws an error, resulting in returning a ServerError response
“error”:“Cannot read property ‘mediaType’ of undefined”
The folder ‘Galleries’ defined in the function, does get created… So I guess that either the upload isn’t working yet because of the draft notion, or that I just didn’t converted my image to the right Buffer type.

Does anyone can help me with this?

2

I think they just recently moved it out of draft. I tried to use it while it was in the draft only as well last month, and it didn’t work for me at the time.

3

The trick is to use Node.js’s Buffer class to create the buffer object from a Base64 string. Like here:

var buffer = new Buffer.from(unescape(body.base64Content), 'base64');
4

Well at least it works now
The https functions gets a POST request with a Dropbox shared URL, this URL is used for uploading it to the Media manager.

5

how you accomplished that? got same problem

6

I made an external API in integromat. From Wix I send a trigger and this external flow goes to a dropbox folder (transferred into that trigger). This flow goes and shares every file in that folder and this generates a unique link (you can set the lifespan of that link - i’ve set it to 2mins in order to let the upload happen correctly); this external API calls a webhook in Wix and transfers each Dropbox URL to the WixBackend and there I upload the given dropboxURL into the media manager.

export function uploadImageFromUrl(url,shootname, filename, mime) {
 return rp.get({ url, encoding: null })
    .then( (image) => {
 return mediaManager.upload(
 "/Galleries/" + shootname,
        image,
        filename,
        {
 "mediaOptions": {
 "mimeType": mime,
 "mediaType": "image"
          },
 "metadataOptions": {
 "isPrivate": false,
 "isVisitorUpload": false,
 "context": {
 "shoot": shootname,
 "filename": filename
            }
          }
        }
      );
    } );
 }

To be complete, I know there is a Dropbox integration to upload from the user interface but I need these pictures to be uploaded into a DataCollection the same time. Thats why I do it like this. After uploading Wix returns me Wix-URL and this goes into the database.

7

I want to upload images in media folder using third party API.

Third party API which is return image as json format.

Please help me ASAP because it’s very urgent and I am beginner in WIX server.