Services Plugins FAQs

☁️ AWS File Uploader - New Plugin from Zeroqode

Hello @zeroqode2 / @Ecaterina

Update:
The error has been resolved by making a change to the Bucket configuration in S3.

Change the Block public access (bucket settings) setting to Restricted for all public and then back to Restricted for all public.

When restricted to all public the ACL error message disappeared and gave an access denied message.

When I put it back with access to all public, everything worked fine.

1 Like

@zeroqode2

We now have a problem with the names of the files being uploaded to S3.

When uploaded with Uploader No Gui, the URL that the Uploader element returns matches the URL with which the object is stored in S3.

But when uploading with Uploader Gui the URL that the item returns is different from the URL that the object is stored with in S3.

This occurs when the file name contains blank spaces and the Uploader has to replace the blank spaces with the value %20.

Attached images of two cases.

Case #1 using Uploader No Gui.

Case #2 using Uploader Gui.







1 Like

Hello, @luis
Happy to hear that you have resolved your issue with the ACL settings.

@avillanueva I would like to propose you check this documentation: Controlling ownership of objects and disabling ACLs for your bucket - Amazon Simple Storage Service

Also, you can check the solution of the @luis as a workaround for your case.

@luis Please allow me to mention that currently, our plugin encodes the title of the files, which contain the special characters: - _ . ! ~ * ’ ( ) and spaces sometimes. Unfortunately, the encoding of such files is the only way for being defined by the AWS bucket.
In order to prevent the download from being canceled, all invalid characters are replaced by “%” .

The plugin returns the name of the file from the bucket.
Please check this documentation in case of necessity: encodeURIComponent() - JavaScript | MDN

This is the unique way to upload the file with special characters to the S3 bucket.

Currently, we are working on the improvement of the plugin, so users will be able to rename the files with special characters.
We will notify all about these changes immediately after the official release.

Please apologize for this inconvenience.
Best regards,

Hello, @luis
Thanks for your patience and for using our plugin :pray:

By this message, I would like to notify you that we had significantly improved the plugin and now, after uploading files with the special characters, the URL will not be encoded with “%” symbols.
Thus, you will see the same URLs in your application and S3 bucket.

Please upgrade the plugin to the latest version (1.87.0) and give it a try. :blush:

Hope it will be useful for you.
Best regards,

Is anyone else having user interface formatting issues? My uploader looks like this on some pages (but not others)
Screenshot 2022-04-01 at 18-13-22 Columbus Pics

I have been experimenting for an hour trying to figure out the conflict but cannot find one. The only thing I can do to get it to display correctly is to place another uploader outside of the group that it is in (then both will display correctly)

one more odd request. if my uploader is in a popup, the cropping popup pops under the existing popup. Is there any way to force it to the top?

Hello, @jeffmccutcheon
Thanks for reaching out.

Please note that this issue is related not to the plugin settings, but to the construction of your page and its design.
Also, please note that in case you are using the New Responsive engine for creating your application, some difficulties could appear.

In order to investigate both of your issues, can you please share a video with me, where you demonstrate them?
Also, please let me know if you are using a New Responsive engine for your app.

Looking to hearing from you soon.
Best regards,

thanks, I have another odd problem. Twice in the last month, I could not access any of my images on my aws s3. If I tried to open any of them I was not referred to the actual aws URL, but to something that looked like this

data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7

Both times the situation resolved itself within 5 minutes. Any idea what this could be?

I have tens of thousands of images uploaded via the zeroqode aws uploader.

Hello, @jeffmccutcheon
Thanks for your question.

Let me note that this behavior is not related to the plugin, but to the AWS platform itself.
It could be related to the type of file you uploading.

This process also means that issue occurs on the platform side.
Our plugin is responsible for the loading process of the file to the AWS platform. Thus, in the case of unavailability to access the file on the platform, it could be just temporary glitches on the platform.

In case this problem will appear once again, please record a video reproducing all your steps.

I am looking to hearing from you soon.
Best regards,

Hello @Ecaterina @zeroqode2

I am having a conflict between the CSS of the AWS Uploader Plugin (version 1.105.0) and the CSS of the Radion Buttons element of Bubble.io.

The AWS Uploader Plugin is modifying the CSS (CSS file AWS.css) a few margins with the same tag that uses the Radio Buttons (see attached image) and the alignment of the Radio Buttons is lost.

For the moment I have made an adjustment in the CSS of the page to solve the problem while they review this issue.

With this I am temporarily correcting:

.radio label::before { margin-top: 0px !important; } .radio label::after { margin-top: 0px !important; left: 4px !important; }

Hello, @luis
Thanks for reaching out.

