in206240781

<p>저도 고민하다가</p>
<p>https://www.inflearn.com/questions/36142</p>
<p>위 링크에 답변단 것 처럼 해결했는데</p>
<p>페이지 마다 조건처리 해줘야 하는지 궁금해요..</p>
<p>아니면 다른 방식이 있을까요</p>

HOC 관련 질문입니다.

<p>제가 한 유효시간 적용시킨 코드 공유합니다.</p>
<p>토큰 만들 때 인자로 유효시간 넘겨줄 수 잇더라고요</p>
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">
<div>&nbsp;<span style="color: #569cd6;">var</span>&nbsp;<span style="color: #9cdcfe;">token</span>&nbsp;=&nbsp;<span style="color: #9cdcfe;">jwt</span>.<span style="color: #dcdcaa;">sign</span>({<span style="color: #9cdcfe;">id</span><span style="color: #9cdcfe;">:</span>&nbsp;<span style="color: #9cdcfe;">user</span>.<span style="color: #9cdcfe;">_id</span>.<span style="color: #dcdcaa;">toHexString</span>()},<span style="color: #ce9178;">'secretToken'</span>,&nbsp;{<span style="color: #9cdcfe;">expiresIn</span><span style="color: #9cdcfe;">:</span>&nbsp;<span style="color: #ce9178;">'1h'</span>});</div>
</div>
<p>적용하면 auth 권한 확인하는 곳에서 오류가 날 수 있는데</p>
<p>아래 처럼 수정햇어요</p>
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">
<div><span style="color: #9cdcfe;">jwt</span>.<span style="color: #dcdcaa;">verify</span>(<span style="color: #9cdcfe;">token</span>,&nbsp;<span style="color: #ce9178;">'secretToken'</span>,&nbsp;<span style="color: #569cd6;">function</span>(<span style="color: #9cdcfe;">err</span>,&nbsp;<span style="color: #9cdcfe;">decoded</span>){</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #6a9955;">//&nbsp;복호화된&nbsp;토큰&nbsp;decoded</span></div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #c586c0;">if</span>(<span style="color: #9cdcfe;">decoded</span>){</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #9cdcfe;">user</span>.<span style="color: #dcdcaa;">findOne</span>({<span style="color: #ce9178;">"_id"</span><span style="color: #9cdcfe;">:</span><span style="color: #9cdcfe;">decoded</span>.<span style="color: #9cdcfe;">id</span>,&nbsp;<span style="color: #ce9178;">"token"</span><span style="color: #9cdcfe;">:</span><span style="color: #9cdcfe;">token</span>},&nbsp;<span style="color: #569cd6;">function</span>(<span style="color: #9cdcfe;">err</span>,&nbsp;<span style="color: #9cdcfe;">user</span>){</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #c586c0;">if</span>(<span style="color: #9cdcfe;">err</span>)&nbsp;<span style="color: #c586c0;">return</span>&nbsp;<span style="color: #dcdcaa;">cb</span>(<span style="color: #9cdcfe;">err</span>);</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #dcdcaa;">cb</span>(<span style="color: #569cd6;">null</span>,&nbsp;<span style="color: #9cdcfe;">user</span>);</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;})</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}<span style="color: #c586c0;">else</span>{</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #dcdcaa;">cb</span>(<span style="color: #569cd6;">null</span>);</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div>
</div>
<p></p>
<p></p>

로그아웃 관련 질문 있습니다.

<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">
<div>
<div style="line-height: 19px;"><span style="color: #c586c0;"> import</span>&nbsp;{<span style="color: #9cdcfe;">useSelector</span>}&nbsp;<span style="color: #c586c0;">from</span>&nbsp;<span style="color: #ce9178;">'react-redux'</span></div>
</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #569cd6;">const</span>&nbsp;<span style="color: #4fc1ff;">user</span>&nbsp;=&nbsp;<span style="color: #dcdcaa;">useSelector</span>(<span style="color: #9cdcfe;">state</span>&nbsp;<span style="color: #569cd6;">=></span>&nbsp;<span style="color: #9cdcfe;">state</span>.<span style="color: #9cdcfe;">user</span>.<span style="color: #9cdcfe;">userData</span>);</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #9cdcfe;">console</span>.<span style="color: #dcdcaa;">log</span>(<span style="color: #ce9178;">'userselect'</span>,&nbsp;<span style="color: #4fc1ff;">user</span>)</div>
</div>
<p></p>
<p>store에 저장한 state 명이 달라서 그런거 아닐까요?</p>
<p>전 잘되네요..</p>

useSelector를 사용하여 store 값 가져오기

<p>혹시 response 받아오는 페이지에서 import 부분에 response가 자동으로 추가되었는지 확인해보세요~</p>

TypeError: Cannot read property 'prototype' of undefined

<p>저도 이거 해결해보고자 검색 해봤는데</p>
<p>user가 undefined일 때 조건을 줘서 해결했습니다.</p>
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">
<div>&nbsp;&nbsp;<span style="color: #c586c0;">if</span>(<span style="color: #4fc1ff;">user</span>.<span style="color: #9cdcfe;">userData</span>&nbsp;===&nbsp;<span style="color: #569cd6;">undefined</span>){</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #c586c0;">return</span>&nbsp;<span style="color: #569cd6;">null</span>;&nbsp;</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;}<span style="color: #c586c0;">else</span>{</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #c586c0;">if</span>&nbsp;(<span style="color: #4fc1ff;">user</span>.<span style="color: #9cdcfe;">userData</span>&nbsp;&&&nbsp;!<span style="color: #4fc1ff;">user</span>.<span style="color: #9cdcfe;">userData</span>.<span style="color: #9cdcfe;">isAuth</span>&nbsp;)&nbsp;{</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #c586c0;">return</span>&nbsp;(</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #808080;"><</span><span style="color: #4ec9b0;">Menu</span>&nbsp;<span style="color: #9cdcfe;">mode</span>=<span style="color: #569cd6;">{</span><span style="color: #9cdcfe;">props</span>.<span style="color: #9cdcfe;">mode</span><span style="color: #569cd6;">}</span><span style="color: #808080;">></span></div>
</div>
<p>특정 페이지에 권한을 주고 들어가도 redirect 하기 전에 잠깐 보여지는데</p>
<p>이때도 똑같이 적용했어요.. (그런데 권한있는 페이지마다 이렇게 해줘야하는건지..?)</p>
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">
<div>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #c586c0;">if</span>(!<span style="color: #9cdcfe;">props</span>.<span style="color: #9cdcfe;">user</span>.<span style="color: #9cdcfe;">userData</span>.<span style="color: #9cdcfe;">isAuth</span>){</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #c586c0;">return</span>&nbsp;<span style="color: #569cd6;">null</span>;</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;}<span style="color: #c586c0;">else</span>{</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #c586c0;">return</span>&nbsp;(</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #808080;"><</span><span style="color: #569cd6;">div</span>&nbsp;<span style="color: #9cdcfe;">style</span>=<span style="color: #569cd6;">{</span>{&nbsp;<span style="color: #9cdcfe;">width</span><span style="color: #9cdcfe;">:</span>&nbsp;<span style="color: #ce9178;">'100%'</span>&nbsp;}<span style="color: #569cd6;">}</span><span style="color: #808080;">></span></div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #569cd6;">{</span><span style="color: #9cdcfe;">console</span>.<span style="color: #dcdcaa;">log</span>(<span style="color: #ce9178;">"engine&nbsp;landing"</span>)<span style="color: #569cd6;">}</span></div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #808080;"><</span><span style="color: #4ec9b0;">Layout</span>&nbsp;<span style="color: #9cdcfe;">style</span>=<span style="color: #569cd6;">{</span>{&nbsp;<span style="color: #9cdcfe;">padding</span><span style="color: #9cdcfe;">:</span>&nbsp;<span style="color: #ce9178;">'0&nbsp;24px&nbsp;24px'</span>,&nbsp;<span style="color: #9cdcfe;">overflow</span><span style="color: #9cdcfe;">:</span>&nbsp;<span style="color: #ce9178;">'auto'</span>&nbsp;}<span style="color: #569cd6;">}</span><span style="color: #808080;">></span></div>
</div>

로그인전 메뉴를 선택했을때...

<p>전 loadmoreHandler에 body안에 Filter 추가해줬더니 되네요.</p>
<p>loadmore에 필터가 없어서 조건없이 모든 데이터를 가져와서 자르는 것 같아요</p>
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">
<div><span style="color: #569cd6;">const</span>&nbsp;<span style="color: #dcdcaa;">loadmoreHandler</span>&nbsp;=&nbsp;()&nbsp;<span style="color: #569cd6;">=></span>&nbsp;{</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #569cd6;">let</span>&nbsp;<span style="color: #9cdcfe;">skip</span>&nbsp;=&nbsp;<span style="color: #4fc1ff;">Skip</span>&nbsp;+&nbsp;<span style="color: #4fc1ff;">Limit</span>;</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #569cd6;">let</span>&nbsp;<span style="color: #9cdcfe;">body</span>&nbsp;=&nbsp;{</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #9cdcfe;">skip</span><span style="color: #9cdcfe;">:</span>&nbsp;<span style="color: #9cdcfe;">skip</span>,</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #9cdcfe;">limit</span><span style="color: #9cdcfe;">:</span>&nbsp;<span style="color: #4fc1ff;">Limit</span>,</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #9cdcfe;">loadMore</span><span style="color: #9cdcfe;">:</span>&nbsp;<span style="color: #569cd6;">true</span>,</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #9cdcfe;">filters</span><span style="color: #9cdcfe;">:</span>&nbsp;<span style="color: #4fc1ff;">Filters</span></div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #dcdcaa;">getProducts</span>(<span style="color: #9cdcfe;">body</span>);</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #dcdcaa;">setSkip</span>(<span style="color: #9cdcfe;">skip</span>);</div>
<div>&nbsp;&nbsp;&nbsp;}</div>
</div>

질문있습니다!

Service Account 없을 때 해결 방법

<p>아래 질문 글에도 있지만&nbsp;</p>
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color: #569cd6;">const</span>&nbsp;<span style="color: #dcdcaa;">renderReplyComment</span>&nbsp;=&nbsp;(<span style="color: #9cdcfe;">parentCommentId</span>)&nbsp;<span style="color: #569cd6;">=></span> {</div>
<p>여기서 {} 대신 () 사용</p>
<p>or</p>
<p>{ return ... }</p>

답글이 눌러도 나오지않습니다.

<p>스크롤바 문제 같은데 왜 발생하는지는 모르겠네요 ㅠㅠ</p>
<p>스크롤바 고정하면 괜찮아 지는데 원인이 뭘까요?</p>
<div style="color: #d4d4d4; font-family: Consolas, 'Courier New', monospace; font-size: 14px; white-space: pre;"><span style="color: #d7ba7d;">body</span>&nbsp;{</div>
<div style="color: #d4d4d4; font-family: Consolas, 'Courier New', monospace; font-size: 14px; white-space: pre;">&nbsp;&nbsp;<span style="color: #9cdcfe;">overflow-y</span>:&nbsp;<span style="color: #ce9178;">scroll</span>;</div>
<div style="color: #d4d4d4; font-family: Consolas, 'Courier New', monospace; font-size: 14px; white-space: pre;">}</div>

영상실행시 영상이 좌우로 떨리네요

<p>제 경우엔 로그에 bcrypt 에러가 떠있어서 로그인이랑 회원가입이 안됐엇어요.. mongoDB 강의 질문에 존님이 올리신 답변 따라하니까 해결되네요</p>

in206240781

Posts