1 분 소요

계속 미루다가 이번에 시간 나서 정리…

작동하지 않는 실시간 채팅

프론트가 따로 없어서 자바스크립트로 html 페이지를 테스트용으로 만들고 VsCode의 Live Server 를 이용해서 가상으로 서버를 띄워서 테스트를 하고 있었다.

근데 나만 웹소켓에서 문제가 생겼었다 😑 나와 같은 윈도우 OS인 팀원과 환경 셋팅을 동일하게 맞춰도 문제가 해결되지 않았다.
네트워크에 대한 지식이 짧다 보니 당장 어떻게 원인을 찾기가 너무 어려웠다..

팀원들 OS가 서로 다르기도 하고 라이브러리 문제등 어차피 할거 도커를 사용하자고 제안했었지만 다른 사람들은 문제가 없어서 우선순위에서 밀렸다.

어차피 도커는 어느정도 할 줄 알아서 도전해볼겸 우분투로 OS환경을 바꿔서 실행했다.

만약 여기서도 웹소켓 문제가 해결 안되면 그냥 도커로 진행하려고 했는데 동일 조건에서 운영체제만 바꾸니 문제가 해결되었다. 아마 내가 깔아놓은 프로그램중에 버그가 있어서 그런거 같았다. ㅜ

왜냐하면 예를 들어 내 노트북에서 어떤 프로그램을 키면 와이파이 5g 의 연결이 끊긴다.. 근데 동일 공유기에서의 2g는 문제가 없다 ㅋㅋㅋㅋ

프론트 부제의 부작용

아무튼 웹소켓 에대한 문제를 해결하고나서 결제 API를 개발하다보니 보안 부분에서 문제가 발생했다.
우선 카카오페이는 보안상 프론트에서 직접 ajax로 작업이 안된다.
프론트가 따로 있다면 프록시 설정이나 axios로 간단하게 해결 가능하지만 VS코드의 Live Server를 사용했을 때는 localhost 나 IP 주소를 모두 개방해도 CORS 이슈가 해결이 불가능했다. 쿠키나 세션을 이용하려고 해도 CORS 문제 때문에 결제를 위한 토큰 정보를 서버에서 처리가 불가능했다.

해결방법

CORS 이슈가 있기는 했지만 로그인할 때 JWT, 토큰을 이용해서 로그인하는 로직 덕분에 사용자가 누군지에 대한 식별은 가능했다.
또한 로그인 부분을 개발할 당시에

-> 핸드폰 번호로 본인인증 -> 본인인증 성공시 아이디가 핸드폰 번호

웬만하면 핸드폰 번호가 중복될 수 있는 경우의 수가 적었기 때문에 해당 환경에 대한 환경을 정리해봤다.

  • 핸드폰 번호 -> 유일한 값 -> 키 값? -> 벨류 값은 결제정보?

핸드폰 번호가 유일하다보니 해시자료구조가 떠올랐고 파이썬에서 딕셔너리를 이용한다면 키 값 = 본인, 벨류는 결제정보 토큰으로 활용한다면 현재 로직에서 시간복잡도의 O(1)이라 성능에 큰 문제가 생기지 않으면서 문제를 해결할 수 있었을 것 같았다.

물론 이전 사용자가 회원가입을 한 상태에서 번호를 바꾼 후 다른 사람이 우연찮게 동일 번호로 새롭게 가입하는 경우 문제가 발생할 수도 있지만 이럴 경우 본인인증 단계에서 이미 문제가 발생한다.

가장 최선인 방법은 프론트를 아예 리액트로 만들어서 테스트하는게 가장 좋긴 하지만 그냥 해시자료구조로 문제를 해결하는 게 지금 당장은 더 효율적이라고 생각했다.

정리하자면 키 값으로 유저 값(핸드폰 번호), 벨류 값으로 payment의 pk 값을 저장해서 카카오톡 결제 인증을 해결했다.

PR 정리

프로그래밍을 하면서 항상 느끼는 점은 지금 당장 필요한 걸 찾는 능력도 중요하지만 알고 있는 게 많을수록 응용할 것도 많아지고 결국 내가 편함..

시간이 없다는 핑계로 필요한 것만 취하다 보면 당장은 효율적인 것 같지만 문제가 생겨 막힐 때 결국 힘든건 나다 ㅜㅜ
시간 날 때 프론트도 배워놔야겠다.

댓글남기기