1) OAuth 인증 과정 구현하기(1) : 개발자센터 세팅
2) OAuth 인증 과정 구현하기(2) : 인증코드 발급 받기
3) OAuth 인증 과정 구현하기(3) : 엑세스 토큰 발급 받기
4) Cafe24 쇼핑몰에 스크립트 태그 심기
5) Cafe24 쇼핑몰 로그인 여부 확인하기
6) Cafe24 API, 로컬환경에서 테스트하는 방법
7) Cafe24 API, 호출건수 제한, 요청건수 제한의 의미
- Cafe24, 쇼핑몰 로그인 여부 확인하기
Cafe24의 Front API를 활용하여 회원 로그인 여부를 확인해보려 한다.
API 사용을 위해선 스크립트 태그를 심어야 하며, 태그를 심는 방법은 여기를 참고하길 바란다.
해당 기능은 공식문서 내에 있는 회원아이디 조회 기능으로 구현 것이다.
/* 사용 예시 */
CAFE24API.getCustomerIDInfo(function(err, res) {
if (err) {
// 오류 발생시 Error 개체입니다.
// name, message 속성을 확인할 수 있습니다.
// res 개체를 통해 상세한 오류메세지 확인이 가능합니다.
} else {
// res 개체를 통해 응답 메세지를 확인할 수 있습니다.
}
});
/* 결과 예시 */
// 성공시 응답 메세지입니다.
{
id: {
guest_id: null,
member_id: "tester"
}
}
// 실패시 응답 메세지입니다.
{
error: {
code: 403,
message: "You do not have the necessary authority(scope) to use the SDK."
}
}
위의 코드를 활용하여 아래와 같은 코드를 구현할 수 있다.
응답값에 member_id가 없으면 로그인 상태가 아니라 판단하여 알림창을 띄우는 구조이다.
function getCustomerId() {
let flag = false;
CAFE24API.getCustomerIDInfo(function(err, res) {
if (res.id.member_id != null) {
flag = true;
}
});
if(!flag) {
alert("회원만 접근권한이 있습니다.");
}
return flag;
}
위에 만든 함수 getCustomerId()는 boolean 타입을 반환한다.
이 함수를 a 태그에 onclick 이벤트의 return 값으로 추가한다.
(return이 true일 경우 a 태그의 href로 이동하며, false일 경우에는 이동하지 않는다.)
<div style="margin: 10px 0;">
<a href="#" onclick="return getCustomerId();" style="display:block; width:200px; line-height:50px; text-align:center; background-color:#943CE7; color:#fff; margin:5px;">로그인 여부 확인</a>
</div>