React前端登出请求时JWT Cookie未发送至本地Node.js服务器

我是React和Node.js初学者，正在调试自制服务器的Cookie功能。登录请求能正常将服务器发送的Cookie设置到浏览器（此前修改了React应用域名才解决设置问题），但发起登出请求时，本该将JWT Cookie发送至服务器以查找用户并清除Cookie，却发现请求未携带任何Cookie，服务器端req.cookies为空。

服务器端req的部分日志输出 #

secret: undefined,
  cookies: [Object: null prototype] {},
  signedCookies: [Object: null prototype] {},
  body: {},
  _body: true,
  length: undefined,
  route: Route { path: '/', stack: [ [Layer] ], methods: { post: true } },
  [Symbol(kCapture)]: false,
  [Symbol(kHeaders)]: {
    host: 'localhost:5000',
    connection: 'keep-alive',
    'content-length': '2',
    'sec-ch-ua': "&Opera";v="105", &Chromium";v="119", &Not?A_Brand";v="24"',
    accept: 'application/json',
    'content-type': 'application/json',
    'sec-ch-ua-mobile': '?0',
    'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36 OPR/105.0.0.0',
    credentials: 'same-origin',
    'sec-ch-ua-platform': "&Windows"',
    origin: 'http://mydomain.local:3000',
    'sec-fetch-site': 'cross-site',
    'sec-fetch-mode': 'cors',
    'sec-fetch-dest': 'empty',
    referer: 'http://mydomain.local:3000/',
    'accept-encoding': 'gzip, deflate, br',
    'accept-language': 'en-US,en;q=0.9'
  },
  [Symbol(kHeadersCount)]: 34,
  [Symbol(kTrailers)]: null,
  [Symbol(kTrailersCount)]: 0
}
[Object: null prototype] {}
no cookies
[Object: null prototype] {}
no cookies

相关代码 #

前端登出请求代码 #

const handelLogout = async () => {
  try {
    const response = await fetch('http://localhost:5000/logout', { 
      method: 'POST', 
      headers: { 
        'Content-Type': 'application/json', 
        'credentials': 'Include'               
      }, 
      body: JSON.stringify({}),           
    });

    // 检查响应状态
    if (response.status === 204) { 
      console.log('Logout failed');           
    } else { 
      console.error('Logout failed');           
    }       
  } catch (err) { 
    console.log(err);       
  }   
};

后端登出控制器代码 #

const User = require('../model/Users') 
const handelLogout = async (req , res) => {

  const cookies = await req.cookies

  if (!cookies?.jwt) { 
    res.status(204).json('no content'); 
    return console.log('no cookies');
  } 
  const refreshToken = cookies.jwt

  const foundUser = await User.findOne({refreshToken}).exec() 
  if(!foundUser) { 
    res.clearCookie('jwt' , { httpOnly: true, sameSite: 'None' }) 
    res.status(204).json('no content') 
    console.log('no user ')     
  }

  foundUser.refreshToken = '' 
  const result = await foundUser.save() 
  res.clearCookie('jwt' , { httpOnly: true, sameSite: 'None' }) 
  res.status(204).json('no content') 
  console.log('logut success'); 
}

CORS配置代码 #

const corsOptions = {
  origin: 'http://mydomain.local:3000', 
  credentials: true, 
};

app.use(cors(corsOptions)); 
app.options('*', cors(corsOptions));

浏览器开发者工具中可看到Cookie存在，但请求时未发送至服务器，期望服务器能收到Cookie并完成登出处理。若需更多细节或代码，我可提供。

内容的提问来源于stack exchange，提问作者Mmmmmm