I am trying to save binary media files obtained through GET calls into Bubble’s database (as a normal file). How can I do this in Bubble through the API connector so that I can save the normal file in my database ?
The coding solution to the exact problem that I am facing is explained in the min 5:20 of this video.
If you’d like a more detailed explanation, here it is:
I am trying to download an media files from Meta’s API:
. Chrome is updated, I have tried in incognito, I have tried in other browsers, none of them work.
If I do the call through postman it shows me the file correctly. Apparently, the problem is that the response that meta gives is binary, as it stated in its documentation:
How can I save this files as regular files in my database?
Not sure if you made any progress on this, but the documentation says you will receive the binary file in media_file, but I don’t see that in your response at all? I would change your “Data type” back to JSON and see if it sends a field for media_file at least because I don’t think you’re getting the proper response from the API
Yea that response doesn’t even look like it contains what you’re looking for. One thing I noticed is it says the response will have headers with the content-type so do “Capture response headers”
But if you say it’s working in Postman, try it again there and look at the raw log of exactly what it’s sending (Also see if postman is getting a JSON response). They might be adding additional headers automatically that you don’t have in Bubble. At least see if we can get a response with the file, then the binary thing is a separate issue.
I still think you’re not even getting the response you’re looking for. It’s like sending what your browser would normally receive when it’s not supported or something. Hopefully Nigel can help more
I’ve faced this issue before. If you know a little bit of NodeJS, you should make a server side action (a plugin) that converts and returns the binary data into a base64 encoded string. From there, you can upload it to S3 or do whatever you’d like.
I don’t code and have never created a server side plugin, but I am trying to build it with the help of ChatGPT. This is what I got:
function(properties, context) {
const request = require('request');
const OggEncoder = require('OggVorbisEncoder');
// Set the endpoint URL and the authorization header
const endpointUrl = properties.endpoint_url;
const authHeader = properties.authHeader;
// Send the GET request and retrieve the binary data
request(endpointUrl, {
headers: {
[authHeader]: ''
},
method: 'GET',
encoding: null
}, (error, response, body) => {
if (error) {
return callback(error);
}
// Convert the binary data to a wave object
const wavData = WaveFile.decode(body);
// Convert the wave object to an ogg file
const oggData = OggEncoder.encode(wavData.channelData[0], wavData.sampleRate);
// Set the output field for the binary data
const output = {
binary_data: oggData
};
// Return the output fields to the workflow
callback(null, output);
});
}
// Return the output fields to the workflow
callback(null, output);
});
}
Thanks for sharing! I guess this plugin might help after getting the appropriate response from Meta, right? Cause right know it asks me for a list of numbers but all I got is this:
I’m not sure if that response even has your file… Postman is showing you got a “File.ogg” with the content type audio/ogg. But in the headers of the response coming back to Bubble does it even have that same filename? It looks like it’s just giving you a generic error response that it think’s Bubble’s browser is unsupported.
I was thinking once you get the actual response, then you use the plugin to convert the Binary to Base64, then the Base64 saved to your database.
Yes, I’ve noticed that. Nevertheless, it was worked for me for some simpler cases, I just tweak some things in the code and that’s it. However, this is a more complex case that I don’t know how to tweak .
