[rest api 예제] node.js- 카카오 로그인, 카카오 친구목록 조회, 메시지 발송

node.js로 “카카오 로그인, 카카오 카카오 친구목록 조회, 메시지 발송” 테스트 해볼 수 있는 간단한 예제입니다.

demo20240112.zip (3.2 KB)

[실행방법]

  1. localhost 웹서버에 demo.html을 복사합니다.
  2. 내 애플리케이션 > 앱 설정 > 요약 정보 > "REST API 키"를 복사해서 demo.js 파일 client_id 변수에 설정합니다.
  3. 내 애플리케이션>제품 설정>카카오 로그인 > Redirect URI에 http://localhost:4000/redirect 주소를 설정합니다.
  4. node로 demo.js 를 localhost:4000으로 실행합니다.

[실행결과]

demo.js

const express = require("express");
const session = require("express-session");
const cors = require("cors");
const qs = require("qs");
const axios = require("axios");
const app = express();
const port = 4000;
const client_id = "";
const redirect_uri = "http://localhost:4000/redirect";
const token_uri = "https://kauth.kakao.com/oauth/token";
const api_host = "https://kapi.kakao.com";
const client_secret = "";
const origin = "http://localhost";
app.use(
    session({
        secret: "your session secret",
        resave: false,
        saveUninitialized: true,
        cookie: {secure: false},
    })
);
let corsOptions = {
    origin: origin,
    credentials: true,
};
app.use(cors(corsOptions));

app.get("/authorize", function (req, res) {
    let {scope} = req.query;
    let scopeParam = "";
    if (scope) {
        scopeParam = "&scope=" + scope;
    }
    res
        .status(302)
        .redirect(
            `https://kauth.kakao.com/oauth/authorize?client_id=${client_id}&redirect_uri=${redirect_uri}&response_type=code${scopeParam}`
        );
});

async function call(method, uri, param, header) {
    try {
        rtn = await axios({
            method: method,
            url: uri,
            headers: header,
            data: param,
        });
    } catch (err) {
        rtn = err.response;
    }
    return rtn.data;
}

app.get("/redirect", async function (req, res) {
    const param = qs.stringify({
        grant_type: "authorization_code",
        client_id: client_id,
        redirect_uri: redirect_uri,
        client_secret: client_secret,
        code: req.query.code,
    });
    const header = {"content-type": "application/x-www-form-urlencoded"};
    var rtn = await call("POST", token_uri, param, header);
    req.session.key = rtn.access_token;
    res.status(302).redirect(`${origin}/demo.html`);
});

app.get("/profile", async function (req, res) {
    const uri = api_host + "/v2/user/me";
    const param = {};
    const header = {
        "content-Type": "application/x-www-form-urlencoded",
        Authorization: "Bearer " + req.session.key,
    };
    var rtn = await call("POST", uri, param, header);
    res.send(rtn);
});

app.get("/friends", async function (req, res) {
    const uri = api_host + "/v1/api/talk/friends";
    const param = null;
    const header = {
        Authorization: "Bearer " + req.session.key,
    };
    var rtn = await call("GET", uri, param, header);
    res.send(rtn);
});

app.get("/message", async function (req, res) {
    const uri = api_host + "/v2/api/talk/memo/default/send";
    const param = qs.stringify({
        template_object:
            "{" +
            '"object_type": "text",' +
            '"text": "텍스트 영역입니다. 최대 200자 표시 가능합니다.",' +
            '"link": {' +
            '    "web_url": "https://developers.kakao.com",' +
            '    "mobile_web_url": "https://developers.kakao.com"' +
            "}," +
            '"button_title": "바로 확인"' +
            "}",
    });
    const header = {
        "content-Type": "application/x-www-form-urlencoded",
        Authorization: "Bearer " + req.session.key,
    };
    const rtn = await call("POST", uri, param, header);
    res.send(rtn);
});

