TIL
카카오 알림톡 발송하기 -JavaScript 버전(버튼 포함)
개발따라김양
2024. 2. 28. 09:07
1. 카카오 알림톡은 보내는 이와 카카오톡 친구가 아니여도 휴대폰 번호만 알아도 발송이 가능합니다.
2. 사전에 비지니스 계정으로 등록이 필요합니다.
<script>
//1단계 OAuth 2.0 인증 -> 토큰 발급
const myHeaders = new Headers();
const base_url = "stg-user.bizmsg.kakaoenterprise.com"; //스테이징 - 일반 / 변경 필요
const client_id = "";
const client_secret = "";
myHeaders.append("Authorization", `Basic ${client_id} ${client_secret}`);
const urlencoded = new URLSearchParams();
urlencoded.append("grant_type", "client_credentials");
const requestOptions = {
method: 'POST',
headers: myHeaders,
body: urlencoded,
redirect: 'follow'
};
fetch(`${base_url}/v2/oauth/token`, requestOptions)
.then(response => response.text())
.then(result => {
console.log(result)
postKakao(result.access_token)
})
.catch(error => console.log('error', error));
//2단계 카카오톡 메시지 발송
function postKakao(access_token){
const myHeaders = new Headers();
myheaders.append("Authorization", `Bearer ${access_token}`);
myheaders.append("Content-Type", "application/json");
const sender_key = ""; //비즈 사이트에서 채널 생성 시 발급
const message = "알림톡 메시지 테스트"; // 1000자 이하
const button = {"type": "WL","name": "QR 코드 보기", "url_mobile": `모바일에서 보일 사이트`, "url_pc": `PC에서 보일 사이트` };
const body = new FormData();
body.append("message_type", "AT");
body.append("sender_key", sender_key);
body.append("cid", cid); //고객사 정의 Key ID
body.append("template_code", template_code); //실제 발송할 메시지 유형으로 등록된 템플릿의 코드
body.append("phone_number", phone_number); //수신자 전화번호(국가코드(82) 포함)
body.append("sender_no", ""); //고객사 발신 전화번호
body.append("message", message);
body.append("button", button);
const requestOptions = {
method: 'POST',
headers: myHeaders,
body: JSON.stringify(body),
redirect: 'follow'
};
fetch(`${base_url}/v2/send/kakao`, requestOptions)
.then(response => response.text())
.then(result => console.log(result))
.catch(error => console.log('error', error));
}
</script>