In order to replicate this case and analyse, how exactly these 2 elements could influence on each other, can you please describe us how exactly you linked Radio Buttons and File Uploader?
As I understand, buttons are clicked once you uploaded a file? Or its source is Users and information about they?

I am looking to hearing from you soon.
Best regards,

I have replicated the problem on a test page.

The problem occurs when I include a reusable element (popup) containing the FileUploader Element in a page that uses the Radio Button.

You can see that on the test page with the Radio Button but without including the popup element, the Radio Button is displayed inline.

And then including the reusable element includes the AWS.css that modifies the Radio Button as well.

Hello, @luis
Thanks a lot for the details.

Indeed, there is an issue with the styles between these 2 elements. It was defined that its root cause is modifications in CSS of the Bubble basic elements (like Radio Button).
We will fix it at the nearest time and I will revert to you with an update once our plugin will be deployed.

Most probably it will be on the next week since our developer Team is not working during the weekends. Thanks for your understanding.

Best regards,

Hello, @luis
Thanks for your patience.

By this message, I would like to notify you that we have fixed the plugin and its styles, so not, your radio buttons will be aligned correctly. Also, in the latest plugin version, there are some additional fixes to its functionality.
Please upgrade the plugin to the latest version (1.107.0) and give it a try.

Hope it will be helpful for you.
Best regards,

Hello @zeroqode2,

I use the FileUploader element with Gui.
When the title of the uploaded file contains the character _
for example “my_file_name.png”

image

the _ character is not kept when saving in the S3 bucket as in the screenshot.

image

But when I add a prefix, the separator character _ is added between the prefix and the file title.

In fact, it only affects the title filename. I want to keep the original name.
The plugin works perfectly, i am able to upload, view, delete from my webapp.

Is this normal or is it a bad configuration of the plugin on my part ?

Best regards,

Hello, @dhnotes
Thanks for your question.

I need to note that the symbols like space, - _ . ! ~ * ’ ( ) cannot be recognized and encoded by the AWS platform. Thus, in order to avoid canceling uploading from the AWS side, we created functionality for the replacement of these symbols through the plugin.

Yes, this is a method of adding the prefix to the file and separating it from the title.
So, here are no errors in your settings, but just the ways our plugin is working.

Best regards,

Hello @Ecaterina,

I performed the following tests:

From the AWS S3 console, I uploaded a file with the _ character. The result is as expected. The character is present in the object key name.

image

From an API gateway to the S3 bucket, with a object key name including the _ characters.

image
The result is as expected.

Sorry if I misspoke, my question was not about adding a prefix but I wanted to point out that a _ character was present, so why not in the object key name ?

I note that the _ character is not replaced, it is just erased, which does not seem to me a good solution.

Then when I use the “S3Ojects”, the files appear well with the character _ present on the title of the file in the S3 bucket.

image

I note in the AWS S3 documentation the possibility of using special characters including the character _ in the object key names.

here is the link Creating object key names - Amazon Simple Storage Service
Object key naming guidelines indicate that the special character _ is safe for use in key name.

Can you see why this would not be the case using the plugin? :pray:

Best regards,

@dhnotes
Thanks for these details.

Earlier, we and our users faced a lot of issues with uploading files from the Bubble Applications to the AWS Bucket, if the file’s title were special characters.
After some manipulations, it was decided to remove all special symbols automatically while the file is uploaded.

It is the way our plugin is working.
We were guided by the same link you provided above, and since Underscore is also related to the Special characters by AWS ( even if it is generally safe), our plugin removes it :pray:

I would like to highlight that this plugin mechanism was created after numerous troubles, were faced by our users :pray:

Indeed, here you can see the original file title, so special characters will be removed only while you upload files to your bucket.

I’m sorry for this inconvenience for you, however exactly in this way we can guarantee that our plugin will perform properly and all your files will be uploaded to the final destination.

Thanks for your understanding.
Best regards,

hello @Ecaterina,

I understand your position.

On the one hand you choose to remove the characters when you upload the files, but on the other hand when we use S3Objects to list the files, you leave the file name with the special characters. This complicates my workflow.

I need to be able to rewrite the original file name, can you tell me where I can find the original file name with the special characters to save it in Bubble?

I can’t find this in the Fileuploader, I only see the name of the file already purged, can you tell me how to find this.
Thank you.

Best regards,

@dhnotes

Please allow us to discuss a few ideas of improving this moment on our side. Even in case we can’t influence on removing special characters from the file title, we will try to create an additional tool for saving the initial title.

I will do my best to revert with an update at the nearest time. Before this, I need to recommend you to work with the files in the way you receive them.

Best regards,