choco-barcode-scanner
v1.6.0
Published
Barcode scanner for web
Downloads
193
Maintainers
Readme
Choco Barcode Scanner 🔎
Установка
npm i choco-barcode-scanner
или
yarn add choco-barcode-scanner
Поддерживаемые форматы
enum BarcodeFormats {
codabar = 'codabar',
code_39 = 'code_39',
code_93 = 'code_93',
code_128 = 'code_128',
databar = 'databar',
databar_exp = 'databar_exp',
ean_2 = 'ean_2',
ean_5 = 'ean_5',
ean_8 = 'ean_8',
ean_13 = 'ean_13',
ean_13_2 = 'ean_13+2',
ean_13_5 = 'ean_13+5',
isbn_10 = 'isbn_10',
isbn_13 = 'isbn_13',
isbn_13_2 = 'isbn_13+2',
isbn_13_5 = 'isbn_13+5',
itf = 'itf',
qr_code = 'qr_code',
sq_code = 'sq_code',
upc_a = 'upc_a',
upc_e = 'upc_e'
}
Метод init
Инициализирует сканер штрихкода с заданными параметрами.
- payload.container: Контейнер, в котором будет отображаться видео с камеры.
- payload.formats: Массив форматов штрихкодов для сканирования.
- payload.settings: Настройки камеры.
- payload.onSuccess: Колбэк, который вызывается при успешном сканировании.
Типизация:
interface BarcodeInitPayload {
container?: string | HTMLElement;
formats?: BarcodeFormats[];
settings?: MediaTrackSettings;
onSuccess: (barcodes: string[]) => void;
}
Пример использования vanilla js:
import { BarcodeScanner } from 'choco-barcode-scanner';
BarcodeScanner.init({
container: 'barcode-container',
formats: ['ean_13', 'ean_8'],
settings: {
width: 640,
height: 480,
},
onSuccess: barcodes => {}
}).catch(error => {
if (error.message === 'NOT_ALLOWED') {
// Пользователь не разрешил доступ к камере
}
if(error.message === 'NO_CONTAINER''){
// Указан неверный контейнер
}
});
Метод destroy
Уничтожает сканер штрихкода.
BarcodeScanner.destroy();
Пример использования с Vue:
<template>
<div id="barcode-container"></div>
</template>
<script>
import { onMounted, onUnmounted } from 'vue';
import { BarcodeScanner } from 'choco-barcode-scanner';
export default {
setup() {
const onSuccess = barcodes => {
console.log(barcodes);
};
onMounted(() => {
BarcodeScanner.init({
container: 'barcode-container',
formats: ['ean_13', 'ean_8'],
onSuccess
}).catch(error => {
if (error === 'NOT_ALLOWED') {
// Пользователь не разрешил доступ к камере
}
});
});
onUnmounted(() => {
BarcodeScanner.destroy();
});
}
};
</script>