A shipping label is an identification label that displays information about packages. It may contain the following info: Sender and receiver details (name, phone number, address) Tracking number Barcodes for reading the info with machines A standard shipping label is 4x6 inches (10x15 cm). Sample shipping label: In this article,...

Dynamsoft Document Viewer is an SDK providing a set of viewers for document images. It has added an annotation feature since v2.0, which makes it easy to create a document scanning solution along with the following SDKs: Dynamic Web TWAIN to access document scanners in the browser. Dynamsoft Document Normalizer...

In today’s digital age, efficient document management is crucial for businesses and individuals alike. Integrating document scanning capabilities directly into web applications can significantly streamline workflows, allowing users to digitize and manage documents with ease. In this tutorial, we’ll explore how to leverage the power of the Dynamic Web TWAIN...

Pan and zoom is a useful feature for viewing images. We can zoom in the image to see more details and perform image editing. Dynamsoft Document Viewer is an SDK for such a purpose, which provides a set of viewers for document images. In this article, we are going to...

During document scanning, we may need to select multiple images for reordering, retouching, export, etc. It is useful to have a document viewer which supports selecting multiple images. Dynamsoft Document Viewer is an SDK for such a purpose. It provides a set of viewers for documents. In this article, we...

Barcodes are commonly used to identify retail products. We can also use them to mark documents. For example, we may need to scan a batch of forms. Each form contains several pages and there is a barcode on the first page denoting a unique form number. We can use the...

MRZ stands for machine-readable zone, which is usually at the bottom of the identity page at the beginning of a passport or ID card.1 It can be read by a computing device with a camera to get information like document type, name, document number, nationality, date of birth, sex, and...

MRZ stands for machine-readable zone, which is usually at the bottom of the identity page at the beginning of a passport or ID card.1 It can be read by a computing device with a camera to get information like document type, name, document number, nationality, date of birth, sex, and...

From 9.x to 10.x, the Dynamsoft JavaScript barcode SDK has undergone a complete redesign. The new version not only provides essential barcode scanning functionalities but also integrates seamlessly with other Dynamsoft products, such as Dynamsoft Label Recognizer, Dynamsoft Camera Enhancer, Dynamsoft Document Normalizer, and Dynamsoft Code Parser. All Dynamsoft products...

In Salesforce, the prestigious CRM system, we may often attach images in records, like expenses and invoices, and need to merge all the images into a PDF file for printing and archiving. Since Salesforce does not provide such a feature by default, in this article, we are going to build...

In our daily work, we may need to take some photos and merge the images into a PDF file. This can be done with many applications. Dynamsoft Document Viewer has made it easier since it can do this in the browser. This process can be integrated in our online website,...

When scanning documents via scanners, we may get misoriented document images. The use of automatic document feeding makes it happen more often. We can use image processing to detect the orientation. There are many ways to do this. For example, in Latin script text, ascenders are more likely to occur...

Dynamic Web TWAIN offers two methods for scanning documents from a web page: the HTML5/JavaScript API and the RESTful API. The former is suitable for web applications that require a high level of customization, while the latter is ideal for enterprise-class web applications, such as Salesforce, Oracle APEX, and Microsoft...

In this article, we are going to create a lightning web component to access document scanners in Salesforce, the famous CRM system. Adding extra features to your Salesforce system can provide an integrated user experience. The document scanner feature will be provided by the Dynamic Web TWAIN SDK. It provides...

Salesforce is a famous CRM platform. We can use it to manage our sales and customers. Salesforce comes with great customizability. We can write apps to extend its features. Its latest technology is the lightning web component, which helps us use modern web technologies to build apps. In this article,...

In the previous article, we’ve talked about how to control camera zoom on the web. In this article, we are going to add the feature to automatically zoom in to scan a tiny or distant QR code to a web QR code scanner. Dynamsoft Barcode Reader is used to read...

Using the getUserMedia API, we can open cameras on the web with JavaScript. Starting from Chrome 87, it is also possible to control the camera’s pan, tilt, and zoom, giving more possibilities for making a camera web app. In this article, we are going to talk about how to control...

In today’s fast-paced world, efficiently managing and tracking parcels is crucial for businesses. The use of 1D and 2D barcodes has revolutionized the way parcels are labeled, scanned, and processed. Additionally, Optical Character Recognition (OCR) technology has enabled the digitization of text on parcels, facilitating automated data extraction and processing....

Bulk document scanning, also mass document scanning or batch document scanning, is a process of converting a large number of physical documents into digital files. There are many applications of bulk document scanning and here are some of them: Schools. In schools, pieces of examination paper have to be scanned...

MRZ (machine-readable zone) is a section on ID documents. It is designed to be read by a machine to get the document owner’s info, like name, age, sex and nationality. In this article, we are going to build an expo application to scan MRZ. Dynamsoft Label Recognizer is used to...

Electron is a framework for building cross-platform desktop applications with HTML, JavaScript, and CSS. Since Dynamic Web TWAIN is also a cross-platform JavaScript library for document scanning and management, we can combine Electron and Dynamic Web TWAIN to implement a desktop document scanning and management application for Windows, Linux, and...

