Req.user null presumably due to cross-site request?

ingrid741last year

9

      const url = `${process.env['PAYLOAD_PUBLIC_SERVER_URL']}/data/api/email-history/verifyTransporter`
      const res = await fetch(url, {
        method: 'GET',
        credentials: 'include',
        headers: {
          "Content-Type": "application/json",
        },
      })

  auth: {
    useAPIKey: true,
    tokenExpiration: 28800, // 8 hours
     cookies: {
       sameSite: 'none', // med denne på må secure være true, ellers settes ikke cookien
       secure: true, // med denne på nekter Chrome å sette cookien på http, må være https (unntatt localhost)
       // domain: '.localhost', // brukes for å tillate deling av cookies på tvers av subdomener i frontend 
     },
  },
...

  cors: [ 'https://multitenant-1.payloadcms.app', 'https://oversoul.no' ],
  csrf: [ 'https://multitenant-1.payloadcms.app', 'https://oversoul.no' ],

• 

  sourabpramaniklast year

  you also got to provide the port number if running locally

• 

  ingrid741last year

  Thanks! Adding port number, it works locally with the

  csrf

  property set in config.

  
  
  

  Why is it not working on Cloud though, even if I add admin panel origin precisely to csrf? I'm logdumping

  payload.config.csrf

  and verifying it is set with the requesting origin exactly.

  
  
  @967118574445547650

  This could not possibly by a caching issue right...?

• 

  sourabpramaniklast year

  To send the cookies to a different domain you have add the domain in the cookie options.

  
  

  e.g. domain: 'oversoul.no'

• 

  denolfe

  last year

  As

  @681934949128994835

  mentioned, you'll need to add the actual domain that cloud deploys on to your cookies and csrf

• 

  ingrid741last year

  That makes sense but it's still not working, unfortunately.

  
  
  

  Current setup:

  
  
  

  * Added any & all relevant domains (without protocol) to csrf config like so:

  csrf: ["localhost:3000","multitenant-1.payloadcms.app","oversoul.no","oscar-floor.vercel.app","localhost:3002"]

  
  
  

  * Added Cloud default domain to cookies config:

  
  
  

  export const Users: CollectionConfig = {
    slug: 'users',
    auth: {
      useAPIKey: true,
      tokenExpiration: 28800, // 8 hours
      cookies: {
        sameSite: 'none',
        secure: true,
        domain: '.payloadcms.app',
      },
    },
  ...

  
  
  

  Also tried cookie domains

  multitenant-1.payloadcms.app

  ,

  .multitenant-1.payloadcms.app

  ,

  .oversoul.no
• 

  sourabpramaniklast year

  CSRF and CORS must have all the domains with the exact protocols

  
  
  

  Which domain is pointing to your hosted payload app?

• 

  ingrid741last year

  https://multitenant-1.payloadcms.app
  
  

  Could be the one and only combination I haven’t tried yet (csrf with protocols and correct cookie setting), trying that now

  
  
  

  New development: If I login from

  payloadcms.app

  I can login and user is set 🥳 If I try from a login page that is masked with FE domain, login doesn't work (page just reloads, no cookie set).

  
  
  

  The issue now is that cookie domain can take just one domain, right? Meaning I won't be able to authenticate users from several frontends using HTTP cookie, unless there is some workaround?

  
  
  

  So far my FEs have been fetching data using API keys associated with tenant admins, which is super. But as I'm about to implement FE auth I'm going to need auth by login cookie, as well as this case here where I'm trying to authenticate a logged-in admin in the admin panel from a masked domain 🙏

  
  
  

  Any ideas?

  
  
  

  Can't be the only one running into this

  
  
  

  This is unexpected. Tried removing cookie domain setting and it seems to work. I can log in from masked domain, and requests are able to use the cookie. User it set.

  
  
  

  It's basically setting only CSRF w/protocol, which I did try a couple times 🤷

  
  
  

  Thank you for the input Elliot and Sourab.

  
  
  

  Ahh nevermind. The issue at hand was solved 🙂 Excuse me

• 

  fedes5626last year

  hey

  @735059082293149777

  I think I'm having the same issue, I want to use my staging login cookie in my local frontend enviroment.

  
  

  So my payload admin is on stg.example.com

  
  

  And my local frontend is on localhost:3000

  
  
  

  my payload.config.ts

  
  
  

  cors: [
    'http://localhost:3000',
  ],
  csrf: [
    'http://localhost:3000',
  ]

  
  
  

  also my Users config has

  
  
  

    auth: {
      useAPIKey: true,
      cookies: {
        sameSite: 'None',
        secure: false,
        domain: 'localhost',
      },
    },

  
  
  

  but I also tried without it as I understand you didn't need that after all?

  
  
  

  BTW when running cms on localhost:3001 and frontend in localhost:3000 it works fine

• 

  zapata.ethlast year

  try checking the nextjs config and add these

  
  
  

  import { withPayload } from '@payloadcms/next/withPayload'
  
  /** @type {import('next').NextConfig} */
  const nextConfig = {
    output: 'standalone',
    async headers() {
      return [
        {
          source: '/api/:path*',
          headers: [
            { 
              key: 'Access-Control-Allow-Origin', 
              value: `${process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'http://localhost:3000'}`
            }
          ]
        },
      ]
    },
  }
  
  export default withPayload(nextConfig, { devBundleServerPackages: false })