Skip to content
potara potara potara

QRコード/バーコード読み取り（追加用）プラグイン

はじめに

kintone のレコードに QRコードやバーコード（次、コード）の内容を登録できるプラグインです。コードの読み取りは「内蔵カメラ」と「外部接続のスキャナー」を選択できます。

main1 main2

内蔵カメラはブラウザ上でカメラを起動するので素早くコードを読み取れます。しかし、その性質上読み取り性能がそれほど良くありません。コードのサイズが小さいような場合は外部接続のスキャナーの利用を検討してください（外部接続のスキャナーはキーボード入力として動作する必要があります）。

読み取り後に文字列（1行）やラジオボタン、チェックボックスなどを更新できます。

update1 update2

また、カスタマイズビューでの動作に対応しています。例えば、コードに従業員番号が設定されている場合、「勤務開始」ボタンクリックで勤務開始、「勤務終了」ボタンクリックで勤務終了のレコードを登録できます。

customizeview1 customizeview2

動作の紹介

一覧画面では通常フィールドのみに登録できます。連続読み取りに対応しており、複数レコードを一括登録できます。

追加/編集画面では通常フィールド、テーブルフィールドのいずれかに登録できます。

introduction1 introduction2 introduction3

プラグインの設定

コードの内容登録

コードの内容の一部のみをフィールドに登録することもできます。登録方法は 2 種類あります。

1. 文字数区切り

開始文字数と終了文字数を変更してください。コードの内容すべてを登録する場合は初期値のまま利用してください。（開始文字数：0、終了文字数：空）
開始文字数と終了文字数の仕様は MDN をご確認ください。

2. 特定の文字区切り

カンマなど区切る文字を入力してください。
次の例では半角カンマ（,）で区切り、フィールド「従業員番号」に分割した 1 つ目の内容を登録します。

config1

読み取り後の更新

読み取り後に文字列（1行）やラジオボタン、チェックボックスなどを更新できます。 固定値を設定し、編集不可とすることでコードの内容とは異なる内容を登録できます。

config2

自動登録

次のオプションを有効にすることで読み取り後に自動登録できます。

config3

カスタマイズビューでの利用

アプリの設定でカスタマイズ形式の一覧を作成し、HTML には次のような内容を設定します。

<div class="my_customize1"></div>

次はボタンを 2 つ表示する場合の設定例になります。

config4

プラグイン設定でカスタマイズビューを選択し、div タグに設定したクラス名を入力します。（クラス名の前に「.（ドット）」が必要です）

config5

JavaScript / CSS カスタマイズに CSS ファイルを設定することでボタンのスタイルを変更できます。

.my_customize1 button {
  margin: 8rem;
  padding: 2rem 4rem;
  font-size: x-large;
  color: #000000;
  border: 1px solid #000000;
  background-color: #f7dc6f;
  border-radius: 0.5rem;
}

複数フィールドへの連続入力

追加/編集画面で複数フィールドに連続で入力できます。

次は設定 1 の読み取り完了後に設定 2 の読み取りを開始します。

sequentially1

読み取りの動作オプションと併用できます。併用した場合の設定と動作の例を紹介します。

例1

設定1設定2
画面を開いた後に自動で読み取りを開始する--
1 件読み取り後に自動で登録する--
登録後に自動でダイアログを閉じる--
読み取りを連続する場合は次に読み込む設定を選択してください設定2-

登録する、次をスキャンする、といったボタンをクリックすることで次の動作に進みます。

sequentially2

例2

設定1設定2設定3
画面を開いた後に自動で読み取りを開始する-✅✅
1 件読み取り後に自動で登録する✅✅✅
登録後に自動でダイアログを閉じる--✅
読み取りを連続する場合は次に読み込む設定を選択してください設定2設定3-

ボタンをクリックすることなく登録、次のスキャン開始、閉じる、という操作ができます。

sequentially3

注意事項

内蔵カメラを利用する場合、読み取れるコードのサイズはカメラの性能に依存します。また、読み取り精度は 100% ではありません。実際に利用する端末でお試しをお願いします。

外部接続のスキャナーを利用する場合は下記のページを事前に確認してください。

外部接続スキャナーの利用 | potara

動作確認環境

  • iOS 17.2 の Safari、Google Chrome
  • Android 13 の Google Chrome
  • Windows 11 の Google Chrome

制限事項

内蔵カメラで読み取れるコードの種類は次のとおりです。

  • QRコード
  • Aztec
  • Datamatrix
  • PDF417
  • JAN/EAN
  • EAN-8
  • CODE39
  • CODE128

コードの内容を登録できるフィールドは次のとおりです。

  • 文字列（1行）
  • リッチエディター
  • 文字列（複数行）
  • 数値
  • ラジオボタン
  • ドロップダウン
  • リンク

入力できるフィールドは次のとおりです。

  • 文字列（1行）
  • リッチエディター
  • 文字列（複数行）
  • 数値
  • ラジオボタン
  • ドロップダウン
  • チェックボックス
  • 複数選択

プラグインのダウンロード

こちらのホームページで販売しています。30 日間のお試し期間があります。

お試し用 QRコード

すぐに動作を試してみたい方はこちらの QRコードをご利用ください。（印刷しなくてもディスプレイから読み取れます）

qrcode1

この QRコードの内容は次のとおりです。

文字列1行、リッチエディター、文字列複数行、1000、ラジオボタン1、チェックボックス1、複数選択1、ドロップダウン1、2019-9-1、07:00、2019-9-1 07:00、https://kintone.cybozu.co.jp/、ja、テスト用組織A、テスト用グループA、ルックアップ

更新情報

  • 2024/4/24 v1.6.1
    エラーメッセージを改善しました。
  • 2024/4/24 v1.6.0
    数値フィールドに入力する場合は前後の空白を削除する機能を追加しました。
  • 2024/4/15 v1.5.0
    改行で区切る機能を追加しました。
  • 2024/2/6 v1.4.1
    無効の読み取りボタンが表示される不具合を改修しました。
  • 2024/2/5 v1.4.0
    設定数を 5 から 8 に変更しました。
    連続読み取り時の不具合を改修しました。
  • 2024/1/26 v1.3.1
    ゲストスペースでボタンが表示されない不具合を改修しました。
  • 2024/1/22 v1.3.0
    追加編集画面で連続読み取り機能（複数フィールドへの連続入力）を追加しました。
    読み取りオプション「外部接続のスキャナー利用時にシングルクォートをコロンに変換する」を追加しました。
  • 2023/12/22 v1.2.0
    ダイアログを閉じた後にリロードするオプション設定を追加しました。
  • 2023/12/1 v1.1.0
    自動起動する機能を追加しました。
  • 2023/5/22 v1.0.0