Dynamic Web TWAIN扫描控件集成

Dynamic Web TWAIN 是专为网页端程序设计的文档扫描 SDK。该扫描仪控件基于浏览器部署，仅需几行 JavaScript 代码，您就可以开发强大的文档扫描程序，实现文件扫描、图像编辑、保存上传等功能。

 

下载地址：
http://www.damingsoft.com/products/dwt-register.aspx

API地址：

https://www.dynamsoft.com/web-twain/docs/info/api/

 

　　1.下载dwt依赖 

npm install dwt

　　2.将node_modules/dwt/dist 文件夹内容复制到static中，保证dwt依赖独立被打包到发布文件夹中，因为dwt在初始化的时候需要从指定位置加载额外的文件进行配置。

　　3.扫描页面引入dwt依赖

impot dwt from 'dwt'

　　4.在mounted中初始化

　　　 dwt.DWT.ResourcesPath = "/static/resources/dwt"; //设置为配置项目中提到的静态文件的位置
      dwt.WebTwainEnv.ProductKey = this.dwt.lincensekey; //必须设置为有效的试用版或完整密钥
      dwt.DWT.Containers = [{
            WebTwainId: this.dwt.id, 
            ContainerId: this.containerId, //指定要创建DWT查看器的 DIV
            Width: "100%",
            Height: "400px",
      }, ];
      dwt.DWT.RegisterEvent("OnWebTwainReady", () => { //DWT是初始化成功时触发的回调
          this.onReady();
      });
      dwt.DWT.Load();

　　5.获取扫描仪

　　　 const _this = this
      this.dwt.obj = dwt.DWT.GetWebTwain('dwtViewer')
      //加载扫描仪
      this.dwt.obj.GetSourceNamesAsync().then(
        function(data){
          _this.scanner = data.map((scanner,idx) => {return {id:idx,text:scanner}})
        }
      )

　　6.开始扫描

　　　　if(this.selectScanner == null){
        this.$message({type:'info', message:'请先选择扫描仪！'});
        return;
      }
      const DWObject = this.dwt.obj;
      if (DWObject) {
        if (DWObject.UseLocalService) {
          
          DWObject.SelectSourceByIndex(this.selectScanner);
          DWObject.OpenSource();
          DWObject.IfShowUI = this.showUI; //显示页面
          DWObject.PixelType = this.colorMode; //像素类型
          DWObject.Resolution = this.resolution; //解析度
          DWObject.IfFeederEnabled = this.autoFeeder; //自动进纸
          DWObject.IfDuplexEnabled = this.duplex; //双面
          DWObject.IfDisableSourceAfterAcquire = true;
          DWObject.IfGetImageInfo = true;
          DWObject.IfGetExtImageInfo = true;
          DWObject.extendedImageInfoQueryLevel = 0;
          DWObject.ShowPageNumber = true;
          DWObject.AcquireImage(
           {}, (res) => { alert("扫描成功")  
            this.bindViewer(DWObject)
             DWObject.CloseSource() 
             }
          )
        }
      }

　　7.功能展示