I would like users to be able to upload a file (i.e. an image) and have it sent to a 3rd party API for processing.
I'm using the form-data module. Unfortunately, it's not as straight forward in Wix.
I have this function in the backend:
import {fetch} from 'wix-fetch';
import { mediaManager } from 'wix-media-backend';
const FormData = require("form-data");
export function APIRequest(file) {
let form = new FormData();
form.append("api_key", JSON.stringify({
'ApiKey' : 'users_api_key',
}));
form.append("file", file);
return fetch("3rd_party_api_endpoint", {
method: "POST",
body : form,
})
.then( (httpResponse) => {
if (httpResponse.ok) {
return httpResponse.json();
} else {
return Promise.reject("Fetch did not succeed");
}
})
}
It does not work when:
Using the Wix provided upload buttons
I'm using custom javascript in an HTML frame then sending the result to the front Wix developer portion which then communicates to the backend
Trying to send the file as is
It only seems to work when I convert the file to a string and insert the string in the form:
form.append("file", JSON.stringify({
'file_string' : file_string, // File has been converted to a string
}));
Questions
Is there a size limit on outgoing Wix requests?
Is there a cleaner way to do this?
I guess you are trying to get the file (HTML input element) object from Browser domain and pass to backend.
The backend (on server) has no access to file (local disk). You need to upload and pass a valid url or pass as base64 image string. Another way is create a HTTP post API to receive the file as a upload from HTML element.
https://www.wix.com/corvid/forum/community-discussion/upload-wix-media-backend-filecontent
Hi! Check out this article!
https://support.wix.com/en/article/corvid-accessing-third-party-services-with-the-fetch-api
~Haiden~