JANコード作成の備忘録🐯
- バックエンド（Laravel側）でバーコード生成のコードをライブラリを使用して書く
- アクセサとして処理を走らせる
- 12桁+1桁(チェックデジット)の🦓と、目視したいデータを表示させる
の内容を端折りながら書いていきます。
実際はフロントにバーコードの表示をさせるところ
- 表示用ページ
- ルーティング
- PNG画像の取得
までやっていますが、記事がめちゃくちゃ長くなってしまうので省きました。
？ってとこはフロント関連なのかなと思って欲しいです。
基礎: ライブラリをインストールする
php-barcode-generatorを使います
インストール方法
composer require picqer/php-barcode-generator
使用したいタイミングで下のように記載します
$generator = new Picqer\Barcode\BarcodeGeneratorHTML();
echo $generator->getBarcode('081231723897', $generator::TYPE_CODE_128);
好きなタイミングで使っていくには
一定の処理が終わったタイミングで必ず実行させたい！→アクセサとして処理を走らせる！
アクセサを使用することで加工済のデータをフロントに送ることが出来るので使用しました。
関連するModelファイル内に書いて実装します。
具体的には？①～③で説明
今回は好きなようにバーコードをカスタマイズしたいので以下のようにしてみます。
出力例：バーコードと周りの枠に必要最低限のデータを目視できるようにします。
①実装するModelファイル内から走らせる。
e.g Sampleテーブルの値をバーコードに反映させたいとき、SampleBarcodeヘルパーを呼び出します
getBarcodeAttributes() {
$result = [];
$value = DB::table('sample'); //id指定などはメソッドチェーンを使用する
if($value) {
array_push($result, base64_encode(SampleBarcode($value))
}
return $result;
}
//他のnameでは違うデータを載せたい！のときはswitchを使用するなどして対処できます
getBarcodeAttributes() {
$result = [];
switch ($this->name) {
case "サンプル":
$value = DB::table('sample'); //id指定などはメソッドチェーンを使用する
if($value) {
array_push($result, base64_encode(SampleBarcode($value))
}
return $result;
case "他";
省略
}
}
②SampleBarcodeヘルパー内には何を記載するのか
バーコードの🦓の部分と他データの配置方法を記載しています
- 目視したいデータ
- バーコードの🦓の部分
- SVGでどこに🦓を、どこに目視したいデータを入れるのかを指定していきます
※SVGいまいち理解できていないのでめちゃくちゃ省きます！
ChatGPTでSVGの線の引き方とか画像の乗せ方とか教えてもらいながらやりました。
また、こちらの動画(PHPでSVGを描く方法)にはめちゃくちゃ助けられました！！
function SampleBarcode($data)
{
$numbers = $data->numbers; //12桁
$checkdigit = チェックデジット計算結果(省略) // 1桁
$code = $numbers . $checkdigit; //13桁
return
'<svg //ここに枠の大きさなど指定できます>
<defs>
<image id="1"/>
</defs>
<defs>
//13桁の数字が載った🦓の呼び出し
<image id="1"
xlink:href="data:image/png;base64,' . png_barcode($code) . '"
/>
</defs>
//LとMで枠線を引くことも出来ます（理解したらまた書きたいです）
//目視したいデータ。便宜的に文字で書いちゃいます。
//テーブルから取得の場合、return以前にe.g $text = $data->text; のように指定してください
<g transform="matrix( 0, 0, 0, 0, 0) ">
<clipPath id="test">
<rect x="0" y="0" width="0" height="0" fill="#FFFFFF" stroke="none" />
</clipPath>
<text clip-path="url(#test)" writing-mode="lr">
<tspan x="0" y="0" baseline-shift="0%" font-family="MS UI Gothic" font-size="100" fill="#000000" xml:space="preserve">テストまたは '.$text.' </tspan>
</text>
</g>
</svg>';
}
③BarcodeLayout.php内ではImagickを使用してバーコードをPNG出力します
Imagickのインストールがうまくいかなかったとき、
https://www.geeksforgeeks.org/how-to-install-imagick-for-php-in-windows/
こちらの記事通りにやったらうまくいきました！
function png_barcode($code)
{
$barcode = $code;
$generator = new Picqer\Barcode\BarcodeGeneratorPNG();
$barCodeImg = $generator->getBarcode($barcode, $generator::TYPE_CODE_128, 3, 200);
$imagick = new \Imagick();
$imagick->readImageBlob($barCodeImg);
//必要であればbackgroundcolorなど設定
$imagick->setImageFormat("png");
return base64_encode($imagick);
}
readImageBlobは、文字列から画像を読み込むというものです
これで🦓と「テスト」と書かれた画像生成ができました。というか準備OKです！
冒頭にも書いたようにフロントの部分は省いたので出力結果みたいになるんだなあと思ってください
不完全なアウトプットではありますが、書いておかないと次困っちゃうので！
🐯参考🐯
- https://blog.capilano-fw.com/?p=2114#appends : フロントで渡す処理で参考にしました
- http://taustation.com/laravel-query-builder/ : データ取得のときに参考にしました
- https://www.php.net/manual/ja/imagick.readimageblob.php
- https://sotafreelife.com/laravel-accesors-mutators/
- https://www.keyence.co.jp/ss/products/autoid/codereader/basic_jan.jsp