MARKETPLACE
PLUGINS
FILE URL TO BASE64
File URL to Base64 logo

File URL to Base64

Published May 2022
   •    Updated today

Plugin details

A plugin to get file content as a base64 encoded string from the file URL and perform actions on it.
This is handy while letting users upload files to send with emails and API calls or to embed in custom html.

This plugin will let you convert an image from a URL to base64 string as well as from a base64 string to a URL uploaded to your Bubble App - it will appear under Data->File Manager.

Free

For everyone

4.3 stars   •   7 ratings
3.4K installs
This plugin does not collect or track your personal data.

Other actions

Platform

Web

Contributor details

Blur Apps logo
Blur Apps
Joined 2021   •   19 Plugins
View contributor profile

Instructions

Insert an instance of the File to Base64 Element on your page in the Editor. Also use the 'Base64 Upload to Bubble' Action to upload a base64 file to your bubble app and get the uploaded file's S3 URL on the 'Uploaded File URL' state of the plugin element.
To Upload from Base64 to Bubble's File Manager,
1. Run the 'Base64 Upload to Bubble' Action
2. Here, pass the file name and the File as base64 (this should be the part after '...base64,' in your file's data URI. You can get it through this plugin via the File Base64 state)
3. If successful, this will set the plugin's 'Uploaded Base64 URL' state as this upload's resulting URL. use this in database actions or for visual elements thereafter


This Plugin also gives you 2 options to convert File URLs to base64:
1. From the plugin Element
2. From the action provided by the Plugin Element

OPTION1: To use directly from the plugin URL, provide the File URL in the element properties. For example on the Element properties via dynamic data:
File URL : FileUploader A's value's URL

This will generate the base64 data every time the FileUploader's value is changed.

OPTION2: To use from the action, call the 'File to Base64' action in the workflow as required. You can then provide the File URL value in the action's properties editor via dynamic data. It will update and set the element's states whenever the action is called.

Available states of this element:
1. Full Base64 String (the entire base64 string including content type metadata for use in <img> tags)
2. File Base64 (Just the base64 encoded image as a string)
3. File Content Type (Just the content type metadata. eg: image/png or application/pdf)
4. Uploaded File URL (this is the S3 url of the last file uploaded via the Upload Base64 File action).

Try it on the editor:
https://bubble.io/page?type=page&name=file_to_base64&id=blur-apps-playground&test_plugin=1653645972850x203266694854213630_current&tab=tabs-1

Types

This plugin can be found under the following types:
Element   •   Event   •   Action

Categories

This plugin can be found under the following categories:
Technical   •   Media   •   Email   •   Visual Elements

Resources

Support contact
Documentation
Tutorial

Rating and reviews

Average rating (4.3)

Good
February 24th, 2024
Good
USE RESULT AS DYNAMIC VALUE IN PARAMETER
September 20th, 2023
HI! due to the text being so long i cant store it nor use it as dynamic value straight from the custom state. what can i do???
Features the others lack...
June 18th, 2023
This is an exceptional plugin because (as the author confirmed to me via email) the encoding to Base64 happens completely on the client side. The conversion also works when the files are private (non public) files in the bubble system. If you have files that need to remain confidential but still converted to Base64, this is the plugin for you! Also, I was able to convert rather large files without any arbitrary size limits that I could see.
Works and flexible
April 26th, 2023
Does everything it says it does. Would be greatly improved with a passthrough parameter for identifying multiple iterations outputs.
Works so well
February 12th, 2023
I used this for encoding a file into Base64 in order to send it to an external API. This plugin hasn't failed yet. There is another plugin by Zeroqode that does the same thing but requires you to enter the file extension as an input (making it essentially useless). This FREE plugin requires nothing of that sort. Nicely built.
Bubble