サーバー画像ファイルを店舗プリンターで出力する仕様書

目次

サーバー画像ファイルを店舗プリンターで出力する仕様書

GiftCARD印刷システム 技術メモ&実装レポート

作成日: 2026年2月7日
対象: Web側GiftCARD画像 → 店舗Bluetoothプリンター直接出力
前提: IT知識ゼロの店員が1タップで印刷完結


第1部:全体アーキテクチャ

text【サーバー側】                    【店舗側】
┌──────────────┐              ┌─────────────────┐
│ GiftCARD画像 │              │  店員スマホ      │
│ (PDF化)      │              │  (iPhone/Android)│
└──────────────┘              └─────────────────┘
       ↓
  QR生成・短縮URL
  (bit.ly等)
       ↓
  ┌──────────────────────────────────────────┐
  │  QRコード表示                              │
  │  (Web画面またはレシート)                    │
  └──────────────────────────────────────────┘
       ↓(カメラスキャン)
  ┌──────────────────────────────────────────┐
  │  ① スマホカメラ読み込み(2秒)             │
  │  ② Safari自動で PDF URL開く              │
  │  ③ Downloads/GiftCARDフォルダに DL(1秒)   │
  └──────────────────────────────────────────┘
       ↓(PDF保存完了)
  ┌──────────────────────────────────────────┐
  │  ④ DL通知から共有ボタン → PrintDirect     │
  │     または ファイルアプリから PrintDirect   │
  └──────────────────────────────────────────┘
       ↓(Bluetooth接続)
  ┌──────────────────────────────────────────┐
  │  ⑤ PrintDirect でプリンター選択           │
  │  ⑥ 印刷ボタン 1タップ                    │
  └──────────────────────────────────────────┘
       ↓
  【Bluetoothプリンター】
  GiftCARD 1枚出力 → 顧客に販売

合計時間: 約6秒
店員操作: 5タップ(QR読込 + 通知 + 共有 + プリンター選択 + 印刷)


第2部:サーバーPDF取得方法

2-1. DL(明示的ダウンロード)推奨方式

a) QRコード方式(最優先)

概要
サーバー側で QR生成スクリプト実装 → PDF短縮URL埋め込み → 店頭QR表示
店員がカメラスキャン → Safari自動 DL

実装仕様(WordPress対応)

xml<!-- PHP で QR 生成(WordPress プラグイン対応) -->
<div class="giftcard-qr">
  <h3>GiftCard ID: <?php echo $gift_card_id; ?></h3>
  <img src="/qr/generate.php?id=<?php echo $gift_card_id; ?>" alt="QRコード" width="200">
  <p>カメラでスキャンして印刷してください</p>
</div>
php<?php
// qr/generate.php
require_once 'phpqrcode/qrlib.php';
$gift_card_id = $_GET['id'];
$pdf_url = "https://yourserver.com/wp-content/giftcard/{$gift_card_id}.pdf";
QRcode::png($pdf_url);  // QR画像出力
?>

店員操作

  1. QRコード画面を確認
  2. スマホカメラでスキャン
  3. 自動でSafari開く → PDF URLクリック
  4. ダウンロード完了(通知バー)

利点
✅ 最もシンプル
✅ 手入力不要
✅ 互換性最高(iOS/Android両対応)

欠点
❌ 有効期限設定必須(セキュリティ)


2-2. fetch(アプリ内取り込み)方式

現実度: 低(開発工数大)
代替推奨: QR DL + PrintDirect


第3部:DL後 → プリンター出力

Bluetoothプリンター(第1候補)

操作手順(iPhone例)

text1. QRスキャン(2秒)
↓
2. SafariでPDF URL開く
↓
3. 「ダウンロード」→通知バー「完了」
↓
4. 通知タップ → プレビュー表示
↓
5. 右上「共有」(□↑)→ PrintDirect選択
↓
6. PrintDirect起動 → 保存プリンター自動選択
↓
7. 「印刷」ボタン → 完了(3秒)

アプリ仕様

PrintDirect(無料版で完結)

  • App Store: PrintDirect for iPhone
  • 対応: 全Bluetoothプリンター(Canon/Epson/Brother等)
  • 操作: 共有連携で3タップ

第4部:仕様・留意点

サーバーPDF仕様

text解像度: 300dpi
サイズ: 1MB未満
色空間: sRGB
有効期限: 1時間(JWT)

店舗運用チェックリスト

text店長準備(1回のみ)
☐ PrintDirectインストール
☐ Bluetoothペアリング
☐ テスト印刷5枚
☐ Safari DLフォルダ「iPhone内/GiftCARD」

店員操作(毎回)
1. QRスキャン
2. 通知タップ→共有→PrintDirect
3. 印刷ボタン

トラブルシューティング

問題対策
PDF見つからないファイルアプリ「ダウンロード」確認
Bluetooth切断距離10m以内、電池確認
印刷遅いPDF1MB未満確認

第5部:WordPress実装コード

QR表示プラグイン用ショートコード

php// functions.php に追加
function giftcard_qr_shortcode($atts) {
    $gift_card_id = $atts['id'];
    $pdf_url = home_url("/giftcard/{$gift_card_id}.pdf");
    $qr_url = home_url("/qr/?url=" . urlencode($pdf_url));
    
    return '<div class="giftcard-qr">
        <h3>GiftCard: ' . $gift_card_id . '</h3>
        <img src="' . $qr_url . '" width="200">
        <p>カメラでスキャンして印刷</p>
    </div>';
}
add_shortcode('giftcard_qr', 'giftcard_qr_shortcode');

使用法: [giftcard_qr id="GC001"]

QR生成エンドポイント

php// qr/index.php
<?php
$url = $_GET['url'];
require_once 'phpqrcode/qrlib.php';
QRcode::png($url);

メモリー不足

bluetooth プリンターで特に、廉価版に関して10K程度の物 プリンター側メモリーが小さくて容量不足になると
メモリー不足により、通信がうまくできなくなる可能性もあります。 スンホ側のメモリーも関係はしますが、プリンターメモリーのほうが、不足する可能性が高くなります。

PDFファイル 1MBまでで送るか 2MBまでで送るかにより メモリー容量は気を付けておくことが大事です。

PrintDirect ガイドも参照して

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

コメント

コメントする

目次