React and Direcuts' JS SDK, CORS blocking issue when directus instance is updating and creating

[davcub]

Checklist

• I'm using the latest version of Directus
• There's no other issue that already describes the problem.
• I've completed all Troubleshooting Steps.

Describe the Bug

I keep getting this error when creating and updating with the directus instance in react

Access to XMLHttpRequest at 'https://project_name.directus.app/items/SHIFTS_FLEXERS' from origin 'http://localhost:3000' 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'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

To Reproduce

I have this as my config for my directus instance in react

const config = {
auth: {
mode: 'cookie', // 'json' in Node.js
autoRefresh: true,
msRefreshBeforeExpires: 30000,
staticToken: '',
},
storage: {
prefix: '',
mode: 'LocalStorage', // 'MemoryStorage' in Node.js
},
transport: {
params: {},
headers: {
cors: {
'cors-enabled': false,
'cors-origin': 'http://localhost:3000',
'cors-methods': 'GET, POST, PUT, DELETE, PATCH, OPTIONS',
'cors-credentials': true,
'cors-exposed_headers': 'content-range',
'cors-max_age': 86400,
'cors-allowed_headers': 'content-type, authorization, content-range, x-requested-with'
}
},
onUploadProgress: (ProgressEvent) => { },
maxBodyLength: null,
},
};

const directus = new Directus('https://project_name.directus.app', config);

And making the request by doing this

const shiftsFlexers = await directus.items('SHIFTS_FLEXERS');
const shifts_flexer_obj = {
        SHIFTS_id: 4,
        FLEXERS_id: 3 // need to get flexer id from user
};
shiftsFlexers.createOne(shifts_flexer_obj);

Hosting Strategy

Directus Cloud

[paescuj]

Heya! Thanks for the heads up. This seems like a cloud specific issue. Please reach out through the Live Chat in our Cloud Dashboard as that's the best channel to get help with your Cloud projects 🙂