Javascript 如何保护服务器中的路由

我进行了身份验证，我使用快速会话和护照。因此，当用户登录时，将在服务器上保存会话。要访问路由，需要此会话。我创建的会话保存在redux store中，当我选中

getInitialProps

时，有

redux store

我想将其用作参考。如果用户未登录，它将重定向到登录页面

，在这种情况下，URL已更改，但我无法访问。

此页面无法工作。localhost已多次重定向您。 试着清理你的饼干。 错误\u太多\u重定向

我不能使用

“下一个/路由器”

，因为路由器只能在客户端访问

\u app.js

import App, { Container } from 'next/app'
import React from 'react'
import withReduxStore from '../lib/with-redux-store'
import { Provider } from 'react-redux'
import { MuiThemeProvider } from '@material-ui/core/styles';
import CssBaseline from '@material-ui/core/CssBaseline';
import JssProvider from 'react-jss/lib/JssProvider';
import getPageContext from '../lib/getPageContext';
import  '../index.css';

class MyApp extends App {
  static async getInitialProps(something){
    const { Component, router, ctx } = something;
    const initialState = ctx.reduxStore.getState();

    if(Object.keys(initialState.auths.admin).length === 0){
      ctx.res.writeHead(302, {
        Location: '/login'
      });
      ctx.res.end();
      res.finished = true;
      return {}
    }
    let pageProps = {}
    if (Component.getInitialProps) {
      pageProps = await Component.getInitialProps(ctx)
    }
    return { pageProps }
  }

  constructor() {
    super();

    this.pageContext = getPageContext();
   
  }
  componentDidMount() {

    // Remove the server-side injected CSS.
    const jssStyles = document.querySelector('#jss-server-side');
    if (jssStyles && jssStyles.parentNode) {
      jssStyles.parentNode.removeChild(jssStyles);
    }
  }

  render() {
    const { Component, pageProps, reduxStore } = this.props
  
    return (
      <Container>
        <Provider store={reduxStore}>
          <JssProvider
            registry={this.pageContext.sheetsRegistry}
            generateClassName={this.pageContext.generateClassName}
          >
            <MuiThemeProvider
              theme={this.pageContext.theme}
              sheetsManager={this.pageContext.sheetsManager}
            >
              <CssBaseline />
              <Component 
              pageContext={this.pageContext} 
              {...pageProps} />
            </MuiThemeProvider>
          </JssProvider>
        </Provider>
      </Container>
    )
  }
}

export default withReduxStore(MyApp)

从“下一个/App”导入应用程序，{Container}
从“React”导入React
从“../lib/with redux store”导入WithRedux store
从“react redux”导入{Provider}
从'@material ui/core/styles'导入{MuiThemeProvider}；
从“@material ui/core/CssBaseline”导入CssBaseline；
从“react jss/lib/JssProvider”导入JssProvider；
从“../lib/getPageContext”导入getPageContext；
导入“../index.css”；
类MyApp扩展了应用程序{
静态异步getInitialProps（something）{
const{Component，router，ctx}=something；
const initialState=ctx.reduxStore.getState（）；
if（Object.keys（initialState.auths.admin）.length==0）{
ctx.res.writeHead（302{
位置：'/login'
});
ctx.res.end（）；
res.finished=true；
返回{}
}
让pageProps={}
if（Component.getInitialProps）{
pageProps=等待组件。getInitialProps（ctx）
}
返回{pageProps}
}
构造函数（）{
超级（）；
this.pageContext=getPageContext（）；
}
componentDidMount（）{
//删除服务器端注入的CSS。
const jssStyles=document.querySelector（“#jss服务器端”）；
if（jssStyles&&jssStyles.parentNode）{
jssStyles.parentNode.removeChild（jssStyles）；
}
}
render（）{
const{Component，pageProps，reduxStore}=this.props
返回(
)
}
}
使用ReduxStore导出默认值（MyApp）

错误“太多重定向”意味着网站一直处于关闭状态 在不同地址之间重定向的方式将永远不会 完成通常这是竞争重定向的结果，一个尝试 要强制HTTPS（SSL）和另一个重定向回HTTP（非SSL）， 或者在www和非www形式的URL之间

在这种情况下，如果Object.keys（initialState.auths.admin）.length==0，则在无限循环中将用户重定向到“/login”