CORS Error deploying to fly.io
Hi, I am facing an error when I try deploying using the launch and deploy commands. What environment variables are needed on the client, server, and db containers on fly.io for them to all talk to each other successfully? @kapa.ai
10 Replies
Hi @morganlily.. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
When deploying your Wasp app to Fly.io, you need to set up several environment variables for the server. Here are the required environment variables:
-
DATABASE_URL
: The URL of the PostgreSQL database your app will use.
- WASP_WEB_CLIENT_URL
: The URL where your frontend app is running. The server needs to know about it to properly configure Same-Origin Policy (CORS) headers.
- WASP_SERVER_URL
: The URL where the server is running. The server needs it to properly redirect users when logging in with OAuth providers like Google or GitHub.
- JWT_SECRET
: You only need this environment variable if you're using Wasp's auth
features. Set it to a random string at least 32 characters long.
- PORT
: The server's HTTP port number. This is where the server listens for requests (default: 3001
).
You can set these environment variables using the flyctl secrets set
command. For example:
If your app is using an external authentication method(s) supported by Wasp (such as Google or GitHub), make sure to additionally set the necessary environment variables specifically required by these methods.
If you want to make sure you've added your secrets correctly, run flyctl secrets list
in the terminal. Note that you will see hashed versions of your secrets to protect your sensitive data.
For more details, you can refer to the Wasp documentation on environment variables (https://wasp-lang.dev/docs/advanced/deployment/manually#environment-variables).
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @morganlily., 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?If I set these variables in my wasp .env.server file will these be set on the client and server?
In short - no 😄 these files are for development only. Read more here: https://wasp-lang.dev/docs/project/env-vars
Env vars in production are set differently depending on your hosting provider / way of hosting.
When using Wasp CLI to deploy to Fly - Wasp sets these env vars for you. What kind of errors are you seeing?
Env Variables | Wasp
Environment variables are used to configure projects based on the context in which they run. This allows them to exhibit different behaviors in different environments, such as development, staging, or production.
Cool that's fine. I'm trying to deploy to fly.io. It created 4 apps when I ran wasp deploy fly launch: client, server, db, and server-db. I'm not sure if an extra db is being created somehow. However it all seems to deploy fine. After it is deployed I am hitting a button on the client which is giving me the attached error in my console. This is the getGuests function:
export const getGuests = async (args, context) => {
try {
return await context.entities.Guest.findMany();
} catch (error) {
console.error('Error fetching guests:', error);
throw new Error('Failed to fetch guests');
}
}
Wohooo @morganlily., you just became a Waspeteer level 1!
These are the errors in the console
@kapa.ai can you help me?
Let me check the knowledge base for you. One moment! :books:
----------------------
Of course! I'd be happy to help. Could you please provide more details about the issue you're facing or the information you need?
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @morganlily., 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?
1. Seems like you have a redundant database on Fly, probably from previous depoyment attempts. I am not sure which one is redundant at the moment though. But it shouldn't cause any issues here.
2. CORS error -> hard to say exactly at this moment, but a common cause might be that your env vars are not correctly configured. Have you followed docs https://wasp-lang.dev/docs/advanced/deployment/cli closely? You are not using a custom domain, are you?
Can you also check logs coming from the server? You should be able to access those via Fly's web dashboard, see what is being logged upon that failed CORS error.