최종 프로젝트(결제API)(1)

Jo-Jun_yeong·2024년 10월 24일

아임포트를 이용한 결제 구축

스토어 아이디

스토어 아이디(Store ID)란?

포트원 가입 시 [대표 상점]이 생성되며, 자동으로 생성되는 고유값 입니다.
추가로 하위 상점을 생성하는 경우 상점마다 고유하게 부여됩니다.
결제창 연동 시 사용되며, 결제 호출 시 storeId 파라미터에 해당 값을 넣어야 합니다.
기술 문의 시 해당 값을 공유해 주시면 빠르게 문제 해결을 도와드릴 수 있습니다.

API Secret

API Secret이란?

API 사용 시 Authorization 헤더 인증을 위해 사용되는 값입니다.

API Secret을 발급받으신 후, 선호하는 인증 방식 을 선택하여 API를 사용하실 수 있습니다.

Open API JSON

API 결제, 결제 정보 조회, 결제 취소 등의 기능을 제공하는 REST API입니다.
https://developers.portone.io/api/rest-v2?v=v2
V2 API hostname: api.portone.io

https환경 만들기

보안상의 이유로 'http'환경에서는 결제모듈이 실행되지않는다고 한다. 따라서 react를 실행했을 때 https환경으로 만들어주어야한다.

chocolatery

mac환경의 homebrew같은 기능의
'Chocolatey' 를 설치해야한다.

설치를위한 기본 요구사항

Windows7 이상 / Windows Server 2003이상

PowerShell v2이상

.Net Framework4이상

Window Powershell 관리자 권한으로 실행

ExecutionPolicy 실행

이 명령어는 Window의 실행정책(ExecutionPolicy)을 확인하는 명령어 이다.
Restricted
는 어떠한 스크립트도 실행시키지않는 설정이다.
set-ExecutionPolicy AllSigned
로 변경할 수 있고
Get-ExecutionPolicy -List
로 각 범위마다 적용된 실행정책을 볼 수 있고
Get-ExecutionPolicy
로 현재 세션에 적용된 실행정책을 볼 수 있다.
3.
Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString('https://community.chocolatey.org/install.ps1'))
설치 완료 화면
해당 코드 입력
4. 설치 확인 -> choco를 입력하면 설치 완료

설치 완료

mkcert

mkcert는
https를 사용하기위해서 필요한 ssl인증서를 생성하는 도구이다.
로컬개발환경에서 자체 성명된 SSL?TLS 인증서를 생성하는 도구인 mkcert를 통해 인증서를 생성하자.

위에서 설치한 choco를 통해 설치

choco install mkcert

그리고 https를 적용할 프로젝트 최상위 디렉토리에서 명령어를 샐행시켜준다.

mkcert -install
mkcert localhost

~~나는 back과 front가 있는 zero폴더에 설치했다.~~
/ npm을 시작할 수 있는 front에 재설치 했다.
재설치시에 mkcert localhost로 pem파일을 새로만들어줬다.
/
주의할점은 이렇게 만들어진 pem은 위의 과정을 작업한 컴퓨터에서만 인증기관이 설치되어있기 때문에 git에 올려두어도 관련이없고, key파일들은 항상 보안과 관련 있으니 .gitignore를 등록해서 git에 들어가지 않도록 한다.

쉽게 관리하도록 cert폴더를 만들어서 관리한다

실행 구성
package.json에 script부분을 구성하고
Mac OS 와 Windows의 실행 명령어가 다르다.

"scripts": {
  "start": "react-scripts start",
  "start:mac": "HTTPS=true SSL_CRT_FILE=cert/localhost.pem SSL_KEY_FILE=cert/localhost-key.pem npm run start",
  "start:windows": "set HTTPS=true&&set SSL_CRT_FILE=cert/localhost.pem&&set SSL_KEY_FILE=cert/localhost-key.pem&&npm run start"
}

대충보지말고 경로는 잘 확인하고 추가하여 실행하자.