tom - I'm developing the web version of my Flut...
I'm developing the web version of my Flutter app and encountering CORS errors when trying to load images directly using their BuildShip's storage URLs. Any advice on how to solve this?
4 Replies
Hi @tom, you can checkout this thread https://discord.com/channels/853498675484819476/1283526910218993716/1283858118757060670 It is for FlutterFlow, but you can refer to the approach.
Hey, thanks for the reply. I'm somewhat lost on how that applies here, I don't think I can change the headers for this request? https://storage.googleapis.com/buildship-[MASKED]-us-central1/uploaded-files/[MASKED_ID].jpeg or is there something I can do?
I there a possibility to allow my domain in the Google Cloud Storage bucket?
I'll update my plan if you could do it 😄
I think this issue can be eliminated without changing domain in GCS, @tom could you please share more about how you are handling the request on client side cc @Stu can help further.
Happy to, but I think I might need some leading-questions. I'm getting the image URL from one API request and then I call out the Image in (FlutterFlow), it uses the CachedNetworkImageProvider and I feed it the URL as param. I'm currently using a workaround prefixing the URL with corsproxy. The website is currently hosted on FlutterFlow infra.
Access to fetch at 'https://storage.googleapis.com/buildship-*****/uploaded-files/***************.png' from origin 'https://*****' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.Understand this error
main.dart.js:891
GET https://storage.googleapis.com/buildship-*****/uploaded-files/***************.png net::ERR_FAILED 200 (OK)