React Native) 바코드 스캐너 라이브러리를 찾아서 2편

1편을 못봤다면 여기로

https://devarthur25.tistory.com/63

React Native) 바코드 스캐너 라이브러리를 찾아서 1편

 

 

 

 

---

vision-camera-code-scanner

 

해당 라이브러리는 react-native-vision-camera 를 기반으로 바코드 스캔을 할 수 있도록 추가적인 기능을 지원하는 라이브러리다. 그래서 설명서에도 해당 라이브러리에 의존하고 있으므로 꼭 같이 설치하라고 쓰여있다.

https://github.com/rodgomesc/vision-camera-code-scanner

GitHub - rodgomesc/vision-camera-code-scanner: VisionCamera Frame Processor Plugin to read barcodes using MLKit Vision QrCode S

기존 비전카메라의 프레임 프로세서 기능에 덧붙여서 바코드를 읽어내는 기능을 포함하고 있다.

비전 카메라의 플래시 기능이나 사진 캡쳐 기능과 덧붙여 함께 사용할 수 있기 때문에 내가 생각하는 무료 라이브러리 중 가장 좋다고 생각한다. 

 

실제로 현업에서 무료 라이브러리를 사용할 때는 해당 라이브러리를 포함시켜서 꽤나 오랜 기간 사용했었다.

정확도가 그리 나쁜 편도 아니고(약 99% 정도, 1000 장 기준 5~7장 오인식), 사진을 흔들리게 촬영하거나 빛 번짐현상이 있지 않는 이상 항상 정확하게 읽어냈다.

게다가 오인식의 경우 주기적인 패턴이 있어서, 잘못 읽었을 때 수정해서 값을 고칠 수 있었다.

대표적으로 CPTCCWB.. 로 시작하는 바코드가 있는데 이 바코드를 매번 CPTCPP6...로 읽는다던지, 마지막 4자리를 두번 반복하는 현상이 있다던지 등, 조건을 넣어서 고칠 수 있는 경우가 많았다.

 

다만 이 라이브러리를 잘 사용하다가 안 사용하게 되는 계기가 된 것이 있었는데, 그 이유는 다름아닌 빛번짐에 의한 인식률 이슈와 치명적인 오인식 방식이 존재했기 때문이다.

예를 들어 ABCD123456 이라는 바코드가 존재하는데, 스캔하는 환경이 일정하지 않다보니 빛의 반사로 인해서 검은색 바코드가 잘 보이지 않을때 임의로 ABCD123356 과 같이 자연스럽게 오타를 내고 인식한다.

또 다른 예시는 상자의 바코드가 긁힌다던지 하는 현상으로 완벽한 형태가 아닐때, 대부분은 정확히 인식하지만 마찬가지로 자연스럽게 ABBC123455 이렇게 인식한다.

 

이런 패턴은 전혀 파악 할 수 없어서 매번 CS 쪽에 이슈로 생성되어 사람이 사진을 보고 직접 읽어 수기 입력하는 방식을 채택했었는데, 유저 수가 늘어남에 따라 100명이 100장씩만 인식해도 매일 4~60건의 오입력 사례가 발생해서 점차 부담되기 시작했다.

 

결국 이 바코드 스캐너가 무료 버전이고 준수한 성능을 가졌음에도 불구하고 회사가 성장해감에 따라 외면받게 되었다.

경영진 입장에서는 이게 회사 신뢰도와 직결된다고 다른 성능 좋은 (이전에 사용하던 엑스포 바코드 스캐너 같은.. 어쩌면 엑스포는 아예 오인식시 이상하게 읽으니까 사람들이 이상하다고 느낌, 얘는 너무 자연스럽게 이상하게 읽어서...)  라이브러리를 도입하거나, 나보고 바코드 스캐너를 개발(?)하라는... 요청을 강압적으로 했기 때문에 어쩔수 없이 다른 라이브러리를 찾아야 했다.

회사에 신입 1년차 개발자한테 모든 서비스를 다 맡겨버리고 무책임하게 너가 다해라라는 무거운 책임감을 부여받아 매일 울고 마음이 무척 무거웠다.

 

 

 

 

 

---

vision-camera-dynamsoft-barcode-reader

 

dynamsoft-capture-vision-react-native 를 알아보기 전에 이 라이브러리를 경험했었기에 추가로 작성한다!

RN 환경에서 바코드 스캔을 하려면, 이미지를 인식하거나 카메라를 켜야한다. 이미지에서 바코드를 추출하는 라이브러리를 찾지 못했기 때문에, 카메라로 스캔을 하는 방식을 찾았다.

RN에서 대표적으로 많이 쓰는 방식이 비전 카메라인데, 이 카메라 라이브러리를 사용하면서 바코드 스캔을 할 수 있도록 도와주는 라이브러리를 찾다보니 이 녀석을 발견하게 되었다.

 

https://github.com/tony-xlh/vision-camera-dynamsoft-barcode-reader

GitHub - tony-xlh/vision-camera-dynamsoft-barcode-reader: React Native Vision Camera Frame Processor Plugin of Dynamsoft Barcode

 

사실 이미 비전 카메라 방식으로 개발된 코드를 최대한 건들지 않으면서 가볍게 도입할 수 있는 라이브러리를 찾았기 때문에 이 라이브러리 이외에는 선택지가 없었다. 개발에 있어서 여유 상황이 안됬기 때문이다. (이미 하루에 14시간 이상 일하고 있었음)

 

아무튼 추가로 설명하면 해당 바코드 스캔 라이브러리는 유료인데, 라이센스를 활성화하지 않더라도 7일정도는 무료로 사용할 수 있다. 그 이후에 스캔을 시도하면 오류문구만 출력된다.

 

금방 적용을 완료하고 (3일 걸림) 바코드 샘플 이미지(약 2만장 정도)를 인식 시킨 결과 거짓말 안하고 모두 정상적으로 인식했다...

 

이게 말이되는 성능인가 싶어서... 일부로 불끄고 어둡게 인식도 해보고, 싸인펜으로 바코드 색칠도 해보고, 구겼다 펴서 인식 시켜보고, 회사 제품 바코드가 아닌 집에있는 모든 바코드를 인식시킨 결과 모두 정상적으로 인식했다.

게다가 아예 못읽겠다 싶은건 인식 자체를 안하는 기능까지 지원한다.

 

말도 안되는 준수한 성능에 놀라 해당 라이브러리를 개발한 회사를 찾아보니 2003년부터 바코드 스캔 기능만 전문으로 개발하는 회사라고 한다. 이에 해당 라이브러리로 테스트 버전을 빌드 후 내부 직원들에게 공유한 결과 모두가 다 만족했다. 나는 결국 무료 라이브러리를 이제 포기하고 해당 라이센스를 구매하자고 먼저 말을 꺼내게 된다.

 

dynamsoft-capture-vision-react-native에 대해서는 다음편에 이어서 작성하겠다.

생각보다 글을 안쓴지 오래되서 잘 안써진다 ㅋㅋ