Iamport
결제 API
카드 결제 / 계좌 이체 / 무통장 입금 / 정기 결제
각각을 따로 만들려면 시간과 노력이 많이 든다.
결제대행 회사(PG사, Payment Gateway)
결제 솔루션 회사(ex 아임포트, 부트페이)가 PG사와 연결을 해놓고 api를 만들어 놓고 사용자에게 제공한다.
PG사 뒤에는 카드사가 있고 최종 결제는 카드사에서 이루어 진다.
창업을 한다고 하면 결제 프로세스 때문에 아무리 빨라도 최소 2달은 걸리게 된다.
'다날'이라는 PG사의 본인인증 서비스
결제로직 가져오기
가맹점 식별코드 넣기
SDK 최신버전
결제창 띄우고 결제까지 완료된다!
포트폴리오는 imp49910675로 테스트하기
모바일 화면을 여는 방법?
모바일 화면에서 결제창을 열면?
1. 어디로 돌아갈 것인가? 돌아갈 주소 필요 => m_redirect_url을 추가
2. mutation을 어떻게 날릴 것인가? => 웹훅노티피케이션 활용
페이지가 전환되어버렸기 때문에 아랫부분을 다 잃어버리게 됨.
모바일 웹에서 결제 (주소O) => 핸드폰에서 크롬브라우저를 열고 접속한 사이트에서 결제하는 방식
모바일 앱에서 결제 (주소X, 숨겨져있다.) => 구글결제
m_redirect_url: 결제가 끝나고 이 페이지로 돌아온다.
독스에 나와있다.
아이포트에서 우리 백엔드로 쏴준다!
Advanced-Date-Issue
결제 시간
결제한 날짜를 new Date()로 넘겨주는 이 방법은 문제가 많다.
어디서 new Date()를 했느냐에 따라서 다른 시간이 들어갈 수 있다.
프론트에서는 new Date()를 하지 않는다.
엄밀히 말하면 서버에는 보내면 안되는 방법!!
서버에서 받은 날짜를 new Date()해서 예쁘게 보이게끔 하거나 혹은 시간을 비교하고 싶다거나 할 때 사용했지만 날짜를 보여주는 것에는 적합하지 않을 수 있다.
브라우저에서 받은 시간을 기점으로 백엔드에서 만들어서 보내주는데, 이 시간을 동기화 해주는 서버가 있다. => NTP서버
각기 다른 나라의 클라이언트 서버가 다 다른데, 이것을 어떻게 맞출 것인가?
DB에 들어오는 시간을 UTC시간이라고 한다.
UTC시간을 기준으로 +-해서 보여주게 된다.
그리고 이것을 도와주는 시간관련 라이브러리가 있다. (ex moment.js)
이러한 라이브러리는 하나의 언어라고 봐도 될 정도로 유명하고 Docs를 보며 공부할만한 가치가 있다.
https://momentjs.com/docs
- 사용자가 버튼클릭 마우스 클릭 등으로 이벤트 발생
- 모두가 가만히 있는데, 특정 시간에 자동으로 이벤트 발생 => 크론탭
크론탭은 api를 대신 실행해준다. 대신 프로그램을 실행시켜줄 수도 있다.
EventLoop / TaskQueue
setTimeout()이 사기 ?
setTimeout, setInterval은 사실 올바르지 않다!
SetTimeout이 바로 실행되지 않는 걸 확인 할 수 있다.
Stack : 먼저 들어온 것이 마지막에 나감
Queue : 먼저 들어온 것이 먼저 나감
Call Stack, TaskQueue라고 하는 이것들은 바로 실행이 되는 것이 아니라 (편의상) Background에서 실행이 된다. (webAPI라고도 부름)
바깥쪽에서 기다리고있다가 해당하는 시간이 들어오면 결과를 처리해주어야 하는 것들(api 등) 이 Queue로 들어와서 차곡차곡 쌓여서 CallStack이 비워지면 그 때 하나씩 꺼내와서 실행이 된다.
=> 기다리는 시간이 없는 것들이 먼저 CallStack에서 실행되고 비워지고 나면 CallStack으로 이동하여 실행
이렇게 빙글빙글 돌게되는 것을 이벤트 루프라고 하고,
이벤트 루프를 도와주는 일꾼(쓰레드)을 이벤트 루프 쓰레드라고 한다.
혼자 일하기 때문에 싱글 이벤트루프 쓰레드라고도 함.
웹브라우저에 있는 함수들 setTimeout, axios 등, 라이브러리 임포트 함수들 사용할 때도 API라고 함.
TaskQueue는 매크로 테스크 큐, 마이크로 테스크 큐로 나뉜다. => 다음시간에 알아보자.
쓰레드
프로세스, 쓰레드로 나뉜다.
하나의 프로그램: 프로세스
일꾼 : 쓰레드 (프로그램을 실행시켜주는)
자바스크립트는 싱글 쓰레드라고 부른다.
일꾼 한 마리로 처리가 가능하다.
다른 언어는 일꾼이 여러마리(멀티 쓰레드)
일반적인 언어들은 대부분 멀티쓰레드다.
싱글쓰레드라고 할 때 일꾼 하나가 있다.
예를들어 뮤테이션을 요청한다거나 axio를 요청하는데 다른 함수 다른 버튼은 클릭 안되고 기다림.(모든 버튼 블락, 일꾼이 하나밖에 없기 때문에)
자바스크립트에서 이것을 해결한 방법? => 이벤트 루프 방식
context-switching
다른 언어 같은 경우에는 멀티 쓰레드, 코드를 사용해서 일꾼을 만든다.
일꾼들이 함수를 실행한다고 했을 때, 여러가지 일이 가능하다.
엄밀히 말하면 동시에 처리하는 것은 아니다.
일꾼이 4개라고 해도 속도가 빠르기 때문에 동시에 처리하는 것처럼 보일 뿐, 동시에 처리하는 것은 아니다.
그럼에도 불구하고 멀티 쓰레드를 사용하는 이유 ?
=> 다른 기능들이 블락되지 않기 때문
진짜로 동시에 처리되게 하고 싶으면 ?
=> CPU가 각각 있어야 한다. ( CPU 병렬 처리 )
