AWS uploader insecure objets

maxi · April 11, 2021, 12:34am

Hi, im buy the AWS uploader plugin for bubble and connect perfect follow the instructions with my S3 bucket.

In one part of the documentation say something about include a follow rules:

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "GET",
            "PUT",
            "DELETE",
            "POST"
        ],
        "AllowedOrigins": [
            "https://mydomine.com"
        ],
        "ExposeHeaders": [
            "ETag"
        ],
        "MaxAgeSeconds": 30000
    }
]

For add security and jut the domain include here can access the URL objet.

I add this rule but if I copy and past the URL of one objet in other tab I can access direct the file.

Something is wrong in the rule I add? or what’s can happen.

Im use AWS for save my videos about my online academy and I can’t permit the people take the URL of the videos and use for download or shared outside my website.

Thanks

maxi · April 13, 2021, 12:39am

Please, someone of the support team?

Ecaterina · April 13, 2021, 9:23am

Hello, dear @maxi
We are sorry for the late reply.

Please allow us to analyze your request and to revert ASAP with a detailed response.

Best regards,

Ecaterina · April 13, 2021, 11:20am

Hello, @maxi

We suppose that the main issue is the Name of your Domain, which is indicated in the rule:

Allow me to note that here you need to enter your domain name.
In our documentation are provided examples: “https://yourdomain.com” and “https://yourdomain.bubbleapps.io”, so please indicate both names.

This rule allows access to your files from your domain only and the user will see this error:

In case you want to configure your application and deny using files from other domain, please follow this link to configure it: AWS File Uploader Plugin - Zeroqode Documentation

Please check this point and let me know if all is working.
Regards,

maxi · April 13, 2021, 12:06pm

Hi, thanks for the answer.

I change my settings but if you go to this link: https://s3.us-east-1.amazonaws.com/nocodemy/videos/3ae3a404-9daa-480b-abc4-c2c327c34c41_video_¿Cuanto%20cuesta%3F.mp4

You can access direct to the file.

Ecaterina · April 14, 2021, 9:00am

Hello, @maxi

Yes, we can access your link.

Allow me to recommend you the next steps for checking your issue:

In the ’ Block public access’ area LOCK public access to all for time being.

image1482×715 69.4 KB
In the ‘Bucket Policy’ area you can configure the rules for security and privacy via Bucket Policy. Take a look at the “Action”, “Resource” and “Condition” fields where you grant access for reading the objects from our bucket.
In the ’ Access control list (ACL)’ area make sure that all the options deny access to another user:

image1476×582 97.7 KB
Please make sure you configured the ‘Cross-origin resource sharing’ area and added the possibility to access your app only from your domain:

Please check all these steps and let me know if all is working now.
Regards,

maxi · April 15, 2021, 1:28pm

I attach my screen shots maybe you can find the error because for my follow all the steps:

My domine is correct is .co not .com

Ecaterina · April 16, 2021, 9:24am

Hello, @maxi
Apologizes for the issue you faced.

I checked your screenshots and noticed square brackets that can affect the result. Please try to delete them from this page.

Also, due to the absence of the screenshots of your Cross-origin resource sharing policy (CORS), please allow me to recommend you repeatedly to use exactly this configuration for denying access from the Outsider domain.

And the last thing, please try to deny access to users here:

Please carefully follow these steps and let me know if all is working now.
Looking to hear you soon.

maxi · April 16, 2021, 11:22am

I attach more pictures.

I can’t delete the square brackets because AWS mark a Error:

My CORS:

In ACL i cant deny access to global users, AWS don’t permit this when you mark all in public:

Ecaterina · April 19, 2021, 11:45am

Hello, @maxi

Additionally to all mentioned settings, please follow these steps:

Set the access only for authorized users of your account in the Permission section.

image1355×467 80.5 KB

Use the ‘Cross-origin resource sharing’ area to configure the CORS policy for the S3 bucket.

 [

 {

 "AllowedHeaders": [

 "*"

 ],

 "AllowedMethods": [

 "GET",

 "PUT",

 "DELETE",

 "POST"

 ],

 "AllowedOrigins": [

 "YOUR_DOMAIN_HERE"

 ],

 "ExposeHeaders": [

 "ETag"

 ],

 "MaxAgeSeconds": 30000

 }

 ]

Hope it will help you after setting this.
Regards,

maxi · April 21, 2021, 11:17pm

Hi, i do the changes now the access to the files outside my website is not posible, that is ok.

