Making Online Barcode Reader on Linux with Node.js
Jan 18, 2016
Previously, I shared an article How to Make Node Barcode Reader Addon on Linux, which illustrates how to create a node barcode addon by wrapping Dynamsoft Barcode Reader SDK on Linux. Since Node.js was born for developing network programs, let’s take a glimpse of how to create a Web barcode reader using the node barcode addon.
Getting Started
I assume you have successfully built the dbr.so using node-gyp. If not, please read the relevant post before taking the following steps.
Basic Steps of Reading Barcode Online
- Upload barcode images or transfer image URLs to a Web server.
- Save barcode images to designated folder on the Web server.
- Decode barcode images and send results back to Web clients.
Install Express and Formidable
Express is a Web framework for Node.js. To install Express:
npm install express --save
Formidable is a node.js module for parsing form data. To install Formidable:
npm install formidable --save
Initialization
var formidable = require('formidable');
var util = require('util');
var express = require('express');
var fs = require('fs');
var app = express();
var path = require('path');
var dbr = require('./build/Release/dbr');
var http = require('http');
Load Static Resources in Express
Create a static HTML page index.htm with CSS files and JavaScript files:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Dynamsoft Barcode Reader Nodejs Demo</title>
<link type="text/css" rel="stylesheet" href="assets/css/style.css" />
<script type="text/javascript" src="assets/js/jquery-1.11.2.js"></script>
</head>
<body>
<div id="wrapper">
<div id="dbr-nodejs">
<h1>
Dynamsoft Barcode Reader Nodejs Demo</h1>
<!--<form action="">-->
<div class="step step1">
<div id="fileUpload" class="getFile">
<span class="num">1</span>
<h4>
Upload from local:</h4>
<input type="file" id="fileToUpload" onchange="fileSelected();" />
<input type="text" readonly="readonly" id="filename" />
<input type="button" />
<a class="clickSwitch" href="javascript:void(0);">or, Specify an URL</a>
</div>
<div id="fileDownload" class="hidden getFile">
<span class="num">1</span>
<h4>
Specify an URL:</h4>
<input type="text" id="imageURL"/>
<!--<input type="button"/>-->
<a class="clickSwitch" href="javascript:void(0);">or, Upload from local</a>
</div>
</div>
<div class="step step2">
<span class="num">2</span>
<h4>
Barcode Types:</h4>
<ul class="barcodeType">
<li class="on">
<label for="chkLinear">
<input id="chkLinear" name="BarcodeType" type="checkbox" checked="true" value="0x3FF">
<span>Linear</span><br />
<div class="imgWrapper">
<img src="assets/images/oned.gif" width="90" alt="Barcode Type Linear" /></div>
</label>
</li>
<li>
<label for="chkQRCode">
<input id="chkQRCode" name="BarcodeType" type="checkbox" value="0x4000000">
<span>QRCode</span><br />
<div class="imgWrapper">
<img src="assets/images/qr.gif" width="60" alt="Barcode Type QRCode" /></div>
</label>
</li>
<li>
<label for="chkPDF417">
<input id="chkPDF417" name="BarcodeType" type="checkbox" value="0x2000000">
<span>PDF417</span><br />
<div class="imgWrapper">
<img src="assets/images/pdf417.gif" width="100" height="38" alt="Barcode Type PDF417" /></div>
</label>
</li>
<li>
<label for="chkDataMatrix">
<input id="chkDataMatrix" name="BarcodeType" type="checkbox" value="0x8000000">
<span>DataMatrix</span><br />
<div class="imgWrapper">
<img src="assets/images/dm.gif" width="60" alt="Barcode Type DataMatrix" /></div>
</label>
</li>
</ul>
</div>
<div class="step step3">
<span class="num">3</span> <a id="readBarcode" name="RecgabtnCssBarcode" onclick="doReadBarcode();">
</a>
<div id="resultBox">
</div>
</div>
<!--</form>-->
</div>
</div>
</body>
</html>
Create server.js and specify the resource directory in express.static:
app.use(express.static(__dirname));
Parse Form and Save Uploaded Files with Formidable
var form = new formidable.IncomingForm();
form.parse(req, function(err, fields, files) {
var dir = 'uploads';
var flag = fields.uploadFlag;
var barcodeType = parseInt(fields.barcodetype);
fs.readFile(files.fileToUpload.path, function(err, data) {
// save file from temp dir to new dir
var fileName = path.join(__dirname, dir, files.fileToUpload.name);
fs.writeFile(fileName, data, function(err) {
if (err) throw err;
decodeBarcode(res, license, fileName, barcodeType);
});
});
});
Download Files with Node.js
var tmpFileName = path.join(__dirname, dir, 'tmp.jpg');
var tmp = fs.createWriteStream(tmpFileName);
var url = fields.fileToDownload;
console.log('url: ' + url);
http.get(url, function(response) {
response.pipe(tmp);
tmp.on('finish', function() {
tmp.close(function() {
decodeBarcode(res, license, tmpFileName, barcodeType);
});
});
});
Read Barcode Images in Node.js
function decodeBarcode(res, license, fileName, barcodeType) {
// read barcode using dbr
dbr.decodeFile(
license, fileName, barcodeType,
function(msg) {
var response = 'Totol count: ' + msg.length;
var result = null;
for (index in msg) {
result = msg[index]
response += '<p>' + result['format'] + ': ';
response += result['value'] + '<p>';
}
res.send(response);
}
);
}
Test Online Barcode Reader
Run server.js:
node server.js
Visit http://localhost:2016/index.htm:
Source Code
https://github.com/dynamsoftsamples/node-barcode-addon-for-linux