To allow Flutter Web Apps to access Firebase Storage Data using GET method, we need to edit the Cross-origin resource sharing (CORS) policy in the Google Cloud Platform (GCP) for a particular Firebase Project (Firebase Storage Bucket)
STEP 1: Login to Google Cloud Platform (Login with same Google account which is linked to your Firebase Project) & click on “Console“
STEP 2: Select your Firebase Project ID & click on “Editor/Terminal Icon“
STEP 3: Click on Open Editor to Activate Google Cloud Shell.
STEP 4: In your Comupter create a file named “cors.json” & paste the following content inside it exactly as it is:
[
{
"origin": ["*"],
"method": ["GET"],
"maxAgeSeconds": 3600
}
]
Save the file & keep it ready for the next step
STEP 5: Once Google Cloud Shell Editor is opened, click on Upload to select the cors.json file from your computer to upload it.
STEP 6: On a new tab, Login to Firebase Dashboard > Select Project > Firebase Dashboard > Storage > Copy the Firebase Storage Bucket URL as shown below
STEP 7: Head back to Google Cloud Shell Editor , click on “New Terminal” & paste the following command in the terminal & hit enter:
gsutil cors set cors.json Paste your Firebase Storage Bucket URL here
STEP 8: On Successful setup, you will see a message like this without any error:
👏 Congratulations! You have successfully set up the CORS Policy for your Firebase Storage Bucket. Web App can now access/download storage files without any REQUEST error.