QR·바코드 스캔 및 코드 생성 가이드 | Appbox SDK

스캔 및 코드 생성

QR 리더기 오픈

앱에서 즉시 QR 카메라를 열어 사용자가 QR 코드를 스캔할 수 있도록 지원하는 기능입니다.
스캔된 문자열은 웹으로 전달되며, 이를 로그인, 쿠폰 등록, 출석 체크 등 다양한 서비스 흐름에 활용할 수 있습니다.

QR 리더기 실행하기

AppboxSDK.scanner.openQRCodeScanner(...)

Javascript
1 // QR 인식하고 결과 받아오기
2 AppboxSDK.scanner.openQRCodeScanner( { infoMessage: "QR을 비춰주세요." }, (err, data) => {
3 if (err) {
4 console.error( "QR 실패:", "code:", err.code, "message:", err.message );
5 } else {
6 console.log( "QR 스캔 OK:", data.result );
7 }
8 });

Request 항목 정의

Request 항목 필수여부 설명 기본값
haptic - 성공 실패시 진동 햅틱 여부 (true: 진동, false: 진동 없음)
infoMessage - 안내 메시지
messageColor - 안내 메시지 칼라값
defColor - QR리더기 박스 기본 칼라값
succColor - QR리더기 읽기 성공 시 박스 칼라값
failColor - QR리더기 읽기 실패 시 박스 칼라값


Response 항목 정의

Response 결과값
data.result QR 리더기로 받은 결과값
err.code 에러코드 (-1000 : 사용자가 닫음, -7000 : 권한 없음, -8000 : 서버 오류)
err.message 에러 메시지

QR 리더기를 실행하기 위해서는 최초 한번은 사용자가 카메라 권한을 승인하여야 합니다. 승인하지 않았다면 err.code-7000 으로 리턴됩니다.






바코드 리더기 오픈

앱에서 바코드 카메라를 열어 사용자가 바코드를 스캔할 수 있는 기능입니다.
스캔된 값은 웹으로 전달되며, 상품 조회, 멤버십 인증, 포인트 적립 등 다양한 서비스 흐름에 활용할 수 있습니다. 또한 카메라 UI를 커스터마이징할 수 있어 브랜드에 맞는 바코드 스캔 경험을 제공합니다.

바코드 리더기로 바코드 받아오기

AppboxSDK.scanner.openBarcodeScanner(...)

Javascript
1 // 바코드 리더기 오픈
2 AppboxSDK.scanner.openBarcodeScanner( { infoMessage: "바코드를 비춰주세요." }, (err, data) => {
3 if (err) {
4 console.error( "바코드 실패:", "code:", err.code, "message:", err.message );
5 } else {
6 console.log( "바코드 스캔 OK:", data.result );
7 }
8 });

Request 항목 정의

Request 항목 필수여부 설명 기본값
haptic - 성공 실패시 진동 햅틱 여부 (true: 진동, false: 진동 없음)
infoMessage - 안내 메시지
messageColor - 안내 메시지 칼라값
defColor - 바코드리더기 박스 기본 칼라값
succColor - 바코드리더기 읽기 성공 시 박스 칼라값
failColor - 바코드리더기 읽기 실패 시 박스 칼라값


Response 항목 정의

Response 결과값
data.result 바코드 리더기로 부터 받은 바코드 값
err.code 에러코드 (-1000 : 사용자가 닫음, -7000 : 권한 없음, -8000 : 서버 오류)
err.message 에러 메시지

바코드 리더기를 실행하기 위해서는 사용자가 최초 한번은 카메라 권한을 승인하여야 합니다. 승인하지 않았다면 err.code=-700 으로 리턴됩니다.






QR 보기 팝업

입력된 문자열을 QR 코드로 변환해 팝업 형태로 표시할 수 있는 기능입니다.
생성된 QR 코드는 화면에서 바로 확인할 수 있으며, 다른 기기에서 스캔해 인증, 티켓 확인, 멤버십 인증, 친구 초대 등 다양한 용도로 활용할 수 있습니다.

QR을 팝업으로 노출

AppboxSDK.ui.qrcodePopupOpen(...)

Javascript
1 // QR 팝업
2 AppboxSDK.ui.qrcodePopupOpen(
3 {
4 qr: "https://www.appboxapp.com",
5 haptic: true,
6 animation: true
7 }, (err, data) => {
8 if (err) {
9 console.error( "QR 팝업 실패:", "code:", err.code, "message:", err.message );
10 } else {
11 console.log( "QR 팝업 OK:", data.result );
12 }
13 });

Request 항목 정의

Request 항목 필수여부 설명 기본값
qr 필수 QR로 표기할 문자열
haptic - QR 팝업 노출시 진동 햅틱 여부 (true, false)
animation - QR 팝업 노출시 애니메이션 여부 (true, false)


Response 항목 정의

Response 결과값
data.result 성공 여부 (true | false)





바코드 보기 팝업

문자열이나 숫자를 바코드 형태로 변환해 팝업으로 보여주는 기능입니다.
생성된 바코드는 화면에서 즉시 확인할 수 있으며, 다른 기기에서 스캔해 멤버십 인증, 티켓 확인, 제품 확인, 쿠폰 사용 등 다양한 상황에서 활용할 수 있습니다.

바코드를 팝업으로 노출

AppboxSDK.ui.barcodePopupOpen(...)

Javascript
1 // 바코드 보기 팝업
2 AppboxSDK.ui.barcodePopupOpen(
3 {
4 barcode: "8801234567890",
5 haptic: true,
6 animation: true
7 }, (err, data) => {
8 if (err) {
9 console.error( "바코드 실패:", "code:", err.code, "message:", err.message );
10 } else {
11 console.log( "바코드 표시 OK:", data.result );
12 }
13 });

Request 항목 정의

Request 항목 필수여부 설명 기본값
barcode 필수 바코드로 생성 할 string
haptic - 바코드 팝업 노출시 진동 햅틱 (true, false)
animation - 바코드 팝업 노출시 애니메이션 (true, false)


Response 항목 정의

Response 결과값
data.result 성공 여부 (true | false)





www.naver.com
QR 코드를 촬영하면 입력하신 주소의
앱 예시 화면을 테스트할 수 있습니다.
* 스캔 후 바로 앱 다운로드 이동합니다.