When we are holding our phone to take a photo, the image may get blurred after we press the shutter button. There are other ways to trigger the capturing with the phone steady, like using an earphone’s volume button, detecting smile and detecting voice activity. In this article, we are...

When digitizing documents, we may accidentally scan a document image twice. Finding the duplicate images manually is painstaking. In this article, we are going to use JavaScript to detect duplicate document images automatically. How to Calculate the Similarity between Two Images We need to compare two images to check whether...

Many open-source JavaScript libraries for reading barcodes and QR codes exist, yet few are suited for enterprise use due to a lack of long-term updates and maintenance roadmaps. Additionally, the performance of pure JavaScript often falls short. For those prioritizing performance, WebAssembly serves as a superior alternative to pure JavaScript...

Starting from version 18.0, the Dynamic Web TWAIN SDK has expanded its support for the eSCL protocol. This enhancement enables the SDK to support not only USB-connected scanners but also network scanners. Furthermore, Dynamsoft has released an Android app for eSCL communication, benefiting both Android and Chromebook users. This breakthrough...

Node.js, Express, and Jade are technologies often used together to build web applications. Node.js runs the server, handling HTTP requests and responses. Express is used to simplify the routing and middleware setup, managing everything from routes to handling requests and views. Jade is used as the templating engine within Express....

An identity document or ID card is any document that may be used to prove a person’s identity. There are various forms of identity documents: driver’s license, passport and formal identity card. Barcodes and MRZ (machine-readable zones) are often printed on an ID card so that its info can be...

Shadow DOM is a web standard designed to encapsulate HTML and CSS into web components. It allows for the creation of separate DOM trees and specifies how these trees interact with each other in a document. Polymer is a library developed by Google to make it easier to create reusable...

An identity document or ID card is any document that may be used to prove a person’s identity. There are various forms of identity documents: driver’s license, passport and formal identity card. Barcodes and MRZ (machine-readable zones) are often printed on an ID card so that its info can be...

Go’s native support for concurrency is one of its standout features, making it an excellent choice for building web servers capable of handling multiple requests simultaneously and efficiently. In this article, we’ll guide you through the creation of a web application designed to decode multiple barcode images uploaded by users....

The Dynamic Web TWAIN SDK is renowned for its capabilities in document scanning, uploading, editing, and saving. In this article, we will explore the image tagging and grouping feature for document management applications. For instance, you can tag images with a date, project name, or customer name, enabling you to...

In the previous article, we talked about what is QR code, its modes for encoding the data, and how to generate QR codes in Python. In this article, we are going to build an online QR code generator to make it convenient to generate QR codes in the browser. We...

A barcode or bar code is a method of representing data in a visual, machine-readable form. There are all kinds of barcodes and mainly, they can be divided into 1D barcodes and 2D barcodes. We can get binary data from barcodes and there are different ways to interpret the data....

Zapier is a workflow automation platform. It has integrated over 6000 applications and we can chain different applications in the same workflow without writing code. In this article, we are going to build a Zapier app integration to scan barcodes. We can scan barcodes in a web application and the...

In the previous article, we demonstrated the implementation of a web application for scanning and uploading documents using Dynamic Web TWAIN and Node.js. In this article, we will guide you through achieving the same functionality using Go. The process closely mirrors the Node.js implementation, allowing you to reuse client-side resources...

In the digital era, managing documents efficiently is crucial for businesses and individuals alike. With the rise of web technologies, scanning and uploading documents through web applications has become a sought-after feature. This article introduces a practical way to implement document scanning and uploading in a web application using Dynamic...

Filters are commonly used to adjust the rendering of images. We can use it to make images sharper, remove unwanted objects, or adjust the color tone. In this article, we are going to build a JavaScript library to perform various image filters. It can be used together with Dynamsoft Document...

Identity documents are adopted in many countries to prove a person’s identity. They usually have a card design around 8.6 cm x 5.4 cm in size with three-line MRZ, like ID cards in Germany and the Netherlands. Dutch ID Card Specimen: In this article, we are going to talk about...

In the fast-paced realm of web development, seamlessly integrating varied functionalities into web applications has become increasingly essential. Technologies such as barcode detection, Machine Readable Zones (MRZ) recognition, and document rectification are pivotal tools adopted in various domains, including retail, travel, and document management. In this article, we’ll explore how...

A Domain-Specific Language (DSL) is a computer language that’s targeted to a particular kind of problem. Examples of DSLs are CSS, SQL, make, etc. An important and useful distinction Martin Fowler makes is between internal and external DSLs. Internal DSLs are particular ways of using a host language to give...

Whether we scan documents via document scanners or cameras, we may end up getting document images with bad quality. In this article, we are going to talk about how to evaluate the quality of scanned document images so that we can recapture the document to get a better image. A...

A black-and-white binary image consists of pixels that can have one of exactly two colors: black and white. Converting an image to black and white has some usages: File size reduction: a 1-bit binary image requires less data for storage than a 24-bit color image. Image processing: many image processing...

Grayscale images are composed exclusively of shades of gray. They are commonly stored with 8 bits per sampled pixel, which allows 256 different intensities to be recorded. Converting an image to grayscale has some usages: File size reduction: an 8-bit grayscale image often requires less data for storage than a...

