每次 React 向 Express 发送请求时,都会生成一个新的会话
Every time React sends request to Express, a new session is generated
我使用 React
作为客户端向 Express
发送请求,并设置了 proxy
和 express-session
。但是每次 React 向 Express 服务器发出请求时,都会创建一个新会话。因此,我通过手动访问相同的 api url 来单独检查 Express,并且每次刷新页面时它都会继续使用相同的会话。
项目结构:
project-folder
- client // React client with proxy set up
+ src
+ package.json
+ ...
- server.js
- package.json
里面 server.js
:
const session = require('express-session');
let sessionConf = {
name: 'aoid',
secret: 'Whosebug',
resave: true,
saveUninitialized: true,
rolling: true,
cookie: {
httpOnly: false,
secure: false,
maxAge: 2000000
}
};
app.use(session(sessionConf));
app.get('/api/prod', (req, res, next) => {
let sessionId = req.sessionID; // is generated each time React client send request, works fine with api alone!
console.log(sessionId);
if (!sessionId) return res.status(401).send('Unauthorized Error');
res.status(200).send({ data });
});
这里是 React 客户端如何向 Express 发送请求:
let loadItems = async () => {
const response = await fetch('/api/prod');
const body = await response.json();
if (response.status !== 200) throw Error(body.message);
return body;
}
我认为问题出在 React 和 Express 之间的错误配置。以前有人遇到过这个问题吗?
fetch
默认不发送cookie
,需要显式设置:
fetch(url, {
method: 'GET',
credentials: 'include',
// ...
})
我使用 React
作为客户端向 Express
发送请求,并设置了 proxy
和 express-session
。但是每次 React 向 Express 服务器发出请求时,都会创建一个新会话。因此,我通过手动访问相同的 api url 来单独检查 Express,并且每次刷新页面时它都会继续使用相同的会话。
项目结构:
project-folder
- client // React client with proxy set up
+ src
+ package.json
+ ...
- server.js
- package.json
里面 server.js
:
const session = require('express-session');
let sessionConf = {
name: 'aoid',
secret: 'Whosebug',
resave: true,
saveUninitialized: true,
rolling: true,
cookie: {
httpOnly: false,
secure: false,
maxAge: 2000000
}
};
app.use(session(sessionConf));
app.get('/api/prod', (req, res, next) => {
let sessionId = req.sessionID; // is generated each time React client send request, works fine with api alone!
console.log(sessionId);
if (!sessionId) return res.status(401).send('Unauthorized Error');
res.status(200).send({ data });
});
这里是 React 客户端如何向 Express 发送请求:
let loadItems = async () => {
const response = await fetch('/api/prod');
const body = await response.json();
if (response.status !== 200) throw Error(body.message);
return body;
}
我认为问题出在 React 和 Express 之间的错误配置。以前有人遇到过这个问题吗?
fetch
默认不发送cookie
,需要显式设置:
fetch(url, {
method: 'GET',
credentials: 'include',
// ...
})