Access-Control-Allow-Origin

[samsls]

Hello there,
I 'm trying to configure Directus with AgencyOS : A new "template" to build client portal. It seems to be a great tool you can discover there :

The installation process seems to be ok until when i'm trying to login thru the frontend : A vercel App.

Error Message from the frontend :
[POST] "https://directus-agencyos.tools.sl-system.io/auth/login": <no response> Failed to fetch

Error message from the chrome console :
Access to fetch at 'https://directus-agencyos.tools.sl-system.io/auth/login' from origin 'https://portail-one.vercel.app' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.

So my question :
How can i configure the Access-Control-Allow-Origin policy in Directus especialy and on Cloudron generally?

Thanks a lot for your help

Regards,
Sam

[girish]

@samsls said in Access-Control-Allow-Origin:

Access to fetch at 'https://directus-agencyos.tools.sl-system.io/auth/login' from origin 'https://portail-one.vercel.app'

Per this error, you have a vercel app . The frontend on vercel is querying your directus. I assume directus on Cloudron . You have to set CORS headers following https://docs.directus.io/self-hosted/config-options.html#cors . On Cloudron, you can set env vars in /app/data/env.sh . See https://docs.cloudron.io/apps/directus/#environment-variables

[samsls]

Thanks it works.

[JLX89]

@samsls said in Access-Control-Allow-Origin:

Thanks it works.

@samsls Curious on what you did to get this working? I'm facing the same issue. The default "ashley@example.com" works, but any created accounts are failing. I have the CORS set in env.sh, but I might be missing something.

Oops! Something went wrong.
[POST] "https://directus.domain.com/auth/login": 401

[samsls]

@JLX89
This is not not 'Access-Control-Allow-Origin'
But i faced this error too.
Do you try to use AgencyOS? or only Directus ?
Because if you use AgencyOS script you import a lot of things automatically. SO i can't confirm at 100% what i did.

In my case, this error (401) disapeared when i use default admin account to install AgencyOS. And then only, i have created a new admin user.
And magically, i can connect with the new account.

Not very technical but it works. Hope it helps.

[JLX89]

@samsls Thanks for following up with me on this!

I used the Directus CLI with a Token for the admin account to import the data into a "default vanilla installation of Directus". Everything imported without any issues. Afterwards, I deployed the front end using Vercel from a private GitHub repo.

Based on the reply from @girish, I put some additional configuration into the env.sh file and restarted Directus.

export CORS_ENABLED="true"
export CORS_ORIGIN="domain1.com,app-name.vercel.app"
export CORS_METHODS="GET,POST,PATCH,DELETE,OPTIONS"
export CORS_ALLOWED_HEADERS="Content-Type,Authorization"
export CORS_EXPOSED_HEADERS="Content-Range"
export CORS_CREDENTIALS="true"
export CORS_MAX_AGE="18000"

I've placed that into the env.sh as a wide-open test to at least see if I could get it working, but no luck.

I know there are some other options, that you can force some of these settings into your Vercel deployment using the vercel.json file, but haven't gotten to that yet.

There are some open issues that it seems they're looking into based on their GitHub.

• CORS issues for client portal in "PROD" like deployment
• Fetch the data from the server side instead of the client?