Open6

JAN (EAN) コードを Web で扱う

hideharahidehara

ゴール : ひたすらJANコードを読み取るアプリが欲しい

Webで実現したい理由

  • スマホのカメラが活用できそう(だけど、やったことない)
  • デプロイコストを下げる (アプリだと、申請がいるし、マーケットも2つある)
  • JavaScriptで出来るなら、GitHubやGASなど色々プラットホームもある
hideharahidehara

JANコードの知識

類似

バーコードの種類
http://www.n-barcode.com/hp2/toshositsu/syurui/index.html

  • JAN は UPC とか EAN と同じ仕様

ローカル発行可能?

可能だった。インストアマーキング が規定されてる。

https://www.barcode.ne.jp/barcode/239.html

  • 店内でのみ使うコード:インストアマーキング
  • メーカーコードの取得:不要
  • データ構成:自由に設定可能(コードに価格を埋め込んでもOK)
  • 国コードに対応する最初2桁:20~29を使用する

参考サイト

日本バーコードさんのサイト

hideharahidehara

JSライブラリ

QuaggaJS

EAN が読めればOKということで、こちらでも JAN が読めるのね

最終更新が 2017-06-07 というのは、一抹の不安もあるが。

cdnjs でも取得可能 => Home / Libraries / quagga

これを参考にGASで、Webアプリとして実装してみた。

https://blog.syn-sophia.co.jp/articles/2022/09/05/books_barcode_reading

おー読める読める。

なぜか木製の机の上においておくと、存在しない数字がでてきた点以外は問題ない。

他の記事や、公式を読むと、もうちょっとうまく制御できそう。

https://qiita.com/tinymouse/items/6aa75c30f828fe3f0c42

https://zenn.dev/sdkfz181tiger/articles/f79b40d655b254

QuaggaJS オルタナティブ

有名どころみたいで、5つぐらい出てた

https://alternativeto.net/software/quaggajs/

OSSだと Zxing 、QuaggaJS2 あたりが存在してる。

どちらも、直近でメンテナンスもされてた。

hideharahidehara

JSライブラリ (プロプライエタリ)

有償のって、どんなもの?と使ってみた。どちらも iPhone の Chrome にて。

カメラのフロント・バックも判断できるし、さすがという感じ。

Strich

https://strich.io/index.html

個人的にはヒット!袋に印刷されてるJANコードも、サクッと読める。

Barcode Scanner for Web

https://www.dynamsoft.com/barcode-reader/sdk-javascript/

こっちもサクサクよめていいな

hideharahidehara

ノーコード

まだ活用したことなかったのだけど、たまたま見つけてやってみた。
バーコードスキャンするには、最速で提供できそうだ。。。

AppSheet

https://www.soarig.co.jp/post/google-solution-inventory-management

https://qiita.com/asami-H-Ishi/items/6f65e0b3e7df848e40ad

https://appsheet-apps.jp/appsheet/inventory-01/

テキストボックスおいて、Scan属性にチェック入れるだけで実装完了!はや!!

NFCとかもあるし、ノーコード環境恐るべし

ブラウザではスキャン動作せず、アプリで起動する必要あるけど、それでもメリットあるわ。

ちなみに反応感でいうと、Strich並の感触で快適。

PS Y!ショッピングAPIがすごい。。。