Node.js+Web TWAIN，实现Web文档扫描和图像上传

目录(?)[+]

通过Dynamic Web TWAIN SDK和Node.js的组合，只需要几行代码就可以实现在浏览器中控制扫描仪，获取图像后上传到远程服务器。

原文：Document
Imaging and Uploading With Dynamic Web TWAIN and Node.js

下载安装

通过Node.js创建server

创建工程目录，打开cmd.exe进入到工程目录，安装下面两个Node.js模块：

?


1

2

npm install [email protected]

npm install express


创建server.js，初始化：

?


1

2

3

4

5

var formidable = require(‘formidable‘);

var util = require(‘util‘);

var express = require(‘express‘);

var fs = require(‘fs‘);

var app = express();


把静态资源，比如图片，css等，都加载进来：

?


1

app.use(express.static(__dirname, ‘/public‘));


要实现跨域访问，需要在header里添加权限，如果不添加，只能local访问：

?


1

2

3

4

5

6

7

app.use(function(req, res, next) {  

    res.header("Access-Control-Allow-Origin", "*");   

    res.header("Access-Control-Allow-Methods","PUT, POST, GET, DELETE, OPTIONS");  

    res.header("Access-Control-Allow-Headers","X-Requested-With, content-type");  

    res.header("Access-Control-Allow-Credentials", true);  

    next();  

});


在POST请求中通过formidable解析数据：

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

app.post(‘/upload‘, function(req, res) {

    var form = new formidable.IncomingForm();

    form.parse(req, function(err, fields, files) {

        // console.log(util.inspect({

        //     fields: fields,

        //     files: files

        // }));

 

        fs.readFile(files.RemoteFile.path, function(err, data) {

            // save file from temp dir to new dir

            var newPath = __dirname + "/uploads/" + files.RemoteFile.name;

            fs.writeFile(newPath, data, function(err) {

                if (err) throw err;

                console.log(‘file saved‘);  

                res.end();

            });

        });

    });

})


设置好IP和端口：

?


1

2

3

4

5

