How to Create a Web Barcode Reader App with PHP and Nginx
Dynamsoft Barcode Reader SDK written in C/C++ is capable of reading a variety of 1D and 2D barcode formats including Code 39, Code 93, Code 128, Codabar, QRCode, DataMatrix, PDF417 and so on. In this post, I’m going to demo how to use the SDK to make a simple Web barcode reader app with PHP and Nginx.
Prerequisites
Step 1: How to Build PHP Custom Extension with Dynamsoft Barcode Reader SDK
To use Dynamsoft Barcode Reader SDK with PHP, we need to create a PHP custom extension - php_dbr.dll. Read the tutorial Making PHP Barcode Extension with Dynamsoft Barcode SDK to build your own PHP barcode extension.
Step 2: How to Configure PHP Environment
- Copy php_dbr.dll to %php%\ext.
- Copy DynamsoftBarcodeReaderx86.dll to PHP root directory %php%.
- Open %php%\php.ini and add following line:
extension=php_dbr.dll
Change max file size if you want to upload big image files:
upload_max_filesize=20M
Step 3: How to Configure Nginx for PHP
Open %nginx%\conf\nginx.conf and add PHP configuration:
location ~ \.php$ {
root html;
fastcgi_pass 127.0.0.1:9000;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME <Your Web App Folder>/$fastcgi_script_name;
include fastcgi_params;
}
When uploading big files, you may see the error nginx 413 Request Entity Too Large. To fix it, change file size in configuration file:
client_max_body_size 50M;
Step 4: How to Implement Web Barcode App in PHP on Windows
Create a page index.php.
<!DOCTYPE html>
<html>
<head>
<title>Dynamsoft PHP Barcode Reader</title>
<script src="jquery-1.11.3.min.js"></script>
<script src="tiff.min.js"></script>
</head>
<body>
<H1>Dynamsoft PHP Barcode Reader</H1>
<form action="dbr.php" method="post" enctype="multipart/form-data">
Select barcode image:
<input type="file" name="readBarcode" id="readBarcode" accept="image/*"><br>
<input type="submit" value="Read Barcode" name="submit">
</form>
<div id="tiff"></div>
<div id='image'></div>
<script>
function reset() {
$("#image").empty();
$("#tiff").empty();
}
var input = document.querySelector('input[type=file]');
input.onchange = function() {
reset();
var file = input.files[0];
var fileReader = new FileReader();
// get file extension
var extension = file.name.split('.').pop().toLowerCase();
var isTiff = false;
if (extension == "tif" || extension == "tiff") {
isTiff = true;
}
fileReader.onload = function(e) {
if (isTiff) {
console.debug("Parsing TIFF image...");
//initialize with 100MB for large files
Tiff.initialize({
TOTAL_MEMORY: 100000000
});
var tiff = new Tiff({
buffer: e.target.result
});
var tiffCanvas = tiff.toCanvas();
$(tiffCanvas).css({
"max-width": "800px",
"width": "100%",
"height": "auto",
"display": "block",
"padding-top": "10px"
}).addClass("TiffPreview");
$("#tiff").append(tiffCanvas);
}
else {
var dataURL = e.target.result, img = new Image();
img.src = dataURL;
$("#image").append(img);
}
}
if (isTiff) {
fileReader.readAsArrayBuffer(file);
}
else
fileReader.readAsDataURL(file);
}
</script>
</body>
</html>
Because Dynamsoft Barcode Reader supports TIFF image format, in order to load TIFF in HTML5, we can use the tiff js library.
Create dbr.php for reading uploaded barcode images.
<?php
// create absolute file path
function file_build_path(...$segments) {
return join(DIRECTORY_SEPARATOR, $segments);
}
$file = basename($_FILES["readBarcode"]["name"]);
echo "<p>$file</p>";
if ($file != NULL && $file != "") {
// get current working directory
$root = getcwd();
// tmp dir for receiving uploaded barcode images
$tmpDir = "uploads/";
if (!file_exists($tmpDir)) {
mkdir($tmpDir);
}
$target_file = $tmpDir . basename($_FILES["readBarcode"]["name"]);
$isSuccessful = true;
$fileType = pathinfo($target_file,PATHINFO_EXTENSION);
if (!$isSuccessful) {
echo "Fail to read barcode";
} else {
if (move_uploaded_file($_FILES["readBarcode"]["tmp_name"], $target_file)) {
// dynamsoft barcode reader
$path = file_build_path($root, $target_file);
/*
* Description:
* array DecodeBarcodeFile( string $filename , bool $isNativeOutput [, bool $isLogOn ] )
*
* Return Values:
* If barcode detected, $array[0] is an array.
*/
$resultArray = DecodeBarcodeFile($path, false);
if (is_array($resultArray[0])) {
$resultCount = count($resultArray);
echo "Total count: $resultCount\n";
for($i = 0; $i < $resultCount ; $i++) {
$result = $resultArray[$i];
echo "<p>Barcode format: $result[0], value: $result[1]</p>";
}
}
else {
echo "<p>$resultArray[0]</p>";
}
// delete the uploaded barcode image
unlink($path);
} else {
echo "Fail to read barcode.";
}
}
}
?>
Run php-cgi:
%php%\php-cgi.exe -b 127.0.0.1:9000 -c %php%\php.ini
Run Nginx:
%nginx%\nginx.exe
Visit **localhost:8080/index.php**:
