행사장에서 바로 쓸 수 있는 QR코드 만들기 + 스캐너 웹

https://smartstore.naver.com/zeey/products/7097249638

코로나 때문에 네이버나, 카카오 등에서 QR코드 인증을 한 경험 덕분일까요?

최근 들어 부쩍 오프라인에서 QR코드를 통해 초대장을 발급하고, 해당 코드를 통해 자동으로 행사장 인원 등을 관리하는 '자동화'에 대한 문의가 많아지고 있습니다.

뭐 기초적인 QR코드 만드는거야 요즘은 워낙 잘되어있기도 하고,

기본적으로 카메라만 작동시켜도 링크형태의 QR코드는 너무나도 쉽게 만들고 뿌릴 수 있습니다.

오늘 소개해드릴 QR코드 시스템은 바로 구글 폼으로 제출만 하면 이메일로 QR코드를 받고, 이걸 또 자체 스캐너 페이지에서 스캔할 수 있는 건데요.

 

현재 판매를 시작하고 있기 때문에 너무 많은 노하우를 알려드리긴 어렵겠지만, 최대한 많이(?) 알려드려 보도록 하겠습니다~!
개발 지식이 없으신 분들은 대략 이런 플로우로 되는구나 하고 봐주시면 감사하겠습니다 :)

1단계 : 구글 폼과 앱스크립트

일단 주로 QR코드를 만들고 이를 이메일로 전달하기 위해서 구글 폼에서 앱스 크립트를 활용!
구글 폼이 제출 완료되면 이 정보를 토대로 이메일을 발송합니다.

입력받은 구글 폼의 값은 values [0] ~ values [@]까지의 순서대로 치환할 수 있습니다.

예를 들어 타임스탬프는 values [0]으로 치환해서 사용할 수 있습니다.

즉 앱스 크립트에서 타임스탬프라는 변수에 내용을 담기 위해서는

var regdate = input.values[0];

이라고 써서 활용할 수 있습니다.

자 그러면 이렇게 받은 값들을 활용하기 위해서 스프레드시트 API를 사용해야 하는데요.

친절하게도 구글에서 GmailApp을 어떻게 보내는지 설명이 다 나와 있기 때문에 어렵지 않게 이메일을 보내는 수식을 짜 봅니다.

function sendE(empEmail,subject,body,attachment,senderName,empSlideId){
      GmailApp.sendEmail(empEmail, subject, body, {
        inlineImages: {image: generateScreenshots(empSlideId)},
        attachments: [attachment.getAs(MimeType.PDF)],
        name: senderName
      });
}

각각 empEamil, subject, body, attachment, senderName, empSlideId라는 변수명을 활용했으며,

empEmail 은 이메일 주소 (구글 폼 입력)
subject는 스프레드시트에서 (이메일의 발송 제목)
body 도 스프레드시트에서 (이메일의 본문)
attatchment는 앱스 크립트에서 (첨부파일 생성)
senderName 은 발송받는 수신자의 이름 (구글 폼 입력)
empSlideId는 구글 슬라이드에서 가져옵니다.

하하... 이렇게 보고 나니 설명을 어떻게 해야 할지 감이 안옵니다....

결론부터 이야기하자면, 이메일을 보내기 위해 GAS에서 변수를 만들고,
QR코드를 보내기 위한 템플릿을 통해 대신 전달해주는 느낌입니다.

2단계 : 스캐너 페이지 만들기

QR코드를 스프레드시트로 보내기 위해선 자체 스캐너 페이지가 필요합니다.
자바스크립트와 Jquery를 일부 활용하면 구글 스프레드시트에 스캐너 페이지를 띄워줄 수 있는데요~!

아쉽게도 요 스크립트는 영업비밀이라 공개해드리진 못하지만, 힌트는 Jquery에 있습니다.
즉 오픈소스 라이브러리를 가져왔다는 것이죠?

Appscript QR Scanner Page

3단계 : QR코드 입력 시 스캐너 페이지 -> 구글 스프레드시트로 데이터 연결

3단계가 가장 중요합니다. 일반 스캐너 페이지와의 가장 큰 차이점은 결국 저희가 원하는 곳에 QR코드에 담긴 데이터를 전달해주는 것.
최근에는 QR코드 스캔이 완료되면 음성을 출력하는 것도 조금씩 고려해보고 있습니다.

"인증되었습니다." 음성이 들리고 안 들리고는 확실히 차이가 있으니까요. 물론 이게 가능한지는 잘 모르겠습니다.

또 무한의 삽질을 하다 보면 언젠가 발견하지 않을까 하는 생각이......

자주 물어보시는 질문

Q. 유지 비용이 따로 있나요?

A. 아니요. 구글 계정만 있으신다면 구축 이후에 별도 비용이 들지 않습니다.

 

Q. 정확히 어떻게 동작하는지 잘 모르겠어요...

A. 사실 저도 완벽히 설명은 못하겠습니다만 아래 영상으로 대체해보겠습니다... ㅎ

 

Q. 이메일이 잘못되어서 전송이 안 되는 경우는 어떻게 하나요?

A. 아쉽게도 이메일이 불발된 경우, 구글 폼 내의 파일 경로를 통해 다시 알림톡이나 문자메시지로 배포해주셔야 합니다.

 

Q. 구글 스프레드시트를 잘 모르는데 구현해주시면 잘 쓸 수 있을까요?

A. 음... 솔직히 잘 쓰시는 분들은 잘 쓰시고, 정말 어려워하시는 분들은 못하시기도 합니다. 현재까지 아예 못하셨던 분들은 없지만, 그런 경우가 혹시라도 있다면 걱정 마세요. 

 

주문링크 : QR코드 커스텀은 꼭 문의 후 결제해주세요~

https://smartstore.naver.com/zeey/products/7097249638

QR 코드 자동화 및 시스템 만들어드립니다. (재택 / 행사용 / 근태관리 QR코드) : 스킬샵