12cm-echoss-sdk 中文文档教程
12cm echoss SDK
설치
npm install 12cm-echoss-sdk@latest
echoss Client SDK
개요
원투씨엠(주)의 echoss 客户端 SDK 사용방법을 설명합니다。
사용방법
HTML
<div class="app-container"></div>
Script
import echoss from '12cm-echoss-sdk/echoss-lite/index.js'
export default {
components: { echoss },
created () {
echoss.initializeSuccess = () => {
// 플랫폼 초기화 성공
echoss.Stamp.init(() => {
// 스탬프 인증센터 초기화 성공
}, (errorCode, errorMessage) => {
// 스탬프 인증센터 초기화 실패
})
}
echoss.setLanguageCode(echoss.LANGUAGE_CODE_TYPE.KOREAN)
echoss.initialize('API KEY를 입력하세요', echoss.REGION_CODE_TYPE.KOREA, '스탬핑 영역의 element ID를 입력하세요. ex) "app-container"')
echoss.Stamp.onBeforeStamp = () => {
// 스탬프가 인식되면 함수가 호출됩니다.
}
echoss.Stamp.onException = (errorCode, errorMessage) => {
// 스탬프를 인증할 수 없는 상황이 감지될 경우 함수가 호출됩니다.
}
echoss.Stamp.onError = (errorCode, errorMessage) => {
// 스탬프를 이용할 수 없거나 다시 한번 정확한 인식이 필요할 경우 함수가 호출됩니다.
}
echoss.Stamp.onStamp = (stampParams) => {
// 스탬프 인식 함수가 호출된 후 스탬프 정보가 정상적으로 암호화되면 함수가 호출됩니다.
}
}
}
리전코드
리전 | 코드 |
---|---|
한국 | echoss.REGION_CODE_TYPE.KOREA |
일본 | echoss.REGION_CODE_TYPE.JAPAN |
중국 | echoss.REGION_CODE_TYPE.CHINA |
대만 | echoss.REGION_CODE_TYPE.TAIWAN |
유럽 | echoss.REGION_CODE_TYPE.EUROPE |
동남아시아1 (싱가포르, 말레이시아) | echoss.REGION_CODE_TYPE.APSE1 |
동남아시아2 (인도네시아, 베트남) | echoss.REGION_CODE_TYPE.APSE2 |
언어코드
언어 | 코드 |
---|---|
한국어 | echoss.LANGUAGE_CODE_TYPE.KOREAN |
영어 | echoss.LANGUAGE_CODE_TYPE.ENGLISH |
일본어 | echoss.LANGUAGE_CODE_TYPE.JAPANESE |
중국어(간체) | echoss.LANGUAGE_CODE_TYPE.CHINESE |
중국어(번체) | echoss.LANGUAGE_CODE_TYPE.TAIWAN |
echoss Service Provider
개요
원투씨엠(주)의 echoss Certification Kit을 ֚하 기 위해 인증 페イ지 및 스탬프 연동 방법을 설명합니다。
사용방법
HTML
<echoss-certification-kit
:license="license"
:region="region"
:language="language"
:usercode="usercode"
:merchantcode="merchantcode"
:options="options"
:on-initialize-error="onInitializeError"
:on-stamp-error="onStampError"
:on-stamp-success="onStampSuccess"
:on-before-stamp="onBeforeStamp"
:on-close="onClose" />
Script
import EchossCertificationKit from '12cm-echoss-sdk/echoss-provider/index.vue'
export default {
components: { EchossCertificationKit },
data() {
return {
license: '라이센스를 입력하세요',
region: 'KOREA',
language: 'KOREAN',
usercode: '고객코드를 입력하세요',
merchantcode: '매장코드를 입력하세요',
options: {
backgroundcolor: '#000000',
opacity: 0.4,
description: '스탬프를 찍어주세요.',
loading: true,
animation: true,
echossicon: true
}
}
},
methods: {
onInitializeSuccess() {
// 라이센스 키 만료 등 초기화에 성공할 경우 함수가 입니다.
},
onInitializeError(errorCode, errorMessage) {
// 라이센스 키 만료 등 초기화에 실패할 경우 함수가 입니다.
},
onBeforeStamp() {
// 인증 페이지에서 스탬프가 인식되면 함수가 호출됩니다.
},
onStampError(errorCode, errorMessage) {
// 인증 페이지에서 스탬프 인증이 실패할 경우 함수가 호출됩니다.
},
onStampSuccess(response) {
// 인증 페이지에서 스탬프의 인증이 성공할 경우 함수가 호출됩니다.
},
onClose() {
// 고객이 인증 페이지를 닫을 경우 함수가 호출됩니다.
}
}
}
파라미터 명세
파라미터 | 설명 |
---|---|
license | 원투씨엠이 제공한 License ID 입니다. |
region | API 서버 접근을 위한 국가를 설정합니다. |
language | 노출될 메세지의 언어를 설정합니다. |
usercode | 고객사 회원 체계의 고객 고유번호 입니다. (한 서비스에서 모든 고객이 동일한 고객번호를 사용할 경우 여러 고객이 동시에 인증을 시도할 때 시스템에서는 한 고객이 동시에 부적절한 인증을 한다고 판단하기 때문에 인증 오류가 발생할 수 있습니다.) |
merchantcode | 가맹점의 고유번호 입니다. (12cm에서 제공해주는 가맹점 코드, 브랜드 코드, 고객사에서 관리하는 가맹점 고유 번호 중 입력이 가능합니다. 또는 고객사에서 가맹점 고유번호를 구분해 관리할 수 없는 경우 공백을 전달합니다.) |
options | 아래 표에서 상세 설명합니다. |
options
파라미터 | 설명 |
---|---|
backgroundcolor | 서비스 페이지의 배경 색상을 변경합니다. 기본 설정은 "#000000" 입니다. |
opacity | 서비스 페이지의 배경 투명도를 변경합니다. 기본 설정은 "0.4" 입니다. |
description | 서비스 페이지의 노출 문구를 변경합니다. |
loading | 서비스 페이지에서 스탬프 인식에 대한 로딩 이펙트 여부를 설정합니다. 요청 파라미터는 로딩 이펙트를 허용하러면 true, 허용하지 않는다면 false 입니다. 기본 설정은 true 입니다. |
animation | 서비스 페이지에서 배경 애니메이션의 사용 여부를 설정합니다. 요청 파라미터는 애니메이션을 사용할 경우 true, 사용하지 않는다면 false 입니다. 기본 설정은 true 입니다. |
echossicon | 서비스 페이지에서 에코스 아이콘의 사용 여부를 설정합니다. 요청 파라미터는 에코스 아이콘을 사용할 경우 true, 사용하지 않는다면 false 입니다. 기본 설정은 true 입니다. |
리전코드
리전 | 코드 |
---|---|
한국 | KOREA |
일본 | JAPAN |
중국 | CHINA |
대만 | TAIWAN |
유럽 | EUROPE |
동남아시아1 (싱가포르, 말레이시아) | APSE1 |
동남아시아2 (인도네시아, 베트남) | APSE2 |
언어코드
언어 | 코드 |
---|---|
한국어 | KOREAN |
영어 | ENGLISH |
일본어 | JAPANESE |
중국어(간체) | SIMPLIFIED_CHINESE |
중국어(번체) | TRADITIONAL_CHINESE |
12cm echoss SDK
설치
npm install 12cm-echoss-sdk@latest
echoss Client SDK
개요
원투씨엠(주)의 echoss Client SDK 사용 방법을 설명합니다.
사용방법
HTML
<div class="app-container"></div>
Script
import echoss from '12cm-echoss-sdk/echoss-lite/index.js'
export default {
components: { echoss },
created () {
echoss.initializeSuccess = () => {
// 플랫폼 초기화 성공
echoss.Stamp.init(() => {
// 스탬프 인증센터 초기화 성공
}, (errorCode, errorMessage) => {
// 스탬프 인증센터 초기화 실패
})
}
echoss.setLanguageCode(echoss.LANGUAGE_CODE_TYPE.KOREAN)
echoss.initialize('API KEY를 입력하세요', echoss.REGION_CODE_TYPE.KOREA, '스탬핑 영역의 element ID를 입력하세요. ex) "app-container"')
echoss.Stamp.onBeforeStamp = () => {
// 스탬프가 인식되면 함수가 호출됩니다.
}
echoss.Stamp.onException = (errorCode, errorMessage) => {
// 스탬프를 인증할 수 없는 상황이 감지될 경우 함수가 호출됩니다.
}
echoss.Stamp.onError = (errorCode, errorMessage) => {
// 스탬프를 이용할 수 없거나 다시 한번 정확한 인식이 필요할 경우 함수가 호출됩니다.
}
echoss.Stamp.onStamp = (stampParams) => {
// 스탬프 인식 함수가 호출된 후 스탬프 정보가 정상적으로 암호화되면 함수가 호출됩니다.
}
}
}
리전코드
리전 | 코드 |
---|---|
한국 | echoss.REGION_CODE_TYPE.KOREA |
일본 | echoss.REGION_CODE_TYPE.JAPAN |
중국 | echoss.REGION_CODE_TYPE.CHINA |
대만 | echoss.REGION_CODE_TYPE.TAIWAN |
유럽 | echoss.REGION_CODE_TYPE.EUROPE |
동남아시아1 (싱가포르, 말레이시아) | echoss.REGION_CODE_TYPE.APSE1 |
동남아시아2 (인도네시아, 베트남) | echoss.REGION_CODE_TYPE.APSE2 |
언어코드
언어 | 코드 |
---|---|
한국어 | echoss.LANGUAGE_CODE_TYPE.KOREAN |
영어 | echoss.LANGUAGE_CODE_TYPE.ENGLISH |
일본어 | echoss.LANGUAGE_CODE_TYPE.JAPANESE |
중국어(간체) | echoss.LANGUAGE_CODE_TYPE.CHINESE |
중국어(번체) | echoss.LANGUAGE_CODE_TYPE.TAIWAN |
echoss Service Provider
개요
원투씨엠(주)의 echoss Certification Kit을 이용하기 위해 인증 페이지 및 스탬프 연동 방법을 설명합니다.
사용방법
HTML
<echoss-certification-kit
:license="license"
:region="region"
:language="language"
:usercode="usercode"
:merchantcode="merchantcode"
:options="options"
:on-initialize-error="onInitializeError"
:on-stamp-error="onStampError"
:on-stamp-success="onStampSuccess"
:on-before-stamp="onBeforeStamp"
:on-close="onClose" />
Script
import EchossCertificationKit from '12cm-echoss-sdk/echoss-provider/index.vue'
export default {
components: { EchossCertificationKit },
data() {
return {
license: '라이센스를 입력하세요',
region: 'KOREA',
language: 'KOREAN',
usercode: '고객코드를 입력하세요',
merchantcode: '매장코드를 입력하세요',
options: {
backgroundcolor: '#000000',
opacity: 0.4,
description: '스탬프를 찍어주세요.',
loading: true,
animation: true,
echossicon: true
}
}
},
methods: {
onInitializeSuccess() {
// 라이센스 키 만료 등 초기화에 성공할 경우 함수가 입니다.
},
onInitializeError(errorCode, errorMessage) {
// 라이센스 키 만료 등 초기화에 실패할 경우 함수가 입니다.
},
onBeforeStamp() {
// 인증 페이지에서 스탬프가 인식되면 함수가 호출됩니다.
},
onStampError(errorCode, errorMessage) {
// 인증 페이지에서 스탬프 인증이 실패할 경우 함수가 호출됩니다.
},
onStampSuccess(response) {
// 인증 페이지에서 스탬프의 인증이 성공할 경우 함수가 호출됩니다.
},
onClose() {
// 고객이 인증 페이지를 닫을 경우 함수가 호출됩니다.
}
}
}
파라미터 명세
파라미터 | 설명 |
---|---|
license | 원투씨엠이 제공한 License ID 입니다. |
region | API 서버 접근을 위한 국가를 설정합니다. |
language | 노출될 메세지의 언어를 설정합니다. |
usercode | 고객사 회원 체계의 고객 고유번호 입니다. (한 서비스에서 모든 고객이 동일한 고객번호를 사용할 경우 여러 고객이 동시에 인증을 시도할 때 시스템에서는 한 고객이 동시에 부적절한 인증을 한다고 판단하기 때문에 인증 오류가 발생할 수 있습니다.) |
merchantcode | 가맹점의 고유번호 입니다. (12cm에서 제공해주는 가맹점 코드, 브랜드 코드, 고객사에서 관리하는 가맹점 고유 번호 중 입력이 가능합니다. 또는 고객사에서 가맹점 고유번호를 구분해 관리할 수 없는 경우 공백을 전달합니다.) |
options | 아래 표에서 상세 설명합니다. |
options
파라미터 | 설명 |
---|---|
backgroundcolor | 서비스 페이지의 배경 색상을 변경합니다. 기본 설정은 "#000000" 입니다. |
opacity | 서비스 페이지의 배경 투명도를 변경합니다. 기본 설정은 "0.4" 입니다. |
description | 서비스 페이지의 노출 문구를 변경합니다. |
loading | 서비스 페이지에서 스탬프 인식에 대한 로딩 이펙트 여부를 설정합니다. 요청 파라미터는 로딩 이펙트를 허용하러면 true, 허용하지 않는다면 false 입니다. 기본 설정은 true 입니다. |
animation | 서비스 페이지에서 배경 애니메이션의 사용 여부를 설정합니다. 요청 파라미터는 애니메이션을 사용할 경우 true, 사용하지 않는다면 false 입니다. 기본 설정은 true 입니다. |
echossicon | 서비스 페이지에서 에코스 아이콘의 사용 여부를 설정합니다. 요청 파라미터는 에코스 아이콘을 사용할 경우 true, 사용하지 않는다면 false 입니다. 기본 설정은 true 입니다. |
리전코드
리전 | 코드 |
---|---|
한국 | KOREA |
일본 | JAPAN |
중국 | CHINA |
대만 | TAIWAN |
유럽 | EUROPE |
동남아시아1 (싱가포르, 말레이시아) | APSE1 |
동남아시아2 (인도네시아, 베트남) | APSE2 |
언어코드
언어 | 코드 |
---|---|
한국어 | KOREAN |
영어 | ENGLISH |
일본어 | JAPANESE |
중국어(간체) | SIMPLIFIED_CHINESE |
중국어(번체) | TRADITIONAL_CHINESE |