CORS Credential is not supported if the CORS header ‘Access-Control-Allow-Origin’ is ‘*’)

joelcoreylast year

9

• 

  notchrlast year

  Hey

  @423230148721246209

  - have you tried explicitly listing your allowed origins?

• 

  joelcoreylast year

  export default buildConfig({
    serverURL: 'http://localhost:5000',
    cors: [
      'http://localhost',
      'http://localhost:5000',
      'example.com',
      'example.com:5000'
    ].filter(Boolean),
    admin: {
      user: Users.slug,
    },
    collections: [Categories, Posts, Tags, Users, Media, ServiceCategories],
    typescript: {
      outputFile: path.resolve(__dirname, 'payload-types.ts'),
    },
    graphQL: {
      schemaOutputFile: path.resolve(__dirname, 'generated-schema.graphql'),
    },
    plugins: [
      cloudStorage({
        collections: {
          'media': {
            adapter
          },
        },
      }),
    ],
  })

  Like that?

  
  
  

  Just listing whatever I can think of at this point haha

• 

  jarrod_not_jared

  last year

  Looks like you are trying to auth from your frontend to your backend using

  credentials: include

  right?

  
  
  

  You should add the domains that you want to auth from to the

  csrf

  array on the config, this allows you to attach the http only cookies when using credentials on the request.

• 

  joelcoreylast year

  cors: [
      'http://localhost',
      'http://localhost:5000',
      'https://example.com',
      'https://example.com:5000'
    ].filter(Boolean),

  seems to be working

  
  
  

  Not sure as to why because honestly it has been an age since I have had to deal with CORS.

• 

  notchrlast year

  I think that a wildcard value is no longer accepted for specific request types? I could be wrong, but manually listing your origins I believe is the accepted way to deal with CORS/CSRF

• 

  jarrod_not_jared

  last year

  We get this question a lot, and I credit that to the swarm of people on the internet posts telling people to use the wildcard for allow origins 💀

  
  
  

  This (

  https://github.com/payloadcms/payload/blob/master/src/express/middleware/corsHeaders.ts#L10

  ) is the line in payload that causes people trouble when they do that. When allow origins is

  *

  you

  cannot

  set

  Access-Control-Allow-Credentials

  to

  true

  , it is just not possible bc of web standards. So you need to explicitly set your CORS to be the domains that you would like to authenticate with using http-only cookies, i.e. the domains that you would like to be able to send

  credentials: include

  from. This way when the client makes the preflight request to the server, the server responds and says "yeah, I can accept credentials from this domain", then your actual request is made and credentials are sent along, allowing you to authenticate.

• 

  joelcoreylast year

  Seems worthy of a blog post to me

• 

  jarrod_not_jared

  last year

  I kinda feel the same

• 

  notchrlast year

  @281120856527077378

  @423230148721246209

  I started a little something but I got a lot of tasks today 😦

  
  
  https://docs.google.com/document/d/1poYjxyTfhuF_JAnOs7d_gzYoAVHLToHDskfK2r9QQNU/edit?usp=sharing
  
  

  Please feel free to continue / revise / trash that as necessary haha