cafe24에서 필요한 token 을 발급 받기 위해서 는 code가 필요합니다.
사용자는 앱 관리 하면에 들어가면 아래 적힌 APP URL 을 먼저 들어가게 됩니다.
저의 경우 APP URL 사이트는 아래와 같이 생겼습니다.
먼저 현재 접속한 사람의 정보가 필요합니다.
그부분은 현재 개발된 APP의 페이지 에서
저 같은 경우
mounted는 vue js 에서 페이지 로딩 완료시 호출되는 메소드 입니다. .
,mounted:function(){
console.log(window.location.search);
}
이렇게 하면
https://{{AppUrl}}/?is_multi_shop={{멀티쇼핑몰여부}}&lang={{쇼핑몰언어}}&mall_id={{몰아이디}}&shop_no={{shop_no}}& timestamp= {{timestamp}}&user_id={{로그인아이디}}&user_name={{로그인사용자이름}}&user_type={{사용자유형}}&hmac={{검증용 key}}
위의 URL에 해당 되는 정보가 보이게 됩니다. 그럼 이정보로
그리고 아래의 주소로 요청을 해야 코드 정보를 받아 올수 있습니다.
GET 으로 위의 URL을 정보를 요청하면 되는데 꼭 웹 브라우저를 통해서 해야 합니다.
그래서
mounted(){
var query = this.searchToObject()
var params = new URLSearchParams();
var urls = 'https://'+query.mall_id+'.cafe24api.com/api/v2/oauth/authorize'
params.append('response_type','code')
params.append('client_id',"4X39PT10HBbt3fZqmetweV")
params.append('state',"xyz")
params.append('redirect_uri',"https://webrot360.tk:8080/#/web360")
params.append('scope',"mall.read_product,mall.write_product,mall.read_design,mall.write_design")
console.log(urls + "?" + params.toString());
window.location.href = urls + "?" + params.toString(); //params.toString() 는 쿼리를 만들어 줍니다.
},methods:{
searchToObject(){ //해당 코드는 window.location.search를 정리된 객체로 만들어 줍니다.
var pairs = window.location.search.substring(1).split("&"),
obj = {},
pair,
i;
for ( i in pairs ) {
if ( pairs[i] === "" ) continue;
pair = pairs[i].split("=");
obj[ decodeURIComponent( pair[0] ) ] = decodeURIComponent( pair[1] );
}
return obj;
}
}
위와 같이 = window.location.href 를 통해서 바로 URL 을 바꿔 버립니다.
그럼 redirect_uri 로 웹페이지가 바뀌 면서 URL 뒤에 code 정보를 같이 줍니다.
위 해당 처리를 하고 나면 'redirect_uri',"https://webrot360.tk:8080/#/web360" 로 이동한것 알수 있습니다.
현재 접속한 페이지 에서
https://webrot360.tk:8080/#/web360 의 스크립트에서
,mounted:function(){
console.log("code = "+this.$route.query.code);
}
그럼 위와 같이 하면
위와 같이 코드를 받을수 있음을 알수 있습니다.