본문 바로가기
Background
개발/JS

[JQuery] qrcodejs로 QR 코드 만들기

by BellRiver_Lee 2024. 12. 9.

바쁜 분들을 위해 바로 코드부터 보시지요.

See the Pen Untitled by 이종원 (@orugpbqu-the-solid) on CodePen.


QR 코드는 qrcodejs라는 라이브러리로 쉽게 만들 수 있습니다.
옵션도 무척 간단하기에 바로 가져다 사용하실 수 있습니다.

간단한 만큼 커스텀이 제한적이라는 약간의 아쉬움이 있지만 간단하게 QR 코드를 만들 수 있으니 무척 기쁘네요.


위 코드에서 다 알아보겠는데 correctLevel이 뭐지? 싶으실 수 있습니다.
correctLevel은 "복원 능력" 레벨을 뜻합니다.

QR 코드의 복원 능력이란?

  1. 물리적 손상: QR 코드가 긁히거나 찢어진 경우.
  2. 인쇄 오류: 프린터의 문제로 인해 일부 패턴이 흐릿하거나 잘못 인쇄된 경우.
  3. 환경 요인: QR 코드 위에 이물질(먼지, 물 등)이 묻은 경우.
  4. 디자인 요소: QR 코드에 로고를 삽입하거나 스타일링을 추가한 경우.

이러한 상황에서도 QR 코드가 작동할 수 있도록 해주는 기능이 "복원 능력"입니다.
쉽게 말하면 일부가 사라져도 QR 코드가 인식될 수 있도록 해주는 기능입니다.

복원 능력의 값은 아래처럼 설정할 수 있습니다.

QRCode.CorrectLevel.L (저: 7% 복원 가능)
QRCode.CorrectLevel.M (중간: 15% 복원 가능)
QRCode.CorrectLevel.Q (높음: 25% 복원 가능)
QRCode.CorrectLevel.H (최고: 30% 복원 가능)
728x90
반응형