はじめに

LIFFは、LINE Front-end Framework といい、LINEが提供するWebアプリの
プラットフォームです。近年耳にするLINEミニアプリについても
LIFFをベースとしたWebアプリのプラットフォームです。

LIFFはLINE上で自由にWebアプリを作成することができ、
自由度が高く、LINEの用意したデモサイトでも紹介されていますが、
会員証、予約、モバイルオーダーなどの用途での利用も可能なプラットフォームです。

2019/11/29 激震が走る

LIFF上で、QRコードリーダーを実現する仕組みとして、
liff.scanCode() というメソッドが提供されていましたが、
突然の提供停止（iOSのみ）告知が行なわれます。

Webアプリにおいて、QRコードリーダーというのは
需要のある機能であり、この提供中止により"LIFFのメリット"の1つが消えてしましました。

提供終了した理由については案内は行われていないようですが、
iOS版のみ提供停止ということで、そのあたり何かしらの問題があったものと推察されます。

その後、WebRTCや、HTML5の機能などを利用して、
どうにかiOS環境においてもLIFFアプリ内でQRコードリーダーを実現できないか模索していましたが、
結局可能な方法は発見できませんでした。

2021/4 頃LINEのAPI USE CASEサイトに以下のような記事が
アップロードされました。
https://lineapiusecase.com/ja/usecase/smartretail.html

この記事では、LIFFアプリ内で、Barcode Scanner SDKを利用して
バーコードリーダを実装していました。

もちろんiOS端末でも動作しました。
この記事を発見し、なぜLINE社のバーコードリーダは動作しているのか
調査を行いました。

するとiOS14.3がリリースされ、WKWebViewがgetUserMedia対応したと
いう情報がありました。
https://bagelee.com/programming/ios-14-3-wkwebview/
https://bugs.webkit.org/show_bug.cgi?id=208667#c77

LIFFは以下のページにも記載がある通り、iOSではWKWebViewを
利用していると記載があるため、もしやと思い、QRコードリーダーを実装しました。
https://developers.line.biz/ja/docs/liff/overview/

2021/05/20現在、
Vue Qrcode Readerや、jsQRなど、WebRTCを利用して実装したQRコードリーダーは、
LIFFブラウザ内で利用可能でした。

そのため、iOS14.3以降およびAndroid端末においては、LIFFブラウザ内でも
QRコードリーダーや、バーコードリーダは実現可能だと考えられます。

https://liff.line.me/1654102793-9lBWLxEL
※LIFFの仕様上profileスコープを指定していますが、
情報の取得や保存はしていないのでご安心ください。
またherokuなのでしばらくアクセスが無いと起動に時間がかかります。