Breaking News: Grepper is joining You.com. Read the official announcement!

Next JS Protected Route

Add Answer

Readul Ahmed answered on December 7, 2020 Popularity 10/10 Helpfulness 2/10

answer Next JS Protected Route

related nextjs private routes

related next js protected routes

Next JS Protected Route

Comment

// contexts/auth.js
// append this new bit a the end: 

export const ProtectRoute = ({ children }) => {
  const { isAuthenticated, isLoading } = useAuth();
  if (isLoading || (!isAuthenticated && window.location.pathname !== '/login')){
    return <LoadingScreen />; 
  }
  return children;
};

// _app.js
import React from 'react'
import { ProtectRoute } from '../contexts/auth'

function MyApp({ Component, pageProps }: AppProps) {

    return (
      <AuthProvider>
        <ProtectRoute>
            <Component {...pageProps} />
        </ProtectRoute>
      </AuthProvider>
    )
}


export default MyApp

Popularity 10/10 Helpfulness 2/10 Language javascript

Source: Grepper

Tags: javascript next protected

Link to this answer
Share Copy Link

Contributed on May 03 2023

Readul Ahmed

0 Answers Avg Quality 2/10

Closely Related Answers

nextjs private routes

Comment

npm i next-shield

Popularity 10/10 Helpfulness 3/10 Language javascript

Source: imjulianeral.github.io

Tags: javascript j

Link to this answer
Share Copy Link

Contributed on Dec 28 2022

Frightened Fish

0 Answers Avg Quality 2/10

next js protected routes

Comment

export async function getServerSideProps({ req, res }) {
  const { Auth } = withSSRContext({ req })
  try {
    const user = await Auth.currentAuthenticatedUser()
    return {
      props: {
        authenticated: true,
        username: user.username
      }
    }
  } catch (err) {
    res.writeHead(302, { Location: '/profile' })
    res.end()
  }
  return {props: {}}
}

export default Protected

Popularity 10/10 Helpfulness 2/10 Language javascript

Source: dev.to

Tags: javascript j

Link to this answer
Share Copy Link

Contributed on Dec 07 2020

Mystic Dev

0 Answers Avg Quality 2/10

Next JS Protected Route

Contents

More Related Answers

Next JS Protected Route

Closely Related Answers

nextjs private routes

next js protected routes

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.