我有一个 React 应用程序调用 node.js/Express 中的 API。
前端部署在 Netlify (https)，后端部署在 Heroku (https)。
我的问题：
- 在开发环境（本地主机）中工作的一切
- 在生产（Netlify/Heroku）中，注册和登录的 api 调用似乎有效，但会话 cookie 未存储在浏览器中。因此，对 API 中受保护路由的任何其他调用都会失败（因为我没有收到用户凭据）。
说话很便宜，给我看代码....
后端（Express API）：
- 我正在使用护照（本地策略）、express-session、cors。
应用程序.js
require('./configs/passport');
// ...
const app = express();
// trust proxy (https://stackoverflow.com/questions/64958647/express-not-sending-cross-domain-cookies)
app.set("trust proxy", 1);
app.use(
session({
secret: process.env.SESSION_SECRET,
cookie: {
sameSite: process.env.NODE_ENV === "production" ? 'none' : 'lax',
maxAge: 60000000,
secure: process.env.NODE_ENV === "production",
},
resave: true,
saveUninitialized: false,
ttl: 60 * 60 * 24 * 30
})
);
app.use(passport.initialize());
app.use(passport.session());
// ...
app.use(
cors({
credentials: true,
origin: [process.env.FRONTEND_APP_URL]
})
);
//...
app.use('/api', require('./routes/auth-routes'));
app.use('/api', require('./routes/item-routes'));
CRUD 端点（例如 item-routes.js）：
// Create new item
router.post("/items", (req, res, next) => {
Item.create({
title: req.body.title,
description: req.body.description,
owner: req.user._id // <-- AT THIS POINT, req.user is UNDEFINED
})
.then(
// ...
);
});
前端（react应用程序）：
- 使用 Axios 并将“withCredentials”选项设置为 true...
用户注册和登录：
class AuthService {
constructor() {
let service = axios.create({
baseURL: process.env.REACT_APP_API_URL,
withCredentials: true
});
this.service = service;
}
signup = (username, password) => {
return this.service.post('/signup', {username, password})
.then(response => response.data)
}
login = (username, password) => {
return this.service.post('/login', {username, password})
.then(response => response.data)
}
//...
}
创建一个新项目...：
axios.post(`${process.env.REACT_APP_API_URL}/items`, {
title: this.state.title,
description: this.state.description,
}, {withCredentials:true})
.then( (res) => {
// ...
});
