FLY WASP_SERVER_URL
so WASP_WEB_CLIENT_URL is my new website like testwebsite.com
and WASP_SERVER_URL is my server? so testwebsite-server.client.dev ? How does the api get resolved? not understanding that I can
This always fails but
This works! not understanding the api call
8 Replies
Hi @A³Learn. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
I understand your confusion about the server URLs and API resolution in Wasp when deploying to Fly.io.
When you deploy a Wasp app, you need to set two important environment variables:
1.
WASP_WEB_CLIENT_URL: This should be the URL where your frontend is accessible. If you're using a custom domain like testwebsite.com, then that's what you should set here.
2. WASP_SERVER_URL: This should be the URL where your server is accessible. If you're using Fly.io, this would typically be something like testwebsite-server.fly.dev.
The reason your second curl command works but the first one doesn't is because you need to target the actual server URL where your API endpoints are hosted. In your case, that's test-server.fly.dev, not www.test.io.
When you make API calls, you need to send them to where your server is actually running. The server needs to know about the client URL (via WASP_WEB_CLIENT_URL) to properly configure CORS headers, and the client needs to know about the server URL to make API calls.
If you're using a custom domain, you'll need to set up the DNS records properly as described in the Using a Custom Domain For Your App documentation. This includes adding the appropriate A and AAAA records to your domain.
Also, make sure that your WASP_SERVER_URL is correctly set without a trailing slash, as trailing slashes can cause CORS errors as mentioned in a GitHub issue.
If you want your API to be accessible through your custom domain, you would need to set up proper routing or proxying from your domain to your Fly.io server.
Does this help clarify how the API resolution works in your Wasp app?
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @A³Learn, 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?When you make API calls, you need to send them to where your server is actually running. Really? So I need to be routing them to the ??
@kapa.ai
Let me check the knowledge base for you again. One moment! :books:
----------------------
Yes, that's correct. When making API calls from your client application, you need to send them to where your server is actually running, which is defined by the
WASP_SERVER_URL environment variable.
In Wasp, there are two key environment variables that control the communication between your client and server:
1. REACT_APP_API_URL (for the client): This tells your frontend where to send API requests. During development, Wasp automatically sets this to <http://localhost:3001> when you run wasp start, but in production, you need to set it to your server's URL as seen from the browser Accessing the configuration.
2. WASP_WEB_CLIENT_URL (for the server): This tells your server where the client is running, so it can properly configure CORS headers Deploying Manually.
When you deploy your application, your API calls need to be directed to the server URL. If you're using Fly.io, this would typically be something like your-app-name.fly.dev. That's why your curl command to test-server.fly.dev worked, but the one to www.test.io didn't.
If you want to use a custom domain for your API calls, you would need to:
1. Set up proper DNS records for your domain
2. Configure your deployment to use that domain
3. Ensure your client is configured to send requests to that domain
This is why understanding and correctly setting these environment variables is crucial for proper communication between your client and server components.
Would you like me to explain more about how to configure these URLs for a specific deployment scenario?
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @A³Learn, 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?I don't think this is right, can someone from Wasp confirm?
https://wasp.sh/docs/advanced/apis
Custom HTTP API Endpoints | Wasp
In Wasp, the default client-server interaction mechanism is through Operations. However, if you need a specific URL method/path, or a specific response, Operations may not be suitable for you. For these cases, you can use an api. Best of all, they should look and feel very familiar.
That is correct.
You always send requests from the client to the server.
When you use wasp app the client is the React frontend application.
When you use use curl the client is curl.
But the requests go to the server.
Aha!! So
https://wasp.sh/docs/auth/social-auth/google#data-received-from-google
For example: https://your-server-url.com/auth/google/callback
is going to be something like
mywebsite-server.fly.dev (or similar) NOT the client which is mywebsite.com, correct??
Google | Wasp
Wasp supports Google Authentication out of the box.
Yes
Thank you!