Menu
I'm using a free plan of firebase storage. All working good but the image not loading on my flutter web.
I'm getting this error.
Access to XMLHttpRequest at 'https://firebasestorage.googleapis.com/v0/b/sap-app-8318e.appspot.com/o/cover%2Fimage_cropper_028D7F16-0161-4E90-B40D-EE47D310F322-5339-000003697F67306C.jpg?alt=media&token=313475a9-9728-4e61-97da-f5d5534bb008' from origin 'https://sap.nextcardpro.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
firebasestorage.googleapis.com/v0/b/sap-app-8318e.appspot.com/o/cover%2Fimage_cropper_028D7F16-0161-4E90-B40D-EE47D310F322-5339-000003697F67306C.jpg?alt=media&token=313475a9-9728-4e61-97da-f5d5534bb008:1
I searched on google everyone told need to allow CORS Access from firebase, but how can I have to add it. but how can I add it to my free firebase plan?
[
{
"origin": ["*"],
"responseHeader": ["Content-Type"],
"method": ["GET", "HEAD", "DELETE"],
"maxAgeSeconds": 3600
}
]
721
CORS Configuration To download data directly in the browser, you must configure your Cloud Storage bucket for cross-origin access (CORS). This can be done with the gsutil command line tool, which you can install from here. Run gsutil cors set cors. json gs://<your-cloud-storage-bucket> to deploy these restrictions.
Configuring CORS (Cross-Origin Resource Sharing) request has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. You can also explicitly disable CORS by setting the cors option to false for your function.
The idea is to create a simple interface containing an image display container and a button to upload an image after selecting it from the gallery. After an image is selected, the file will be automatically uploaded to the Firebase storage and then displayed on the screen.
Once you've created an appropriate reference, you then call the putFile() , putString() , or putData() method to upload the file to Cloud Storage. You cannot upload data with a reference to the root of your Cloud Storage bucket. Your reference must point to a child URL.
Finally, solve by this post after 2 days of google search.
https://bitmovin.com/docs/encoding/faqs/how-do-i-set-up-cors-for-my-google-cloud-storage-bucket
52
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
