8/6 - 4주 프로젝트

Toy 46번 문제.

to do later..

---

 

토큰이 검증이 안되는 문제가 발생했다. 문제는 콘솔에 찍힌 토큰을 복사해서 playground 에서는 작동이 되는 것이다..

 

잠시 헤매이다가 발견한 실수는 .. 팀원분께서 친히 stringify 를 해서 저장을 해주셔서 typeof 로 보았을 때는 같은 string 이지만

 

인증과정에서 에러를 뿜어냈다. 작은 헤프닝으로 마무리..ㅋㅋ 콘솔애는  큰 따옴표가 하나였는데..

 

( JSON은 쉼표로 모호하지 않으며 Javascript로 직접 실행되거나 JSON으로 구문 분석 될 수 있다.)

 

---

오늘 프로젝트에서 한 가장 큰? 일은 유저의 각 mypage 별로 고유 id 값을 params 로 url 의 endpoint 로 주는 작업이었다.

 

react route 에서 props 를 넘겨줄 방법을 찾아보다가 시도하게 되었다. 각 페이지에서 자신의 토큰으로 내 프로필인지 , 다른 사람의

 

프로필인지를 판단하여 개인정보를 수정하거나 정보를 제한하는 로직을 작성했다.

 

 

먼저 최상단 컴포넌트에서 route 분기한  mypage 에 params 를 변수로 지정해준다.

<Route exact={true} path={'/mypage/:id'} component={Mypage} />

링크로 이동할 공간에서 유저 고유의 id 값을 변수로 넣어준다.

<Link to={`/mypage/${data.getMe.user.id}`} />

각각의 링크를 가지게 되는 mypage 에서 props 로 각 id 에 접근할 수 있다. 받아온 id 를 인자로 서버에 Query 요청

class Mypage extends Component<MyProps> {
  constructor(props: any) {
    super(props);
    console.log('this is personal id!!!!!!!!!', props.match.params.id);
    console.log('this is props!!!!!!!!!', props);
  }

23번 유저의 페이지가 렌더된다. 접속한 유저의 토큰 ( 고유 id 로  create 한 토큰 ) 을 decode 해서 본인 확인 후 삼항연산자로 리턴!