Sometimes, we may need to flip a media element in a web app. For example, we may need to flip a video element streaming from a camera to match what we actually see or correct scanned document images that are flipped. In this article, we are going to talk about...

In a document-scanning web app, image resizing is useful as it can correct the proportion of scanned documents and increase the DPI of document images to meet printing requirements. In this article, we are going to talk about how to resize an image with JavaScript. One way is using Canvas...

Sometimes, we may need to rotate an image on a web page, like showing a loading animation. In a document-scanning web app, we need to rotate skewed document images or document images scanned in the wrong direction. In this article, we are going to talk about three ways to rotate...

OpenCV is an open-source computer vision and machine learning software library. It provides various image processing methods for us to solve different tasks. In this article, we are going to build a web document scanner with the JavaScript version of OpenCV. A JavaScript library is made first and then used...

As the web platform develops, we can build rich kinds of applications on it. We can build a web app like a barcode scanner or a document scanner using the getUserMedia API to get camera frames for live analysis. While a barcode scanner may not require high resolution, a document...

Converting PDFs to images is a common task in our daily work. We can use the images for archiving and further editing like OCR. With Dynamic Web TWAIN, a JavaScript document scanning library which has built-in support for various file formats, we can convert PDF to images in HTML5. In...

Two months ago, we published a repository demonstrating how to build a RESTful service with .NET and Dynamsoft Vision SDKs. In this tutorial, the server-side programming language is changed to Node.js. We will go through the steps of creating REST endpoints for scanning documents, decoding barcodes, detecting MRZ, and rectifying...

OpenCV is an open-source computer vision and machine learning software library and has a basic barcode reading ability. It has a QR Code detector added in 2018 and a barcode detector added in 2021 which supports detecting and decoding of EAN-13, EAN-8, and UPC-A barcodes. It has a JavaScript version...

Remix is a full stack web framework that lets you focus on the user interface and work back through web standards to deliver a fast, slick, and resilient user experience. It has been acquired by Shopify and is the recommended framework in React’s docs. In this article, we are going...

A Node.js C++ addon is a module written in C++ that can be loaded into Node.js, used to extend Node.js capabilities by allowing developers to implement functionality in C++. This article will guide you through building a Node.js C++ addon for document edge detection and rectification. The addon relies on...

Lit is a simple library for building fast, lightweight web components. At Lit’s core is a boilerplate-killing component base class that provides reactive state, scoped styles, and a declarative template system that’s tiny, fast and expressive. In this article, we are going to build a web component with LitElement to...

Scanning documents into a digital form can help companies save physical space, improve data retrieval, reduce costs, improve collaboration, etc. Sometimes, we may come across very large scanned document files or files scanned with a low visual quality. In this article, we are going to talk about aspects related to...

Scanned documents often contain skewed or crooked images. They do not look good and are not friendly for OCR. In this article, we are going to use OpenCV and Python to deskew scanned documents based on text lines. Steps to Deskew a Scanned Document Image with OpenCV We are going...

WebRTC (Web Real-Time Communication) is a technology that enables Web applications and sites to capture and optionally stream audio and/or video media, as well as to exchange arbitrary data between browsers. We can use it to open local cameras and stream remote cameras in the browser. In this article, we...

WebRTC (Web Real-Time Communication) is a free and open-source project providing web browsers and mobile applications with real-time communication (RTC) via application programming interfaces (APIs). It provides an API named getUserMedia to access the device’s cameras and microphones. Sometimes, we may need to record a video to save the content...

When developing or selecting an MRZ (Machine Readable Zone) recognition SDK, the primary challenge lies in finding an appropriate dataset for testing. Acquiring genuine MRZ images is challenging, and due to privacy concerns, they aren’t publicly accessible. Therefore, crafting MRZ images becomes a practical solution. Fortunately, there’s an open-source Python...

Many countries have now adopted an ID card design around 8.6 cm x 5.4 cm in size with three-line MRZ, like ID cards in Germany and the Netherlands. Dutch ID Card Specimen: In this article, we are going to talk about how to build an ID card scanner in Ionic...

In the previous article, we talked about the possibility of transferring files via QR codes and built a demo web app. In this article, we are going to build a cross-platform version using Ionic Vue which can run on Android, iOS and Web. The mechanism is also improved by adding...

Dynamsoft’s Web TWAIN SDK has long been a market leader in web-based document scanning, empowering numerous organizations to develop their own document management systems. The SDK consisted of two main components: a Dynamsoft service for scanner management and a JavaScript library for front-end development. Previously, this service could only be...

In this article, we are going to talk about how to build a web app to scan ISBN barcodes to get the info of books and manage bills of books on Airtable. Airtable is a spreadsheet-database hybrid, with the features of a database but applied to a spreadsheet. It can...

GS1 is a not-for-profit, international organization developing and maintaining its own standards for barcodes. GS1 defines the rules to encode a barcode content so that it contains information about a product: its GTIN (Global Trade Item Number), the weight or dimensions of the item, its price, the lot/batch code, the...

Dynamic Web TWAIN is an SDK to enable scanning documents from browsers and Dynamsoft Document Normalizer is an SDK to detect document borders and perform perspective transformation. The two can be used together so that we can automatically crop and straighten documents. A use case is to use a flatbed...

