일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- 공부
- Instantiation Patterns
- 리액트
- vscode
- 취업
- react
- 포스기
- 연습
- 일상
- array
- grpahQL
- nqueens
- this
- 개발
- 알고리즘
- 해커톤
- method
- 코드스테이츠
- ftech
- 초보
- 클라이언트
- 자바스크립트
- JavaScript
- 제일어려워
- JS
- underscores
- underbar
- DOM
- 코딩
- 엔퀸즈
- Today
- Total
analogcoding
7/30 - 4주 프로젝트 / GraphQL , JWT , PASSPORT 본문
Toy 40번 문제. 200p 만들기
1p piece 2p piece 5p piece 10p piece 20p piece 50p piece £1 (100p) £2 (200p) 로
200p 를 만들 수 있는 경우의 수를 모두 구하는 문제. 구현 실패.
graphQL 에서 JWT 를 미들웨어로 사용하는 부분을 해결했다.
graphQL 에서 middleware 분기를 하면서 생긴 문제점은 먼저 restful 과 차이점에 있다.
restful API 의 경우 특정 endpoint 마다 선택적으로 middleware 를 흘려줄 수 있었지만 graphQL 은 하나의 endpoint 만이 존재한다.
이 문제에 대해서 2가지의 해결방안이 나왔다.
첫번 째는 미들웨어에 배열에 resolver 를 담아주는 방법.
이 방법은 마땅한 레퍼런스를 찾지 못했고 시도했지만 번번히 실패했다. 이제 막 graphQL 을 접한지라 문법 자체를 읽는데 어려움이
컸다.. 부족한 내 실력 탓.. 참고한 레퍼런스의 일부만 첨부한다.
yarn add graphql-middleware
function applyMiddlewareToDeclaredResolvers(
schema: GraphQLSchema,
...middleware: (IMiddleware | MiddlewareGenerator)[]
): GraphQLSchema & {
schema?: GraphQLSchema
fragmentReplacements?: FragmentReplacement[]
}
두번 째는 token 을 verify 하는 과정에서 토큰이 있을 때와 없을 때 , 다를 때 세 가지의 경우를 분기해주고 최종적으로
필요한 부분은 resolver 함수에서 확인하는 방법이다. 이 방법은 처음에 얘기가 나왔던 방법이지만 효율적이지 못하다고 생각했고
어느 부분에서 시도를 해야할 지 정확히 감을 잡지 못했었지만 결국 이 방법을 택해서 해결하게 되었다.
클라이언트에서 토큰에 header에 "x-jwt" 라는 키의 값으로 토큰을 담아보내면 상태에 따라 값을 리턴하는 것을
graphQL playground 에서 확인했다.
export const decodeJWT = token => {
return jwt.verify(token, process.env.PRIVATE_KEY, (err, decode) => {
if (err) {
// console.log("decode 함수에서 에러 발생");
return err;
}
// console.log("decode 함수에서 에러 없음");
return decode.nickName;
});
};
이처럼 토큰 verify 에서 유효한 토큰인 지를 검사해주고
const JWT = async (req, res, next) => {
const token = req.get("x-jwt");
// 요청에서 토큰을 찾는다??
if (!token) {
// console.log("미들웨어에서 겟한 토큰이 없음");
return next();
// 없다면 패쓰
}
// else console.log("미들웨어에서 겟한 토큰-->", token);
try {
const nickName = await decodeJWT(token);
req.nickName = nickName;
// console.log(req.nickName);
return next();
// 있다면 에러처리하고 패쓰!
} catch (error) {
console.log("err");
return error;
}
};
middleware 로 토큰이 없을 때와 있을 때 , 에러가 발생할 때를 분기해서 req 에 토큰화 되기 전 값을 담아서 next() 로 넘겨주었다.
Kakao passport 구현 중
passport DOCS 를 보면서 현재 console 로 내 데이터가 넘어오는 것 까진 확인했다.
이제 넘어온 데이터를 이용해서 회원가입과 로그인을 구현할 일만 남았다. 내일도 화이팅!
'Be well coding > In Immersive' 카테고리의 다른 글
8/1 - 4주 프로젝트 (0) | 2019.08.01 |
---|---|
7/31 - 4주 프로젝트 (0) | 2019.08.01 |
7/29 - 4주 프로젝트 (0) | 2019.07.29 |
7/27 - 4주 프로젝트 (0) | 2019.07.27 |
7/26 - 4주 프로젝트 (0) | 2019.07.26 |