inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

따라하며 배우는 노드, 리액트 시리즈 - 기본 강의

마지막 강의 auth 부분 질문 있습니다

해결된 질문

165

위고잉업

작성한 질문수 3

0

export default function (SpecificComponent,option,adminRoute = null) {
    
    function AuthenticationCheck(props) {

        const dispatch = useDispatch();

        useEffect(() => {

            dispatch(auth()).then(response => {
                
                if(!response.payload.isAuth) {

                    if(option) {
                        props.history.push('/login')
                    }

                }

                else {

                    if(adminRoute && !response.payload.isAdmin){
                        props.history.push('/')
                    }
                    
                    else {
                        props.history.push('/')
                    }
                }

                
        })
        
        }, [])
            
            return(

                <SpecificComponent/>
            
                )
            
        
    }

    return AuthenticationCheck
}

요즘 웹에 빠져서 프론트랑 백엔드 강의를 보는데 재밌는 강의 올려주셔서 감사합니다 !!

궁금한 건  예를들어서 로그인이 필요한 페이지에 로그인 없이 접근한다해도 결국 마지막엔 <SpecificComponent/>

이걸 리턴시켜줘서 렌더링이 될거라고 생각을 했는데요

그런데 useEffect라는 함수를 찾아보면 렌더링이 될 때 특정 작업을 수행해주는 함수라고 했고 느리게 잘 보면 

로그인이 필요한 페이지에 로그인 없이 접근할 때 한 0.2초 정도는 잠깐 페이지가 뜨지만  바로 사이트 접근이 안되더라구요 

그래서 useEffect 함수를 사용해서 return을 통해 랜더링을 하고 인증 확인 절차가 가능한 부분이구나 했는데

위에 있는 코드에서 useEffect 함수를 안쓰고 해도 로그인이 필요한 페이지에 로그인 없이 접근이 안되는 건 같아서요

그럼 결국 if문에 있는 props.history.push 코드가 실행이 되면 밑에 return <SpecificComponent/> 까지 코드가 진행이 안되고 바로 넘어가는거라고 이해해야하나요???

제가 아직 자바스크립트에 대한 이해가 부족해서 이상한 질문일수도 있지만 궁금해서 질문해봅니다

감사합니다!!

nodejs react

답변 2

0

위고잉업

아 lifecycle과 관련된 것이였네요 감사합니다!

0

John Ahn

안녕하세요 김승환님 !  

리액트 사이트에서 가져온 이미지 입니다  여기 보시면  먼저 rendering 된 후에   lifecycle이 돌아가는게 보이죠 ???

그렇기 때문에 먼저 <SpecifiedComponent />가 렌더링 된 후에 useEffect가 실행이 되며 useEffect에서 업데이트된 State가 있다면 그 후에 다시 렌더링이 됩니다 ^^

깃 이메일이랑 비번이 필요하다고 하네요

0

34

1

404 에러

0

101

1

34강 인증 체크에서 element 사용 때문에 에러나시는 분들 이렇게 하심 됩니다.

0

118

1

로그인, 로그아웃, 토근 작동 안 함

0

238

0

9강 오류 어떻게 해결하나요?

0

193

1

localhost 에서 연결을 거부했습니다.

0

1925

4

포스트맨에서 true가 안떠요

0

150

1

왜 안되나요

0

128

1

몽고db 연결 오류가 납니다 위에껀 입력한 코드, 아래껀 터미널이에요

0

243

1

로그아웃 401 에러(Unauthorized)

0

503

2

암호가 해싱되지 않고 입력값 그대로 db에 저장되는 문제

0

148

1

7강중에서

0

162

2

User.findByToken is not a function

0

210

1

루트 디렉토리

0

269

1

useState

0

560

1

프록시 잘 설정했는데도 404 오류 뜨는 분들

5

874

6

webpack 관련 에러 질문

0

218

1

리액트 관련 질문

0

271

1

14강 로그아웃 안됨

0

318

1

mongoDB 데이터 확인하는 법

0

408

1

postman 에러

0

290

1

선생님 리덕스를 사용하면 어떠한 부분이 좋은지 알 수 있을까요?

0

233

1

다음과 같은 에러들이 발생합니다.

0

272

1

14강 로그아웃 기능 구현시 postman에서 Cannot POST 오류가 뜹니다.

0

379

1