Back

[SOLVED] Flutter web and appwrite CORS problem

  • 0
  • Self Hosted
  • Flutter
  • Web
YahalomS
27 Jul, 2023, 13:40

I have a problem after I have built and published my Flutter Web App. My app is working perfectly when running it from the IDE , Android Studio, with Google chrom in Localhost:somePort.

What I have done: --- I have published my app to my web server and it is working on the web-site with my domain, i.e. www.mysite.com --- I have created a custom domain in Appwrite console settings for my Appwrite app as ar.mysite.com , --- I created A record in the DNS settings of domain, the console of Appwrite is accessible through the browsert at https://ar.mysite.com --- I have created an SSL certification on the Appwrite server according to the docs. --- I have also changed the Endpoint of Appwrite in my Flutter app to point to the new address: https://ar.mysite.com/v1 --- I have modified the .env file in appwrite folder of the Appwrite server

and still after all that , I can open the app in the browser, but is stops running when getting to authentication request from the server and the browser's console gives me a CORS error as follows:

Access to XMLHttpRequest at 'https://ar.mysite.com/v1/account?#' from origin 'https://mysite.com' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'https://localhost' that is not equal to the supplied origin.

any help will be appreciated. Guy

TL;DR
The user was experiencing a CORS problem with their Flutter web app and Appwrite. They had published their app to a web server with a custom domain and made the necessary configurations in the Appwrite console and DNS settings. However, when trying to authenticate with the server, they encountered a CORS error stating that the 'Access-Control-Allow-Origin' header had a value 'https://localhost' that didn't match the supplied origin 'https://mysite.com'. The user sought help from the community and it was suggested that they add the web platform instead of flutter-web in their code. The issue was resolved by making this change.
Samuel Kings
27 Jul, 2023, 13:49

Did you add your domain as a platform in Appwrite console?

Samuel Kings
27 Jul, 2023, 13:51

I mean the new domain through which you're accessing your Appwrite endpoint in production mode

YahalomS
27 Jul, 2023, 13:52

Thank you for the response , Yes , I have added *.mysite.com as a flutter web platform

Samuel Kings
27 Jul, 2023, 13:54

In your error message, it says mysite.online

YahalomS
27 Jul, 2023, 13:55

sorry for that , just a typo, I fixed it, the error from the browser is giving the right url

YahalomS
27 Jul, 2023, 13:56

you probably understand , for security reasons, I have changed the url to 'mysite.com', missed this one.....

YahalomS
27 Jul, 2023, 13:57

although, stangely, it also giving a https://localhost , which I could not figure out...

YahalomS
27 Jul, 2023, 14:03

@Samuel Kings Any other Idea?

Samuel Kings
27 Jul, 2023, 14:14

I'm not really sure. Let's wait for the Appwrite support team.

YahalomS
27 Jul, 2023, 14:16

Thanks Samuel, appreciate your help, waiting.......

Samuel Kings
27 Jul, 2023, 14:25

No problem

Eldad
27 Jul, 2023, 15:02

@YahalomS you can also join stage channel for office hours, the team might be able to help

Eldad
27 Jul, 2023, 15:03
joeyouss
27 Jul, 2023, 15:51

Taking this up in OH right now and this is what we discussed:

  • You need to add the web platform instead of flutter-web
joeyouss
27 Jul, 2023, 15:51

It works!

joeyouss
27 Jul, 2023, 15:52

Thank you @YahalomS for bringing this up and joining Office Hours :appwriteheart2:

YahalomS
27 Jul, 2023, 16:10

Thanks alot friends in OH!

D5
27 Jul, 2023, 16:31

[SOLVED] Flutter web and appwrite CORS problem

Reply

Reply to this thread by joining our Discord

Reply on Discord

Need support?

Join our Discord

Get community support by joining our Discord server.

Join Discord

Get premium support

Join Appwrite Pro and get email support from our team.

Learn more