Updating CORS settings for myapp-server
Hi everybody, currently playing around with my webapp beta version on fly.io and I wanted to connect it to my custom domain. Did anyone ever try to update the CORS settings for the myapp-server part of a Wasp app?
I have my webapp hosted on fly.io and have successfully added a certificate to route my custom-domain.com traffic to the myapp-client.fly.dev domain. This works like a charm, however this is not compaible with the myapp-server since it does not allow my custom-domain.com to access it. My browser terminal gives me a 401 error from myapp-server, so it is a CORS issue. How can I fix this? From my understanding, all i would have to do is add custom-domain.com to the allowed domains, right? I could already gather that localhost is set by default from issues on GitHub (https://github.com/wasp-lang/wasp/issues/94, https://github.com/wasp-lang/wasp/pull/206), but did not find a way to manually add my custom-domain before deploying.
I also tried adding a certificate to myapp-server hoping that would fix it, but this alone is not sufficient.
Any pointers on this would be greatly appreciated. Thanks in advance! 💪
GitHub
Issues · wasp-lang/wasp
The fastest way to develop full-stack web apps with React & Node.js. - Issues · wasp-lang/wasp
3 Replies
Hi @Dom. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
To update the CORS settings for your Wasp app's server deployed on Fly.io to allow requests from your custom domain, you need to set the
WASP_WEB_CLIENT_URL environment variable. This will configure the server to accept requests from your custom domain. Here's how you can do it:
1. Set the WASP_WEB_CLIENT_URL environment variable for your server app on Fly.io. You can do this by running the following command:
Replace your-custom-domain.com with your actual custom domain.
2. After setting this environment variable, you should redeploy your server app to apply the changes.
This approach is described in the Wasp deployment documentation, which states:
"You need to set your domain as the WASP_WEB_CLIENT_URL environment variable for your server app ... We need to do this to keep our CORS configuration up to date."
By setting this environment variable, Wasp will automatically configure CORS to allow requests from your custom domain.
If you're still experiencing issues after setting the environment variable and redeploying, you might need to check your server's middleware configuration. You can customize the CORS settings further by modifying the server middleware, as described in the Wasp documentation on configuring middleware.
Remember that after making any changes, you need to redeploy your app for the changes to take effect.
If you continue to face issues, it might be helpful to double-check that your custom domain is correctly set up and that the SSL certificate is properly configured for both your client and server apps on Fly.io.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @Dom, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?Will this overwrite myapp-client.fly.dev or will it add custom-domain.com as an additional entry to the CORS list? I hope it's that easy, I just want to avoid that I break my existing setup by overwriting a variable that should not be overwritten 😄
This might be useful for you then: https://gist.github.com/infomiho/5ca98e5e2161df4ea78f76fc858d3ca2
Gist
Multiple domains for CORS - custom global middleware in Wasp 0.12+
Multiple domains for CORS - custom global middleware in Wasp 0.12+ - main.wasp