Ajis Dzalparo

Posted on Jul 24

Cara Print Langsung dari Browser ke Printer Thermal Tanpa Dialog Windows

#javascript #webdev #printing #electron

Mencetak dokumen dari aplikasi web biasanya harus melewati dialog print bawaan browser atau Windows.

Untuk aplikasi biasa, hal tersebut mungkin tidak menjadi masalah. Namun, pada aplikasi POS, warehouse, inventory, dan shipping, pengguna bisa mencetak puluhan hingga ratusan label setiap hari.

Membuka dialog print untuk setiap dokumen membuat proses menjadi lambat dan sulit diotomatisasi.

Saya membuat Mrjee Print Bridge untuk membantu menyelesaikan masalah tersebut.

Apa itu Mrjee Print Bridge?

Mrjee Print Bridge adalah aplikasi desktop yang menghubungkan aplikasi web dengan printer lokal.

Aplikasi web mengirimkan print job ke local API, kemudian Mrjee Print Bridge meneruskannya ke printer yang telah dikonfigurasi.

Web Application
       ↓
Local API (localhost)
       ↓
Mrjee Print Bridge
       ↓
Local Printer

Proses pencetakan dapat berjalan tanpa membuka dialog print Windows.

Contoh penggunaan

Mrjee Print Bridge dapat digunakan untuk berbagai kebutuhan, seperti:

Shipping label
Barcode produk
Label warehouse
Dokumen PDF
Struk dan dokumen operasional
Printer Zebra dengan ZPL
Printer SATO dengan SBPL
Printer thermal yang terpasang di Windows

Format yang didukung

Versi Public Beta saat ini mendukung:

PDF
Raw ZPL
Raw SBPL
Printer Windows
Logical printer mapping
Daftar printer lokal
Test print melalui halaman demo

Mengapa menggunakan logical printer name?

Nama printer fisik dapat berbeda pada setiap komputer.

Sebagai contoh, komputer pertama mungkin mengenali printer sebagai:

ZDesigner ZD421

Sementara komputer lain menggunakan:

ZDesigner ZD421 (Copy 1)

Jika nama printer ditulis langsung di source code aplikasi web, integrasi akan mudah rusak ketika printer diganti.

Mrjee Print Bridge memungkinkan developer menggunakan logical name seperti:

shipping-label
receipt-printer
warehouse-label

Logical name tersebut kemudian dipetakan ke printer fisik dari aplikasi desktop.

Contoh mapping:

{
  "logicalName": "shipping-label",
  "physicalName": "ZDesigner ZD421",
  "type": "zpl",
  "enabled": true
}

Aplikasi web cukup mengirim pekerjaan ke shipping-label tanpa perlu mengetahui nama printer fisiknya.

Contoh mengirim print job

Berikut gambaran integrasi menggunakan JavaScript:

const response = await fetch("http://localhost:9000/api/print", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "Authorization": "Bearer LOCAL_SECRET_TOKEN"
  },
  body: JSON.stringify({
    logicalName: "shipping-label",
    type: "zpl",
    data: "^XA^FO50,50^A0N,40,40^FDMrjee Print Bridge^FS^XZ"
  })
});

const result = await response.json();
console.log(result);

Bearer token pada integrasi produksi merupakan token keamanan lokal. Token tersebut bukan license key dan tidak membutuhkan koneksi ke server Mrjee.

Untuk mencoba fungsi printing dari halaman demo, pengguna tidak perlu memasukkan bearer token.

Mengambil daftar printer

Aplikasi juga dapat menyediakan daftar printer dan mapping yang sudah dikonfigurasi.

Dengan demikian, developer dapat:

Menampilkan printer yang tersedia.
Memilih printer tujuan.
Menggunakan logical name dalam aplikasi.
Mengganti printer fisik tanpa mengubah source code aplikasi web.

Bisa berjalan secara offline

Proses printing berlangsung secara lokal:

Browser → localhost → Print Bridge → Printer

File yang dicetak tidak perlu dikirim ke cloud atau server Mrjee.

Setelah aplikasi terpasang dan printer dikonfigurasi, proses pencetakan tetap dapat berjalan saat koneksi internet terputus.

Internet hanya diperlukan untuk mengunduh aplikasi, membaca dokumentasi, dan memeriksa pembaruan.

Public Beta gratis

Mrjee Print Bridge v1.0.0 saat ini tersedia sebagai Public Beta gratis.

Pada versi ini:

Tidak perlu memasukkan license key
Tidak ada batas waktu penggunaan
Printing dapat berjalan secara offline
Tersedia halaman demo
Tersedia dokumentasi integrasi
Developer dapat menguji printer sebelum mengintegrasikan aplikasinya

Cara mencobanya

Download Mrjee Print Bridge v1.0.0.
Install dan jalankan aplikasinya.
Tambahkan printer.
Tentukan logical name.
Buka halaman demo.
Pilih printer dan jalankan test print.
Lanjutkan integrasi menggunakan dokumentasi yang tersedia.

Website dan dokumentasi:

https://mrjeeprint.com

Download versi terbaru:

https://mrjeeprint.com/download

GitHub Release:

https://github.com/ajisdzalparo/mrjee-print-bridge/releases/tag/v1.0.0

Feedback

Public Beta ini dirilis untuk mendapatkan feedback dari developer dan pengguna di dunia nyata.

Jika kamu mengembangkan aplikasi POS, WMS, inventory, shipping, atau sistem yang membutuhkan direct printing, silakan mencoba Mrjee Print Bridge.

Feedback, laporan bug, dan saran dapat dikirimkan melalui GitHub Issues.

Terima kasih sudah mencoba.

DEV Community