作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在构建 nextjs 应用程序的用户身份验证部分。除了 protected 路线,我已经完成了大部分工作。我正在尝试处理 _app.js 中的 auth 部分。这是文件:
import App from 'next/app'
import '../styles/globals.css'
import { parseCookies } from 'nookies'
import { redirectUser } from '../utils/auth'
import jwt from 'jsonwebtoken'
class MyApp extends App {
static async getInitialProps({ Component, ctx }) {
const { token } = parseCookies(ctx)
let pageProps = {}
if (Component.getInitialProps) {
pageProps = await Component.getInitialProps(ctx)
}
if (!token) {
const isProtectedRoute = ctx.pathname === '/account'
if (isProtectedRoute) {
redirectUser(ctx, '/login')
}
} else {
try {
const verified = jwt.verify(token, process.env.JWT_SECRET)
} catch(err) {
console.error(err)
redirectUser(ctx, '/login')
}
}
return { pageProps }
}
render() {
const { Component, pageProps } = this.props;
return (
<Component {...pageProps} />
)
}
}
export default MyApp
还有我的 redirectUser 文件:
import cookie from 'js-cookie';
import Router from 'next/router';
export function handleLogin(token) {
cookie.set('token', token)
Router.push('/account');
}
export function redirectUser(ctx, location) {
if (ctx.req) {
ctx.res.writeHead(302, { Location: location })
ctx.res.end()
} else {
Router.push(location)
}
}
当用户没有 token 时,auth 部分会正确重定向,但如果该 token 被更改为无效,我会收到重定向错误:
The page isn’t redirecting properly
Firefox has detected that the server is redirecting the request for this address in a way that will never complete.
我已经确认这是第二个
redirectUser
导致此错误的调用。即使我将它放在 getInitialProps 函数底部的 else 条件之外,我也会得到相同的结果。
最佳答案
您收到该错误是因为您最终触发了到 /login
的无限重定向循环。页。
使用无效 token 登陆任何页面将重定向到 /login
页。当这个重定向发生时,它会触发另一个 App.getInitialProps
调用最终会导致另一个重定向到 /login
页面,因为 token 仍然无效,依此类推。
您可以通过在当前页面是 /login
时添加检查来防止这种行为。页。这可以通过多种方式处理,但我将在这里留下一个例子。
if (!token) {
const isProtectedRoute = ctx.pathname === '/account'
if (isProtectedRoute) {
redirectUser(ctx, '/login')
}
} else if (ctx.pathname !== "/login") { // To avoid redirect loop
try {
const verified = jwt.verify(token, process.env.JWT_SECRET)
} catch(err) {
console.error(err)
redirectUser(ctx, '/login')
}
}
关于node.js - Nextjs 在 _app.js 中重定向 'The page isn’ t 正确重定向',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66285617/
我是一名优秀的程序员,十分优秀!