Tag: html5
-
When dealing with bulk document scanning, one of the biggest challenges is making scanned documents searchable and organized. Unlike digital-born documents, scanned images are essentially pictures—you can’t search them, copy text from them, or organize them by content. This is where Optical Character Recognition (OCR) becomes invaluable. In this comprehensive...
-
In today’s digital workplace, the ability to quickly scan, process, and understand documents is crucial. Whether you’re digitizing invoices, processing legal documents, or managing medical records, having an efficient document workflow can save hours of manual work. In this comprehensive tutorial, you’ll learn how to build a modern web-based document...
-
Organizations of all sizes face a common challenge: efficiently managing the vast documents that power their operations. Manual data entry is a persistent bottleneck—time-consuming, error-prone, and costly—that hurts productivity and increases expenses. Optical Character Recognition (OCR) technology solves this by converting scanned documents into fully searchable, editable text for modern...
-
Imagine this scenario: An operator at an insurance firm has just spent 20 minutes scanning a 500-page claim file. Suddenly, the browser freezes and crashes due to memory exhaustion. All that work is lost instantly. For developers building web-based document management systems, this is a nightmare. Browsers like Chrome and...
-
The Dynamic Web TWAIN service is the local bridge between browser applications and scanners. The first time a user visits a web scanning app built with Dynamic Web TWAIN, they’re prompted to install this service so scanning can work. In some scenarios, you may want tighter control: ship the service...
-
Document scanning applications are essential for modern businesses, yet building them from scratch is often time‑consuming and complex. In this tutorial, we will explore how to use Claude Sonnet 4 (Claude AI agent) to quickly and efficiently create a professional web document scanning application with the Dynamic Web TWAIN SDK....
-
Document scanning workflows often involve processing multi-page documents that contain separator pages or blank pages used for organizational purposes. Manually identifying and removing these blank pages while splitting documents can be time-consuming and error-prone. In this tutorial, we’ll explore how to implement intelligent document splitting using Dynamic Web TWAIN’s powerful...
-
Embedding a PDF file in HTML is useful since the user can view and edit PDF files right in the browser. In this article, we are going to talk about different ways to do this. What you’ll build: A practical comparison of every method to embed a PDF in HTML...
-
A modern web-based document management application is essential for organizations looking to digitize their paper-based workflows and streamline document processing. In this tutorial, we’ll build a professional document management application that demonstrates the four core features essential for modern document processing: scan, split, merge through drag-and-drop, and save as PDF....
-
The Dynamsoft Barcode Scanner JavaScript SDK (v10.5) is built on top of the Dynamsoft Capture Vision SDK, providing ready-to-use user interfaces and advanced APIs to simplify the development of web-based barcode scanner applications. In this tutorial, you’ll learn how to: Integrate the SDK into your HTML5 + JavaScript app Scan...
-
A mobile document scanner app typically includes features such as document capture, editing, and saving as PDF files. Since we’ve already created a web application with similar functionality using HTML5, JavaScript, and the Dynamsoft Document Viewer SDK,we can integrate that web app into an Android/iOS WebView to quickly develop mobile...
-
The Dynamsoft MRZ Scanner JavaScript SDK is a powerful, high-level wrapper built on top of the lower-level Dynamsoft Capture Vision API, designed to help developers add Machine Readable Zone (MRZ) recognition to any web application with ease. It is open-source and provides a clean and customizable API for scanning MRZ...
-
Starting from .NET 9, there is a new HybridWebView control in MAUI which makes it easy to host arbitrary HTML/JS/CSS content in a web view, and enables communication between the code in the web view (JavaScript) and the code that hosts the web view (C#/.NET). In this article, we are...
-
In the digital era, extracting information from documents and vehicle IDs has become increasingly important for web-based applications. Machine Readable Zones (MRZ) and Vehicle Identification Numbers (VIN) can now be scanned directly in the browser using modern web technologies. In this tutorial, you’ll learn how to build a web-based MRZ...
-
FastAPI is a modern, async-ready Python web framework for building APIs. It wraps low-level ASGI (Asynchronous Server Gateway Interface) interfaces and is built on top of Starlette and Pydantic. The combination of FastAPI and Uvicorn is ideal for creating high-performance web applications. In this article, you’ll learn how to build...
-
Dynamic Web TWAIN Service is the core component of the Dynamic Web TWAIN SDK. It enables you to acquire documents from document scanners over a local network using REST API. This API overcomes the limitations of traditional browser-based scanning solutions by allowing you to capture documents from scanners connected to...
-
Using a phone to scan and print (copy) documents is ideal for convenience, portability, and quick tasks, making it a versatile and practical choice for many users. In this article, we are going to build a web app to scan and print a document on a mobile phone. The following...
-
vCard, also known as VCF (“Virtual Contact File”), is a file format standard for electronic business cards. The following is an example of the content of a vCard file: BEGIN:VCARD VERSION:4.0 FN:Simon Perreault N:Perreault;Simon;;;ing. jr,M.Sc. BDAY:--0203 GENDER:M EMAIL;TYPE=work:simon.perreault@viagenie.ca END:VCARD Widely used in business and personal networking, vCards can be shared...
-
In the previous article, we talked about how to convert an image to black and white with a threshold. It may not work well with images having uneven lighting in tasks like barcode reading. For example, if we convert the following QR code with shadow to black and white with...
-
In this article, we are going to create a lightning web component to scan barcodes in Salesforce, the famous CRM system, so that we can quickly input data. Dynamsoft Barcode Reader is used for barcode scanning. Because Dynamsoft Barcode Reader uses WASM, which cannot run in Salesforce LWC by default,...
-
Nuxt is a free and open-source framework with an intuitive and extendable way to create type-safe, performant and production-grade full-stack web applications and websites with Vue.js. In this article, we are going to build a document scanner using Nuxt.js and Dynamic Web TWAIN. It can scan documents via scanners using...
-
DotCode is two-dimensional (2D) matrix barcode mainly used in the tobacco industry with advantages like the ability to apply the barcode by high-speed industrial printers and other methods like laser engraving. Below is a pack of cigarettes with a DotCode representing its unique identifier. In this article, we are going...
-
Burning (flattening) annotations means including them as vector graphics in the content of a PDF page, leaving them uneditable. Dynamsoft Document Viewer is a JavaScript SDK for document scanning and viewing, which can add annotations and export PDF files. In this article, we are going to explore how to use...
-
A PDF file can be encrypted, for security, in which case a password is needed to view or edit the contents. Dynamsoft Document Viewer is a JavaScript SDK for document scanning and viewing, which can encrypt and decrypt a PDF file. In this article, we are going to explore how...
-
Nuxt is a free and open-source framework with an intuitive and extendable way to create type-safe, performant and production-grade full-stack web applications and websites with Vue.js. In this article, we are going to build a barcode and QR code scanner using Nuxt.js. Dynamsoft Camera Enhancer is used to access the...
-
Modern browsers can now access the camera and run image processing to do various computer vision tasks. In this article, we are going to build a Vue.js app to scan document images from a camera and save them into a PDF file. Dynamsoft Mobile Web Capture is used to provide...
-
Image compressing on the browser is a useful operation. It can improve the uploading performance and save the storage. In this article, we are going to talk about how to compress an image with JavaScript using the Dynamsoft Document Viewer SDK. We can compress an image by changing the following...
-
VIN stands for vehicle identification number. It is a unique 17-character code to identify individual vehicles. The VIN contains information about your car’s make, model, and year, as well as the country where it was manufactured and other important details. You may find the VIN label on your car’s dashboard,...
-
Modern browsers can now access the camera and run image processing to do various computer vision tasks. In this article, we are going to build a React.js app to scan document images from a camera and save them into a PDF file. Dynamsoft Mobile Web Capture is used to provide...
-
Drag and drop is a useful feature for managing scanned document images. It allows users to move items from one location to another using a mouse or touch gesture. Dynamsoft Document Viewer is an SDK which provides a set of viewers for document images. In this article, we are going...
-
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...
-
Using the getUserMedia API, we can open cameras on the web with JavaScript. It is supported on most browsers and Chrome for Android has additional support for controlling the camera’s zoom, torch, focus, and so on, giving more possibilities for making a camera web app. In this article, we are...
-
After scanning documents, we often need to clean up and repair them to enhance their quality. There are several ways to do this: Apply an image filter. We can convert the image to black and white to clean the background and improve the contrast. In the following example, we can...
-
UPC is a type of barcode widely used to identify retail products while EAN is a superset of it adding an extra digit to the beginning. EAN-13 and UPC-A are the common versions while EAN-8 and UPC-E are the less used versions for small packages. An EAN or a UPC...
-
Dynamsoft Document Viewer is an SDK providing a set of viewers for document images. We can use it to incorporate PDF creating, viewing and annotating into our web apps. In this article, we are going to write a demo with Vue. New Project Create a new Vue + TypeScript project...
-
Dynamsoft Document Viewer is an SDK providing a set of viewers for document images. We can use it to incorporate PDF creating, viewing and annotating into our web apps. In this article, we are going to build a fully functional PDF viewer and annotator in a React + TypeScript project....
-
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...
-
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...
-
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...
-
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,...
-
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....
-
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...
-
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 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...
-
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...
-
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...
-
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 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...
-
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 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...
-
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...
-
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...
-
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. What you’ll build: A browser-based document scanning app using Next.js and the Dynamic...
-
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. Prerequisites Get your trial license key....
-
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...
-
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...
-
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...
-
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...
-
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...
-
HTML5 is universally supported across all modern browsers — Chrome, Edge, Safari, Firefox, and Opera — on both desktop and mobile, as well as WebView components used in native Android and iOS apps. This cross-platform reach means a single ASP.NET web application can serve all users without maintaining separate native...
-
The MediaDevices.getUserMedia() API is the standard way to access cameras from web browsers. While it’s relatively straightforward, building a complete web camera viewer still requires significant effort. Until recently, there were no ready-to-use JavaScript camera widgets. However, with the release of the Dynamsoft Camera Enhancer library, implementing a browser-based camera...
-
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...
-
QR codes1 are everywhere - URLs, payment flows, ticketing, inventory labels, patient wristbands. Building a browser-based QR code scanner means users get instant scanning capability on any device without downloading an app. This guide shows how to build one using the Dynamsoft Barcode Reader JavaScript SDK v11, which runs entirely...
-
Dynamic Web TWAIN has added some exciting features related to the mobile platform since its version 16. Document capturing via mobile cameras, 16.0 PDF Rasterizer mobile edition, 16.0 LoadImageEx supports mobile platform, 16.1 Acquiring images from a remote scanner, 16.1 The scanDocument API which makes it easy to call a...