var server = app.listen(2014, function() {

    var host = server.address().address;

    var port = server.address().port;

    console.log(‘listening at http://%s:%s‘, host, port);

})

通过Dynamic Web TWAIN创建client

创建一个网页，包含一个div和两个button：

?


1

2

3

4

5

6

7

8

9

10

11

12

<html>

    <head>

        <title>Document Imaging & Uploading</title>

        <script src="/Resources/dynamsoft.webtwain.initiate.js"></script>

        <script src="/Resources/dynamsoft.webtwain.config.js"></script>

    </head>

    <body>

        <div id="dwtcontrolContainer"></div>

        <input type="button" value="Acquire" onclick="AcquireImage();" />

        <input id="btnUpload" type="button" value="Upload Image" onclick="btnUpload_onclick()">

    </body>

</html>


这里需要把Web TWAIN SDK安装目录下的Resources目录拷贝过来。

加几行代码就可以扫描了：

?


1

2

3

4

5

6

function AcquireImage(){

     DWObject.IfShowUI = false;

     DWObject.SelectSource();

     DWObject.OpenSource();

     DWObject.AcquireImage();

}


到这里可以先测试下扫描能否正常工作。接下来实现远程上传：

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

function btnUpload_onclick() {

       DWObject.HTTPPort = 2014;

       var CurrentPathName = unescape(location.pathname); // get current PathName in plain ASCII

       var CurrentPath = CurrentPathName.substring(0, CurrentPathName.lastIndexOf("/") + 1);

       var strActionPage = CurrentPath + "upload";

       var strHostIP = "localhost"; // modify the IP for cross-domain access

       var sFun = function(){

           alert(‘successful‘);

       }, fFun = function(){

           alert(‘failed‘);

       };

       DWObject.HTTPUploadThroughPostEx(

       strHostIP,

       DWObject.CurrentImageIndexInBuffer,

       strActionPage,

       "test.jpg",

       1,// JPEG

       sFun, fFun

       );

}


测试下。命令行启动server：

?


1

node server.js


打开http://localhost:2014就可以玩了。

源码

https://github.com/DynamsoftRD/nodejs-dwt

?


1

git clone https://github.com/DynamsoftRD/nodejs-dwt.git
时间： 2024-08-28 01:21:27

Node.js+Web TWAIN，实现Web文档扫描和图像上传的相关文章

Node.js【6】Web开发、进阶（模块加载、控制流、部署、弊端）

笔记来自<Node.js开发指南>BYVoid编著 实现过程:https://github.com/ichenxiaodao/express-example 第5章 使用Node.js进行Web开发 从零开始用Node.js实现一个微博系统,功能包括路由控制.页面模板.数据库访问.用户注册.登录.用户会话等内容. 会介绍Express框架.MVC设计模式.ejs模板引擎以及MongoDB数据库的操作. 5.1.准备工作 Express(http://expressjs.com/)除了为http

[HTML5_WebWorkers]HTML5 web通信（跨文档通信/通道通信）简介

一.简单概要 web通信(洋名:web messaging)是一种文档中独立的浏览上下文间的DOM不会被恶意的跨域脚本暴露数据分享方式. 得得得,术语啊什么的,比看到凤姐还头疼.有必要把上面一句话拆开讲: web通信是一种数据分享方式(有屁话之嫌): 通信的主体是“浏览上下文”(这是纳尼?): 哦,“浏览上下文”呢是“一个将 Document对象呈现给用户的环境”,你可以近似理解为平常我们看到的某个页面所处的环境: web通信不会有DOM被恶意暴露的危险: 目前应用比较多的就是iframe之间的

WEB前端开发规范文档（转）

http://codeguide.bootcss.com/  编写灵活.稳定.高质量的 HTML 和 CSS 代码的规范上面的文档 再结合下面的规范: 无论是从技术角度还是开发视角,对于web前端开发规范文档都有一定规范,本文就css3和html5的发展前景总结了一系列的web开发文档,仅供大家参考. 规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进行前台页面开发. 本文档如有不对或

node.js之十大Web框架

之前接触过Node.js是因为好奇大前端越来越能干了,连我后台的饭碗都要抢了,太嚣张了,于是我想打压打压它,然后就这样接触它了.再到后来是因为Settings-Sync插件二次开发,我需要用node.js造一个mock server,而当时在开源项目上找到一个模拟github rest api的node.js服务端程序,然后我就在此基础上开发.从工作中学习有应用场景有目的性,果然还是学的要快很多. 今天之所以要说一说node.js的十大Web框架,主要是觉得以后针对VsCode开发或者是我自己的

web通信之跨文档通信 postMessage

index.html <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>web通信之跨文档通信</title> <style> iframe {float:left;width:45%; height:200px; bor

node.js 创建第一个web应用

安装node.js   从http://nodejs.org/ 下载安装程序进行安装. 安装后从开始菜单启动: Node.js command prompt 安装web开发框架Express 如果需要代理访问网络,先用下面的命令设置代理: > npm config set proxy=http://192.168.1.1:8080 运行下面命令进行安装express: > npm install express 执行下面命令,安装可执行程序: > npm install -g [emai

【Web Service】WSDL文档

WSDL文档仅仅是一个简单的XML文档. 它包含一系列描述某个web service的定义. WSDL WSDL 是基于 XML 的语言,用于描述 Web services 以及如何访问它们. WSDL 可描述某个 web service,连同用于此 web service 的消息格式和协议细节. Web Services Web services 可把应用程序转换为网络应用程序(web-applications). 通过使用 XML,消息可在应用程序之间进行传送. [Web Service]W

asp.net core web api 生成 swagger 文档

asp.net core web api 生成 swagger 文档 Intro 在前后端分离的开发模式下,文档就显得比较重要,哪个接口要传哪些参数,如果一两个接口还好,口头上直接沟通好就可以了,如果接口多了就有点不适用了,没有接口文档会大大提高前后端的沟通成本.而 asp.net core 可以通过 Swashbuckle.AspNetCore 很方便的集成 swagger 文档,相比之前 nodejs(express) 和 swagger 集成就很麻烦了,大概这就是强类型语言的优势吧.C#

Web前端开发规范文档（google规范）

(Xee:其实没什么规范约束,但是养成一种好习惯,何乐而不为?) 我推荐去看看google的开发规范,然后从他的当中去总结自己的开发规范. Google HTML/CSS代码风格指南 Google JavaScript 编码规范指南 ------------------------------------------------------------------------------------------------------------------------------- 绝大多数项