MRZ stands for “machine-readable zone”. It is usually at the bottom of an identity page for machines to read its info like document type, name, nationality, date of birth, sex and expiration date, etc. Dynamsoft Label Recognizer can read MRZ with sophisticated image processing algorithms and provides a JavaScript edition....

MRZ stands for “machine-readable zone”. It is usually at the bottom of an identity page for machines to read its info like document type, name, nationality, date of birth, sex and expiration date, etc. Dynamsoft Label Recognizer can read MRZ with sophisticated image processing algorithms and provides a JavaScript edition....

Dynamic Web TWAIN is a document-scanning SDK which makes it possible to access document scanners in the browser. It comes with the support of various image formats. We can use it to create an on-premises online image converter. You can press the button above to have a try. It has...

Tag Image File Format, abbreviated TIFF or TIF, is an image file format for storing raster graphics images. It has several differences from most other image file formats: TIFF allows a flexible set of information fields called tags. TIFF allows a flexible combination of colorspace, bitdepth/datatype, and compression scheme. TIFF...

In the previous article, we run a QR code scanner in React-Native-WebView on Android and iOS. React Native can also run in a web browser with React Native Web, which uses React DOM to accurately render React Native compatible JavaScript code in a web page. In this article, we are...

Image cropping is a common image processing task where we only need a potion of an image. In most cases, we make a rectangular selection box for cropping. But for cases like document scanning, we need to make a polygonal selection box. Perspective transformation is needed to normalize the document....

Glide is a no-code app builder which makes it easy to create apps. Dynamsoft is a partner of Glide to provide it with the barcode scanning feature based on its barcode reading SDK. In this article, we are going to use Glide to create a demo app which scans barcodes....

Full-text search is a process of examining all of the words in every stored document to find documents meeting a certain criteria (e.g. text specified by a user). It is possible for the full-text-search engine to directly scan the contents of the documents if the number of documents is small....

IndexedDB is a low-level API for client-side storage of significant amounts of structured data, including files/blobs. It can be used to save images like scanned documents on the client for persistant storage. In this article, we are going to talk about how to use Dynamic Web TWAIN to scan documents...

Large language models (LLMs) are emerging which can help us in tasks like text summarization, translation, question answering, etc and OpenAI’s ChatGPT is one of the state-of-art models which is available via its web or API interfaces. ChatGPT can be useful for document management. One use case of it is...

Paper documents are still ubiquitous in our everyday work, like invoices, checks and printed books. It takes effort to manage them. With Dynamic Web TWAIN, we can build a web application to scan documents from document scanners. But further steps are required to better manage the documents and OCR is...

Notion is an all-in-one workspace for us to use the computer. It is basically a note-taking app but it is more than that with great customizability. In this article, we are going to build a web app to scan ISBN barcodes to get the info of books and save them...

Dynamic Web TWAIN is an SDK which enables document scanning and viewing from browsers. It can display PDF files in a customizable viewer. In this article, we are going to build a web component with Stencil.js to wrap Dynamic Web TWAIN as a PDF viewer so that we can embed...

