Typescript でQRコードの画像ファイルを生成する

Typescript でQRコードの画像ファイルを生成する

QRコードの画像ファイルを生成する方法を紹介します。

1. NPMパッケージ

Node Moduleの node-qrcodeを使用します。

https://www.npmjs.com/package/qrcode

インストールは

npm install --save qrcode

で完了です。

2. QRCodeGeneratorクラス

node-qrcode自体は、誤り訂正レベルなど様々なオプションを設定できますが、今回は簡単に
QRコードをPNGファイルに出力することに特化したクラスを作成してみました。


// QRCodeFileGen.ts
import * as QRCode from "qrcode";
interface _IQRCodeOption {
    filename:string,
    type:string,
}
export class QRCodeFileGenClass {
    option: _IQRCodeOption;
    toFile(filepath:string, filetype:string, value:any){
        this.option = {
            filename: filepath,
            type: filetype
        }
        QRCode.toFile(this.option.filename, value, this.option);
    }
}

toFile関数には以下の引数を持ちます。

  • filepath: 出力先のファイルパス。拡張子つき。
  • filetype: 出力ファイルの拡張子。今回は.pngを指定します。
  • value: QRコードに記録する値です。文字列でも数字でもOKです。

3. QRCodeGeneratorクラスの使用方法


// index.ts
import {QRCodeFileGenClass} from "./QRCodeFileGen"
const _QRCodeFileGen = new QRCodeFileGenClass();
let filepath:string = __dirname + "/test.png"
let filetype:string = ".png"
let value:string = "testvalue"
_QRCodeFileGen.toFile(filepath, filetype, value);

import してインスタンスを生成して、toFile関数を呼び出しているだけです。
出力先は__dirnameで、Javascriptが実行されるルートフォルダとしています。

QRCodeFileGen.ts のダウンロードはこちらから。

返信を残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です