[API] 금융결제원 API 활용하기 #3. 사용자 정보 조회 API

.사용자정보조회 API

- 마찬가지로 명세서를 꼼꼼히 읽어보는게 좋다.

  사용자의 고객정보 및 계좌목록을 조회하는 API 이다.

요청 메시지에서 Authorization 은 Bearer(token type) + <access_token> 인데

이 access_token 은 사용자 토큰 발급과정에서 받은 토큰 정보다.

access_token 을 받으면서 user_seq_no 을 같이 받았는데 그 정보를 입력해주면 된다.

바로 코드를 작성하는 것 보다 postman 을 통해 

request 과정에서 데이터가 잘 전달되었는지, 그리고 그에 대응하는 response 가 잘 오는지

확인해주는게 코드 작성에 편리하다.

요청 메시지 명세에 따라 Header 와 Parameter 를 적절하게 채워보자.

여기서 출력되는 계좌목록은 가입 시 등록한 계좌 정보다.

등록된 계좌의 핀테크이용번호, 계좌별명 .. 등등 잘 응답이 되었다.

명세서의 응답 메시지 명세를 보면서 각각의 항목이 무엇을 의미하는지 확인해보는 것도 좋다.

여기서 등록된 계좌의 핀테크 이용번호가 가장 중요할 것 같다.

request 와 response 가 잘 동작하는 것을 확인하였으니 그대로 코드로 옮기면 된다.

먼저 사용자정보조회 API 사용에 대한 예를 들면,

사용자가 로그인에 성공하면 /main page 로 이동하게 되고,

/*
login.ejs
*/
 
    //...
 
    success:function(data){
        if(data == '사용자가 없습니다.' || data == '패스워드가 다릅니다'){
            alert(data);
        }
        else {
            sessionStorage.setItem('ourToken', data);
            window.location.href = '/main'
        }
    }
 
    // ...

line 11~14) 로그인에 성공하면

line 13) main page 로 이동

/main page 에서는 사용자의 jwtToken을 확인하여 사용자정보조회 API 요청을 하게 된다.

<!--
main.ejs
-->
 
    <!-- ... -->
 
    <script>        
        var jwtToken = sessionStorage.getItem('ourToken')
        console.log(jwtToken);
        if(jwtToken == ""){
            alert("로그인해주세요")
            window.location.href = '/login'
        }
        fetchUserData();
        function fetchUserData(){
            $.ajax({
                url:'/list',
                type : 'POST',
                headers : {
                    'ourtoken' : jwtToken
                },
                success:function(data){
                    console.log(data.res_list);
                    for(var i=0; i < data.res_list.length; i++){
                        $("#cardList").append(
                            '<div class="balance-card mb-15">'+ i +
                                '<div class="d-flex align-items-center">'+
                            '<div class="d-flex flex-grow">'+
                                    '<div class="mr-auto">' +
                                            '<h1 class="b-val">'+data.res_list[i].account_alias+'</h1>'+
                                        '<p class="g-text mb-10">'+data.res_list[i].fintech_use_num+'</p>'+
                                            '</div>'+
                                    '<div class="ml-auto align-self-end">'+
                                            '<a href="/balance?fin_use_num='+data.res_list[i].fintech_use_num+'">잔액조회</a>'+"||||"+
                                            '<a href="/qrcode?fin_use_num='+data.res_list[i].fintech_use_num+'">QR생성</a>'+
                                            '</div>'+
                                            '</div>'+
                                            '</div>'+
                                    '</div>'
                        )
                    }    
                }
            })
        }
    </script>    
 
    <!-- ... -->

line 8) 세션에 있는 jwtToken 을 받아와서

line 10) 토큰이 존재하지 않을 경우 로그인이 필요한 상황

line 14~44) 토큰이 존재할 경우

line 17~21) '/list' 서버로 jwtToken을 전달

line 22) 응답 메시지가 제대로 수신된 경우, 사용자 계좌목록 리스트를 화면에 출력

/list 에서는 main.ejs 에서 받은 jwtToken 을 이용하여 사용자 정보 조회 API 에 요청

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 32

/* Server.js */   // 계좌 리스트 불러오기 app.post('/list', auth, function(req, res){     var userId = req.decoded.userId;        var sql = "SELECT * FROM user WHERE id = ?";       connection.query(sql,[userId], function(err, result){            if(err) throw err;                  var accesstoken = result[0].accesstoken;         var userseqno = result[0].userseqno;           var option = {             method : "GET",             url : "https://testapi.openbanking.or.kr/v2.0/user/me",             headers : {                 'Authorization' : 'Bearer ' + accesstoken             },             // post방식은 qs, get방식은 form             qs : {                 user_seq_no : userseqno             }         }         request(option, function (error, response, body) {             console.log(body);             var requestResultJSON = JSON.parse(body);             res.json(requestResultJSON)         });     }) }) Colored by Color Scripter

cs

line 7) 사용자의 ID를 req로 받고

line 8) DB를 통해 해당 사용자 정보 확인

line 12~13) request 과정에서 필요한 사용자 정보를 변수에 저장

line 15~25) 사용자정보조회 API 를 활용하여 사용자의 계좌목록을 조회

명세서에 적힌대로, 그리고 postman 으로 확인할 때 작성한 정보 그대로 넣어주면 된다.

아래 그림과 같은 형태로 사용자의 계좌목록을 출력해 줄 수 있다.

[API] 금융결제원 API 활용하기 #1.앱 등록 및 Key 발급, 사용자 토큰 발급

[API] 금융결제원 API 활용하기 #2. 로그인(jsonwebtoken)

[API] 금융결제원 API 활용하기 #3. 사용자 정보 조회 API

[API] 금융결제원 API 활용하기 #4. 잔액조회 API

[API] 금융결제원 API 활용하기 #5. 거래내역조회 API

[API] 금융결제원 API 활용하기 #6. 계좌 QR코드 생성