在接受来自 Axios 的发布请求后,我无法进行重定向。我确实知道请求正在发送,并且它至少从 '/' 路由得到一些响应,因为我的控制台记录了“index”、“用户验证”,这是当有人向 '/ 发出 get 请求时应该发生的情况'。问题是页面无法加载。我什至在谷歌浏览器的网络选项卡中看到index.js已加载,但无论我尝试什么,页面都不会改变!这有什么原因吗?
我所做的其他重定向似乎有效。例如,如果用户未登录,索引页面将重新路由到 /login。这似乎只是发布请求的问题,我已经在使用和不使用护照身份验证的情况下对其进行了测试(显然更改为您需要登录)来重定向)并且结果相同。所以我不认为护照是造成这个问题的原因。
你可以参考下面的package.json来看看我用的是什么
axios代码:
axios.post('/login', {username: username, password: password}) /*.then(response => res.redirect('/'))*/ .then(function (response) { console.log(response); }) .catch(function(error) { console.log(error); })
表达方面:我有控制台日志在测试期间提醒自己
server.get('/', (req,res) =>{ console.log("Index"); if (req.user){ console.log("user verified"); res.redirect('/'); app.render(req,res, '/',req.query); } else { console.log("user not logged in"); res.redirect('/login'); } }) server.post('/login', passport.authenticate('local'), (req, res, next) => { if (req.user) { console.log("Logging in"); res.redirect('/'); } else { console.log("Passwrod Incorrect"); return res.redirect('/login'); } })
package.json
{ "name": "layout-component", "version": "1.0.0", "scripts": { "dev": "node ./server.js", "build": "next build", "start": "NODE_ENV=production node ./server.js" }, "dependencies": { "@zeit/next-css": "^0.1.5", "axios": "^0.18.0", "bcryptjs": "^2.4.3", "body-parser": "^1.18.2", "connect-flash": "^0.1.1", "connect-mongo": "^2.0.1", "cookie-parser": "^1.4.3", "express": "^4.16.3", "express-session": "^1.15.6", "express-validator": "^5.1.0", "file-loader": "^1.1.11", "hoist-non-react-statics": "^2.5.0", "jsonwebtoken": "^8.2.0", "mongodb": "^3.0.5", "mongoose": "^5.0.12", "next": "^5.1.0", "passport": "^0.4.0", "passport-local": "^1.0.0", "prop-types": "^15.6.1", "react": "^16.3.0", "react-dom": "^16.3.0", "semantic-ui-css": "^2.3.1", "semantic-ui-react": "^0.79.0", "url-loader": "^1.0.1" }, "license": "ISC" }
我后来想通了这一点。显然,当您发出 Axios post 请求时,您无法从服务器进行重定向。至少不是我这样做的方式(使用默认的 Axios 配置)。您需要在客户端进行页面更改。我是这样做的。
这真的让我很困惑,因为我使用其他方法从重定向路由接收数据,但页面未加载。
此外,由于某种原因使用 Next.js,passport.js“successRedirect”和“failureRedirect”JSON 似乎不起作用。这就是为什么我按照自己的方式编写路由,并且没有将其包含在 Passport.authenticate() 函数中。我希望这对某人有帮助!
我的axios提交功能:
我的 Express 服务器中的 post 请求