But in can access to the files in form my website too.

I block li you say the access and jut the permitted users can access the files, but in the first message plus your installation guide say here need setting “PUBLIC ACCESS” and when do this the files be access for anyone inside/outside my website.

The CORS setting like you told me

maxi · April 21, 2021, 11:18pm

Plus info, when use the GUI for upload files form bubble, this upload perfect in the bucket, but when try to play the file (video) in my site or show a image this don’t work.

Ecaterina · April 22, 2021, 9:22am

Hello, @maxi

Allow me to note that the plugin works even when the Public access is blocked, meaning you can upload files, remove them, etc, but they cannot be displayed through the link and it is obvious because the Public access is restricted. Once you enable Public Access the link shows the image. You should apply these settings:

This will help you to reach the required result by accessing the files option.

Generally speaking, all the restrictions and how they work should be checked in AWS documentation. Hope this link will be useful for you:
https://docs.aws.amazon.com/AmazonS3/latest/user-guide/block-public-access.html

Also, to provide you more variants of setting the Bucket Policy, CORS and others, please check this documentation:

We tested our Demo page and this option is working well.
I assume that this issue is related to Restricted access. So, you as admin see the uploaded files in Bucket, but can’t see them outside.

So, please change the Access, as was mentioned above, and try again.

In case if all mentioned steps will not bring results, you can add our Support Team email to the list of collaborators to your application and provide me by email (ecaterina.cheptini@zeroqode.com) the credentials of your AWS Bucket. This will allow us to check your settings and run some tests to fix the mentioned problem.

To add our Support Team as a collaborator, you need to do the following steps in the Bubble Editor:

Settings > Collaboration > Add email support@zeroqode.com

Hope it will help you.
Regards,

maxi · April 22, 2021, 9:41am

Ready, I give the access, and send the S3 credentials for email.

How much time take someone check the problem?

Thanks

Ecaterina · April 22, 2021, 2:29pm

Hello, @maxi

All information is well received. Allow us to check it internally and to revert as soon as it will be possible.
We’ll be doing the best to speed up the process.

Best regards,

Ecaterina · April 23, 2021, 9:03am

Hello, @maxi

By this message, I would like to inform you that we have checked your application and Bucket Policy and now, all is working well.

The Outsider domain can’t see the files, which were uploaded to your Bucket. Please find the screenshot:

The main issue was your Block public access settings, and namely, you did not confirm them:

Also, we checked the settings of your uploader, and it works properly. The files successfully downloaded and displayed now.

Hope it will help you.
Best regards,

maxi · May 13, 2021, 1:52pm

Sorry for the delay, I’ve been testing again and the problem persists.

Don’t touch anything at all, just create a page and add an image upload item to my S3 for testing.

The image loads, I get the URL and show it on the screen to see that the URL was actually created successfully.

But when I use that same URL in an image component to display the uploaded image, the image is not displayed.

I went to my S3 and looked for the file, I tried to open it in my browser and it doesn’t show it (this is perfect, I shouldn’t be able to see the file outside of my website), but it doesn’t show it inside my website either.

Ecaterina · May 14, 2021, 10:02am

Hello, @maxi
Thanks for your question.

Can you please elaborate more regarding the “image component” and your flow for displaying the image on the page?

I’m afraid that we cannot reproduce this issue on our side without more details. Please share with us the screenshots/screencast of the current settings for this and the steps for reproducing your issue.

As was mentioned in our previous conversation, after checking your application with our team, the image uploading and displaying worked properly.

Looking to hear you soon.
Regards,

maxi · May 16, 2021, 9:12pm

I have a page where I added two components:

1: Fileuploader (Zeroqode plugin)
2: Image

For testing purposes what I do is very simple.

I tell the image component that the source (image URL) is the URL obtained from the Fileuploader after uploading the image.

In image 1 you can see the configuration of the zeoqode plugin and in image 2 the configuration of the image component that should show the image uploaded in S3.

In image 3, what I did was inspect the image component and you can see that it is actually receiving the URL from Fileuploader but it does not show it due to permissions problems (this is my guess since I did not touch anything in Bubble, or in S3 ).

Ecaterina · May 17, 2021, 11:58am

Hello, @maxi
Thanks for your time.

We checked the possibility to display the URL, which was uploaded in the S3 bucket, in the image component.
Please make this condition “Off” in the ‘Block public access’ section (other points remain “On”):

Please try it and you will receive the successful result.
Best regards,