Patch Code is a barcode developed by Kodak for use in automated scanning. It is mainly used to classify or organize documents. Several documents may need to be scanned and we have to save them into different PDF files. Instead of running several separate jobs (loading the scanner with each...

The International Standard Book Number (ISBN) is a numeric commercial book identifier.1 It is a special kind of the EAN-13 barcode format for books. It may also include an EAN-5 add-on which indicates the price info. We can use ISBN for book management, inventory tracking, retails, etc. In this article,...

Next.js is the recommended framework to create React applications with extra features like server-side rendering and an intuitive router. In this article, we are going to create a document scanning app with Next.js and Dynamic Web TWAIN. Getting Started With Dynamic Web TWAIN Build a Document Scanning Web App with...

In the previous article, we’ve created an Oracle APEX application to scan documents. In this article, we are going to add barcode scanning function to the Oracle APEX application with Dynamsoft Barcode Reader. You can check out the video to see what it does. Build an Oracle APEX Application to...

Document capture functionality is an essential aspect of any document management system, allowing users to capture digital images of physical documents through a variety of means, including scanners and mobile cameras. Dynamic Web TWAIN helps users easily integrate document capture functionality into their web-based document management system, enabling them to...

Oracle APEX (also known as APEX or Oracle Application Express) is an enterprise low-code development platform from Oracle Corporation that is used to develop and deploy web applications on Oracle databases. APEX provides a web-based integrated development environment (IDE) that uses wizards, drag-and-drop layout, and property editors to build applications...

Next.js is a flexible React framework that gives you building blocks to create fast web applications. It can pre-render your React app so that it is SEO-friendly. It supports several types of pre-rendering including server-side rendering or static generation, and updating or creating content at runtime with incremental static regeneration....

Near-field communication (NFC) is a set of communication protocols that enables communication between two electronic devices over a distance of 4 cm (11⁄2 in) or less.1 We can store the data in an NFC tag in the NDEF format and then put a phone with NFC support to read its...

In the previous article, we talked about how to scan documents in a FileMaker custom app using Dynamic Web TWAIN. In this article, we are going to add a barcode scanning function in a FileMaker custom app using Dynamsoft Barcode Reader. We embed an MQTT receiver web app in the...

FileMaker is a cross-platform relational database application. It integrates a database engine with a graphical user interface (GUI) and security features, allowing users to modify a database by dragging new elements into layouts, screens, or forms.1 It has become a low-code tool to build apps for businesses. There are some...

In places like laboratories, we often need to scan a tray of multiple tubes with barcodes on the top (like the following image). The tubes may be used for Covid-19 PCR test. They need to be retrieved in reading order (from left to right and line by line from the...

In scenarios like inventory management and checkout, we often need to get the barcodes into a PC device. We can use a handheld laser barcode scanner to scan the barcodes and send the results to a PC device via USB, Bluetooth or network. But as smartphones are ubiquitous now, we...

Chrome extensions are software programs, built on web technologies (such as HTML, CSS, and JavaScript) that enable users to customize the Chrome browsing experience.1 In this article, we are going to write a Chrome extension to add the barcode reading function to web pages with Dynamsoft Barcode Reader. The extension...

Chrome extensions are software programs, built on web technologies (such as HTML, CSS, and JavaScript) that enable users to customize the Chrome browsing experience.1 In this article, we are going to write a Chrome extension to add the document scanning function to web pages. Dynamic Web TWAIN is used to...

Quasar is a Vue.js-based framework, which allows web developers to quickly create responsive websites/apps. It can use Electron to build multi-platform desktop apps. In this article, we are going to build a document scanning desktop app with Quasar and Electron. Dynamic Web TWAIN is used to provide the ability to...

The International Mobile Equipment Identity (IMEI) is a numeric identifier, usually unique, for 3GPP and iDEN mobile phones, as well as some satellite phones. It is usually found printed inside the battery compartment of the phone but can also be displayed on-screen on most phones by entering *#06# MMI Supplementary...

Solidjs is a web framework like React. Instead of using techniques like virtual DOM, it compiles its templates to real DOM nodes and updates them with fine-grained reactions. In this article, we are going to build a barcode and QR code scanner using Solidjs. Dynamsoft Camera Enhancer is used to...

Barcode reading is a complex task with different challenging scenarios. To suit most scenarios, Dynamsoft Barcode Reader provides rich image processing parameters which users can adjust. There are two ways to adjust the parameters. One is via the code: // JavaScript example to set the barcode format to QR code...

In the previous article, we’ve built a NativeScript plugin for camera preview. In this article, we are going to create a NativeScript plugin for Dynamsoft Barcode Reader which can be used for scanning barcodes or QR codes. This article is Part 2 in a 2-Part Series. Part 1 - How...

NativeScript is an open-source native runtime for building native mobile apps with JavaScript. We can easily call native APIs using JavaScript. A NativeScript plugin is any npm package that exposes a native API via JavaScript which is made convenient for projects to use. In this article, we are going to...

Node-RED is a powerful flow-based programming tool built on Node.js that allows users to create applications by visually wiring together different nodes in a browser-based editor. In this article, you’ll learn how to create a custom barcode and QR code detection node using the Dynamsoft Barcode Reader, enhancing your Node-RED...

Dynamic Web TWAIN is well-known for document scanner programming. It provides a set of JavaScript API to simplify the way of integrating document scan functions into web applications. Most of the time, we use Dynamic Web TWAIN with its built-in UI. However, the default UI may not be suitable for...

Dynamic Web TWAIN has a new scanDocument API since v17.2, which makes it easy to capture documents using mobile cameras with its document border detection and editing feature along with ready-to-use UIs. In this article, we are going to create a mobile document scanning app using Ionic Vue. Ionic is...

Dynamsoft Document Normalizer SDK provides a set of APIs to detect the edges of a document and normalize the document based on the found quadrilaterals. The JavaScript edition of the SDK has been published on npm. In this article, we will firstly show you how to use the JavaScript APIs...

Capacitor is an open-source native runtime created by the Ionic team for building Web Native apps. We can use it to create cross-platform iOS, Android, and Progressive Web Apps with JavaScript, HTML, and CSS. Using Capacitor plugins, we can use JavaScript to interface directly with native APIs. In this article,...

A progressive web application (PWA) is a type of application software delivered through the web1. It is able to be installed like a local app so that we can access it later without an Internet connection. In this article, we are going to build a document scanning desktop app with...

Svelte is a web framework like React or Vue. Instead of using techniques like virtual DOM diffing, Svelte writes code that surgically updates the DOM when the state of your app changes. In this article, we are going to build a barcode and QR code scanner using Svelte. Dynamsoft Camera...

Tauri is a framework for building desktop apps for all major platforms. Developers can integrate any front-end framework that compiles to HTML, JS and CSS for building their user interface. The backend of the application is a Rust-sourced binary with an API that the front-end can interact with. Different from...

Ionic is a popular framework to build cross-platform mobile web apps. In this article, we are going to build an Ionic Angular app based on Cordova to scan the MRZ codes which are often found on passports. The JavaScript version of Dynamsoft Label Recognizer is used to provide the ability...

This article aims to build a Node.js module to recognize MRZ from passport, ID card, and travel documents on Windows and Linux. The module is implemented based on Dynamsoft C++ OCR SDK. This article is Part 3 in a 7-Part Series. Part 1 - Making Web Passport MRZ Reader and...

In tasks like barcode scanning and text recognition, we often need to limit the scan region so that only the desired info is extracted. In this article, we are going to build a viewfinder web component as the following which shows which area will be processed. Stencil.js is used to...

In the previous article, we’ve built a React camera component. In this article, we are going to extend the camera component to create a React barcode and QR code scanning library using Dynamsoft Barcode Reader. Getting started with Dynamsoft Barcode Reader Create a React Barcode and QR Code Scanning Library...

With the getUserMedia API, we can access the camera in web browsers, which makes it possible to do computer vision tasks like barcode scanning. In this article, we are going to build a camera component for React with hooks. Build a React Camera Component with Hooks We are going to...

Using the getUserMedia API, we can get the camera preview in a video element, which makes it possible to do computer vision tasks like barcode scanning in a browser. In this article, we are going to write a camera component for Vue using getUserMedia and build a barcode scanning demo...

Web Components are a set of features that provide a standard component model for the Web allowing for encapsulation and interoperability of individual HTML elements. 1 We can define a custom element to use in any HTML environment, with any framework, or with no framework at all. Stencil is a...

Progressive web apps (PWA), simply to say, are web apps that running like native apps on the desktop and mobile platforms. The advantages of PWA include installable, discoverable, linkable and so on. In this article, I’m trying to give a snapshot of a simple PWA barcode reader project built with...

Noise in barcode images poses a challenge for successful barcode reading. There are many types of noise. Here are some examples: Patterned noise caused by bad printing or scanning.1 Image source Noise caused by taking a photo with digital cameras in low light.2 We can run image processing to improve...

The Ionic framework has shifted its native runtime from Cordova to Capacitor. But we can still create Ionic Angular projects based on Cordova. In this article, we are going to create an Ionic Angular QR code scanning app based on Cordova using the cordova-plugin-dynamsoft-barcode-reader and the ionic wrapper. Preview of...

The WebView component included in modern mobile operating systems is becoming more and more powerful. For example, it supports showing the camera preview using getUserMedia and has support for WebAssembly, which makes it possible to use Dynamsoft Label Recognizer to create a text scanner to recognize text like passports’ machine-readable...

Dynamsoft Barcode Reader, as an enterprise-class barcode and QR code SDK, supports many platforms (Windows, Linux, macOS, Android, iOS, Raspberry Pi OS, and Web) and programming languages (Python, Java, Swift, C#, Cpp, and JavaScript). There are many sample projects distributed in Dynamsoft GitHub repositories and official website. To help developers...

In many barcode scanning situations, we only need to select one barcode while there are many other barcodes around it. How to avoid scanning unwanted barcodes and only get the barcode result we want? In this article, we are going to talk about ways to select one barcode from many....

In the previous article, we’ve talked about how to use the Barcode Detection API to create a web QR code scanner. However, not many browsers support the API. So in this article, we are going to write a polyfill for the Barcode Detection API with the JavaScript version of Dynamsoft...

The Web Platform Incubator Community Group has published a Shape Detection API specification. The API aims at detecting features like faces and QR codes from images. It is still in draft status and has limited browser support. In this article, we are going to use the Barcode Detection API included...

The Ionic framework has shifted its native runtime from Cordova to Capacitor. But for compatibility concerns and the fact that there are many good Cordova plugins, we can still use Cordova plugins in an Ionic project. We can directly use Cordova plugins with the cordova object, but there is a...

Dynamic Web TWAIN has a new scanDocument API since v17.2, which makes it easy to capture documents using mobile cameras with its document border detection feature. Along with the RemoteScan feature that connects physical document scanners, we can now build a decent mobile document scanner with web technologies. In this...

While scanning barcodes and QR codes from a camera stream, it is necessary to first convert color images encoded in RGB or YUV to grayscale images, and then convert these grayscale images to binary images before decoding. Operating on image pixels consumes considerable CPU time. To speed up image processing,...

Dynamic Web TWAIN is a cross-platform document scanning SDK that allows developers to build document management applications using HTML5 and JavaScript on Windows, Linux, and macOS. The Linux edition of Dynamic Web TWAIN supports both x64 and amr64 Linux OS, which means in addition to desktop PCs, you can also...

Recently, Dynamsoft compiled the C++ OCR SDK to a web assembly module. It aims to help web developers to build web passport MRZ scanner applications using HTML5 and JavaScript. This article shows how to build web applications to read MRZ information from passport images and scan passport MRZ information with...

The MediaDevices.getUserMedia() API is the standard method for accessing cameras from web browsers. While it is straightforward, creating a complete web camera viewer involves considerable effort. Until recently, there was no ready-to-use JavaScript camera widget. However, with the release of the Dynamsoft Camera Enhancer library, this task has become much...

As the dominant JavaScript document scanning SDK, Dynamic Web TWAIN has recently adopted WebAssembly as the new weapon. From version 17.2, Dynamic Web TWAIN does not only support cross-platform (Windows, Linux, and macOS) scanner access, but also allows developers to utilize desktop and mobile cameras to scan documents using JavaScript....

Scalable Vector Graphics, SVG, is a W3C XML dialect to mark up graphics1. SVG can be created dynamically with JavaScript and injected into the HTML DOM2. Using SVG, it is very easy to draw a graphics in a web page. Below is a polygon example: <svg width="100" height="100" version="1.1" xmlns="http://www.w3.org/2000/svg">...

QR code is useful to transfer data across different devices. An Android device can exchange data with an iOS device through a QR code. It does not require setting up a wireless network and does not have the hassle of pairing using Bluetooth. As it is a screen-camera solution, it...

Updated in 2021: The Dynamsoft Barcode Reader now has a client-side JavaScript SDK which makes it possible to read barcodes from within the browser. Learn about the JavaScript SDK The Dynamsoft Barcode Reader now has mobile native SDKs supporting Android and iOS. The Dynamsoft Barcode Reader now has an official...

Continuous file synchronization programs synchronize files between two or more devices in real time. We can use them to sync scanned documents so that we can access the files on multiple devices. There are many cloud storage services which do the job, like Box, Dropbox, Onedrive and Google Drive. There...

Since from version 17.1, Chromes OS comes into the supporting list of Dynamic Web TWAIN. The supported desktop operating systems of Dynamic Web TWAIN now include Windows, Linux, macOS, Raspberry Pi OS and Chrome OS. This article helps Chromebook users to install Dynamic Web TWAIN service in Chrome OS. Building...

Cameras are now ubiquitous in our life. Every mobile phone has built-in cameras which can shoot nice photos. As for document scanning, there is document camera (also called overhead scanner) which is adjustable and has high resolution. Image source: https://www.amazon.com/Conferencing-Recording-Classroom-Real-time-Definition/dp/B08V4WLPX1/ A document camera has the following benefits: Users don’t have...

In the B4X developing suite, B4J is used to develop desktop apps based on JavaFX or server apps based on Jetty. By default, it cannot be used to create web applications without a server. A third-party library, BANano, makes this possible. It can transpile everything you write in B4J to...

Have you ever thought about how to create a Web document scanning application using Ruby on Rails? In this tutorial, we go through how to create a Rails project with Dynamic Web TWAIN (DWT) SDK for loading, scanning and uploading document files. Installation Dynamic Web TWAIN 17.0 Ruby 2.5.1 sudo...

This week, I made a new attempt, integrating Dynamsoft JavaScript Barcode SDK into the ongoing Flutter barcode plugin project. It is exciting to be capable of building web barcode reader apps with the same decodeFile() method used for mobile and desktop development. This article is Part 3 in a 5-Part...

The barcode localization algorithm is an essential step for barcode recognition within an image. However, for static images, the bigger size images have, the much more time the algorithm takes. Plus, the success rate of the algorithm may be interfered by the background color and the foreground color. It is...

While using Salesforce, you can easily extend your management system’s functionalities by installing apps from Salesforce AppExchange, the Salesforce marketplace. But what if you want to build a Salesforce app yourself? In this article, I’ll guide you through creating a barcode reader app for Salesforce from scratch. Prerequisites Include the...

A few weeks ago, I wrote an article sharing how to read driver’s license information from PDF417 on Android. Compared to building an Android native camera app, building a web camera app is much easier. In this article, let’s take a glimpse at a JavaScript sample, which is implemented with...

Webpack is a JavaScript module bundler. It is widely used in web frameworks, such as React and Angular. This tutorial shows how to implement a simple web barcode reading app with webpack and Dynamsoft JavaScript Barcode library. What You Should Know Setting Up a Basic Project with Webpack Create a...

Vaadin platform, similar to GWT (Google Web Toolkit), is a set of web components that allow developers to implement HTML5 web apps using the Java programming language. This tutorial aims to help developers to create a simple web document scanning app with Vaadin and Dynamic Web TWAIN SDK. Setting Up...

Someone asked me how to create a real-time web barcode scanning app with a webcam. Is it hard to implement it? I’ve written an article sharing how to integrate Dynamsoft JavaScript Barcode Reader SDK into a React project. The remaining work is to make a webcam component. Since there is...

A JavaScript barcode SDK can be built in C/C++ for high performance. We can compile C/C++ code to a Node.js addon or WebAssembly. Which one is superior? Let’s try Dynamsoft Barcode Reader SDK to find the answer. What You Should Know Node.js C++ Addon vs. WebAssembly Speed Performance is vital...

WebAssembly (Wasm) is a revolutionary technology for Web development. It aims to execute at native speed in web browsers. With WebAssembly, it is convenient to port C/C++ code for web client and server applications. Dynamsoft Barcode Reader 6.2 is the most potent barcode SDK ever, and its WebAssembly edition is on the...

It was my first time to hear about WebAssembly when watching Google I/O ‘17. WebAssembly (wasm) lets developers compile C/C++ or other statically typed languages into JavaScript for building high-performance web apps. Assume I have a C/C++ barcode detection or OCR library deployed on server-side,  I can now move it to the...

If you always stay tuned to Dynamsoft Barcode SDK, you should have noticed that starting with version 5.1, the SDK includes a JavaScript library which is similar to Dynamic Web TWAIN. The article aims to help developers get familiar with the relevant JavaScript Barcode APIs and build web barcode reader...

When using React and Dynamic Web TWAIN to create a web document scanning app, I was confused about how to load dynamsoft.webtwain.min.js, a global JavaScript library like jQuery, into my project. I spent some time searching Google for relevant questions, but it was hard to find useful answers. Then I...

React Native is a JavaScript framework that enables developers to build mobile apps for Android and iOS platforms with one codebase. Even if you are a web developer, you can quickly develop mobile applications using React Native. Not like Cordova that uses WebViews, React Native produces a truly native user...

Cordova is a mobile application development framework that enables developers to build Android, iOS and Windows Phone apps using HTML5, JavaScript, and CSS3. It uses web views to render UI elements instead of the platform’s native UI framework. Cordova can be extended to add more functionalities with plugins. There are...

If you want to open webcam stream in a web browser, what technology will you choose? Probably many developers’ answer is HTML5. Yes, with the JavaScript API getUserMedia, it will be pretty easy to open webcam within web browsers. However, the API is not supported by some old web browsers like...

It is known that getUserMedia, the API defined by WebRTC, is the main method for accessing media capture devices such as webcam and microphone in web pages. The compatible desktop web browsers include Chrome, Firefox, Opera, and Edge. This article will share the resources for learning how to capture and...

Have you ever imagined to build a JavaScript document scanning solution for Windows, Linux, and macOS from one single codebase? To make it, you need to find a solution that compatible with different scanner driver types: TWAIN for Windows, SANE for Linux, TWAIN, and ICA for macOS. A good news...

Apache Cordova (formerly PhoneGap) is a mobile application development framework that enables developers to build mobile apps using CSS, JavaScript, and HTML. Different from Xamarin that converting C# code to native apps, Cordova composes apps with hybrid code - all UI layouts are rendered with web technologies via web views...

Building desktop applications is not as easy as developing web applications because it is platform-related. You may need to learn C# for Windows, C/C++ for Linux, and Swift for Mac. For Java developers, it is convenient to create universal desktop applications in Swing and JavaFX. What about web developers, who...

Last week, I shared how to build PHP extension on Linux, as well as how to make a simple PHP barcode reader with a few lines of PHP code. In this post, I will illustrate how to implement an online barcode reader with the custom PHP extension, and how to...

As cloud computing market continues to skyrocket, more and more IT companies tend to release cloud APIs for developers. Most cloud APIs are exposed via REST (Representational state transfer) Web service. In this post, I will illustrate how to create a barcode reader with Node REST Framework Restify and Dynamsoft...

When writing code in IDEs (Visual Studio, Eclipse, Netbeans, Aptana, etc.), developers need to find useful APIs and relevant documentations quickly. The assist function (e.g. IntelliSense) is usually triggered by the shortcut keys Ctrl + space. See the screenshots of Microsoft Visual Studio and Netbeans. All smart IDEs could automatically...

Some Java developers asked a question about how to use Dynamic Web TWAIN (DWT) to upload image files when building a Web application with Struts. In this tutorial, I’d like to make a detailed explanation. How to Upload Files with Struts Using NetBeans IDE, we can quickly create a Struts...

Think of the game, we know that we have 4 teams in play. At a given time, all we need to see is where these 16 planes are. For the game engine, all it needs to know is the coordinates of these 16 planes. So we need to create another...

Today we start making our Modern Ludo Game from scratch. The first thing to do is draw the board. For this part, we’ll simply use the in HTML5. The MarkUp is very simple: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>ModernLudo</title> <link rel="stylesheet" type="text/css" href="Styles/modernludo.css" /> </head> <body> <div id="playGround" style="display:none;"> <div...

A Chrome extension is a package of files including a manifest file, HTML files, JavaScript files and other resources. With extensions, we can add more functionalities to empower Chrome. Getting Started with Chrome Extension Chrome Extension Samples Anatomy of Web Page Screenshots The manifest file: { "name": "Screenshot Extension", "version":...

In this tutorial, I want to make a more complicated WebSocket demo, which enables me to capture images from scanners on server side, and view the images in desktop web browsers or mobile web browsers. Here is the flowchart:   Prerequisites Read Image Transmission between a HTML5 WebSocket Server and...

HTML5 WebSocket facilitates the communication between web browsers and local/remote servers. If you want to learn a simple websocket example, creating a WebSocket Server in C## and a Web client in JavaScript, you can refer to SuperWebSocket, which is a .NET implementation of Web Socket Server. In this article, I...

Last time, I shared my experience about how to use JavaScript saving HTML canvas data to local disk in Chrome. In this tutorial, I would like to share how to save HTML canvas data to remote service with JavaScript and PHP. Ads Powered by Dynamsoft Uploading canvas data is a...

This article aims to share how to use the QR code plugin to implement a free online app with Google App Engine. How to Implement QR Code Generator Download jQuery QRCode plugin. Download JavaScript UTF-8. Create a project named qrcode, and create a file called qrcode.html. Include plugins: <script src="js/jquery.min.js"></script>...

In HTML5, there is a new tag <canvas>, which is used to draw graphics via JavaScript. In this tutorial, I would like to share how to draw images on canvas, and how to save the canvas data to local disk by clicking button. Ads Powered by Dynamsoft Draw Images on...