app.get("/friends_message", async function (req, res) {
    const uri = api_host + "/v1/api/talk/friends/message/default/send";
    let {uuids} = req.query;
    const param = qs.stringify({
        receiver_uuids: '['+uuids+']',
        template_object:
            "{" +
            '"object_type": "text",' +
            '"text": "텍스트 영역입니다. 최대 200자 표시 가능합니다.",' +
            '"link": {' +
            '    "web_url": "https://developers.kakao.com",' +
            '    "mobile_web_url": "https://developers.kakao.com"' +
            "}," +
            '"button_title": "바로 확인"' +
            "}",
    });
    const header = {
        "content-Type": "application/x-www-form-urlencoded",
        Authorization: "Bearer " + req.session.key,
    };
    const rtn = await call("POST", uri, param, header);
    res.send(rtn);
});

app.get("/logout", async function (req, res) {
    const uri = api_host + "/v1/user/logout";
    const param = null;
    const header = {
        Authorization: "Bearer " + req.session.key,
    };
    var rtn = await call("POST", uri, param, header);
    res.send(rtn);
});

app.listen(port, () => {
    console.log(`Example app listening at http://localhost:${port}`);
});

demo.html

<!DOCTYPE html>
<html lang="kr">
  <head>
    <meta charset="utf-8" />
    <title>Kakao REST-API Node.js example</title>
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
  </head>

  <body>
    <h1>1. 카카오 로그인 및 프로필 조회 예제</h1>
    <pre>
- [KOE101, KOE004] 내 애플리케이션>제품 설정>카카오 로그인 > 활성화 설정 : ON
- [KOE006] 내 애플리케이션>제품 설정>카카오 로그인 > Redirect URI : http://localhost:4000/redirect
</pre
    >
    <div class="text-center">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <script>
        function REST_Call(path) {
          axios
            .get("http://localhost:4000" + path, {
              params: {},
              withCredentials: true,
            })
            .then(({ data }) => {
              console.log(data);
              $("#contents").html(JSON.stringify(data));
            })
            .catch((err) => {
              console.log(err);
              $("#contents").html(JSON.stringify(err));
            });
        }
      </script>

      <a href="http://localhost:4000/authorize">
        <img
          src="//k.kakaocdn.net/14/dn/btqCn0WEmI3/nijroPfbpCa4at5EIsjyf0/o.jpg"
          width="222"
        /> </a
      ><br />

      <button onclick="REST_Call('/profile')">프로필 조회</button><br />

      <textarea id="contents" rows="20" cols="100"></textarea><br />

      <a href="http://localhost:4000/authorize?scope=friends,talk_message">
        <h2>친구목록 조회와 메세지 발송 권한 획득</h2> </a
      ><br />
      <button onclick="REST_Call('/friends')">친구목 조회</button>
      <button onclick="REST_Call('/message')">나에게 메시지 발송</button><br />
      <input type="text" id="uuids" />
      <button onclick="REST_Call('/friends_message?uuids='+$('#uuids').val())">
        친구에게 메시지 발송
      </button>
      ex) "AAA","BBB"<br />
      <button onclick="REST_Call('/logout')">로그아웃</button><br />
    </div>
  </body>
</html>

로그인에 관한 가이드 : REST API | Kakao Developers REST API
친구목록 관한 가이드 : REST API | Kakao Developers REST API
메시지에 관한 가이드 : 카카오톡 메시지: REST API | Kakao Developers 카카오톡 메시지: REST API

KOE006 에러 : Koe006 에러가 발생할 때
친구 api, 메시지 api 사용을 위한 체크 리스트 : 친구 api와 피커, 메시지 api 사용을 위한 체크 리스트
친구목록, 메시지 API 자주 겪는 에러 : [faq] 친구 목록 api, 메시지 전송 api를 연동하는 과정에서 자주 겪는 에러
메시지 API 권한 신청 방법 : '메시지 API' 사용 신청 방법 / How to request permission for 'Messaging API'

3개의 좋아요