为啥 Postman 在我的 React 应用程序中接收到 express 会话 cookie 而不是我的 post 请求
Posted
技术标签:
【中文标题】为啥 Postman 在我的 React 应用程序中接收到 express 会话 cookie 而不是我的 post 请求【英文标题】:Why Postman recive the express session cookie but not my post request in my React app为什么 Postman 在我的 React 应用程序中接收到 express 会话 cookie 而不是我的 post 请求 【发布时间】:2019-08-30 07:55:33 【问题描述】:我有一个带有 express、express-session 和护照的 nodejs 服务器用于身份验证。我的登录路线如下所示:
router.post('/login', passport.authenticate('local'), (req, res) =>
return res.status(200).json(
message: "Auth successful",
username: req.user.username
)
)
当我使用 Postman 测试路由时,我在响应中收到带有会话 ID 的 cookie:Postman result 但是当我在 React 中使用 axios 进行发布请求时,我没有收到任何 cookie:
const login = (email, password) =>
const reqBody =
email,
password
const config =
withCredentials : true,
return axios.post(`$serverUrl/user/login`, reqBody, config)
这是我的 Node.js 服务器中的 cors:
// Cors definition
app.use((req, res, next) =>
res.setHeader('Access-Control-Allow-Origin', 'http://localhost:3000')
res.setHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept')
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE')
res.setHeader('Access-Control-Allow-Credentials', true)
next()
)
Network tab on Chrome 如您所见,控制台中没有 cookie 选项卡并在标题中注明。所以我想知道为什么以及如何解决这个问题。
【问题讨论】:
这似乎是一个跨域问题,您是在localhost:4200
上托管您的网站还是在其他端口上而不是 4200 上的服务器
我的 cors 标头设置在我的服务器上,我收到状态 200 以及我的 React 应用程序中的消息和用户名。如果是跨域问题,我是否根本无法提出请求?为了回答你的问题,我的服务器在 5000 端口,我的客户端在 3000 端口。
您能否发布您用于跨源的标头,因为您可能需要设置一些额外的标头以保留 cookie
按照您的要求,我在我的问题中添加了我在服务器上设置的标头。
【参考方案1】:
所以!我找到了为什么我可以在 Postman 响应中看到 cookie 而不是我的浏览器(Chrome)的答案。我在 chrome 中找到了 cookie,而不是在页面控制台的 application -> Storage -> Cookies 中,而是在 chrome://settings/cookies/detail?site=192.168.2.89 。
我理解的是 express-session 或 postman.session() 只在 cookie 上设置 http:
在生成 cookie 时使用 HttpOnly 标志有助于降低客户端脚本访问受保护 cookie 的风险(如果浏览器支持)。 https://www.owasp.org/index.php/HttpOnly
我仍然无法看到 express 在哪里设置标头以及如何记录服务器发送的 cookie。
【讨论】:
【参考方案2】:cookies 不出现在响应中,它们出现在标题中。请查看标题,您应该有一个“Set-Cookie”条目
【讨论】:
如果 set-cookie 标头存在 Chrome 将添加 cookie 标签。 您是否尝试过消除邮递员的 cookie?也许他在邮递员中退回了cookie,因为他正在发送它 是的,我删除了所有 cookie 并创建了一个新请求,以确保他仍然得到它。以上是关于为啥 Postman 在我的 React 应用程序中接收到 express 会话 cookie 而不是我的 post 请求的主要内容,如果未能解决你的问题,请参考以下文章
为啥我没有在我的 react 应用程序中获取 firebase 存储文件 url?
为啥我无法在我的 React 应用程序中访问 Konva Canvas 属性?
在我的 React 应用程序的页脚添加“display: flex”会在其下方添加空白,为啥会这样?
React Native 已经有了异步存储。为啥我应该在我的 react native 应用中使用 Redux 和 Redux Thunk?