CN107329681A - 一种基于web的原笔迹手写输入方法、装置及终端 - Google Patents

一种基于web的原笔迹手写输入方法、装置及终端 Download PDF

Info

Publication number
CN107329681A
CN107329681A CN201710330883.6A CN201710330883A CN107329681A CN 107329681 A CN107329681 A CN 107329681A CN 201710330883 A CN201710330883 A CN 201710330883A CN 107329681 A CN107329681 A CN 107329681A
Authority
CN
China
Prior art keywords
event
drawing board
web browser
picture
signature
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN201710330883.6A
Other languages
English (en)
Inventor
陈强
谢晓彬
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Guangdong Wangjin Holdings Co Ltd
Original Assignee
Guangdong Wangjin Holdings Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Guangdong Wangjin Holdings Co Ltd filed Critical Guangdong Wangjin Holdings Co Ltd
Priority to CN201710330883.6A priority Critical patent/CN107329681A/zh
Publication of CN107329681A publication Critical patent/CN107329681A/zh
Pending legal-status Critical Current

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487—Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488—Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • G06F3/04883—Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures for inputting data by handwriting, e.g. gesture or text

Abstract

本发明涉及一种基于WEB的原笔迹手写输入方法、装置及终端。该方法包括：接收来自用户通过触发WEB浏览器而产生的启动签名命令；根据所述WEB浏览器的类型，注册鼠标移动事件或触摸事件；获取基于鼠标移动事件的鼠标移动信号或基于触摸事件的触摸信号在签名画板上移动的事件；根据所述签名画板上移动的事件形成线条，并将所述线条导出为图片；将所述图片发送至服务端存储。用户可以脱离硬件限制，只需通过浏览器，即可做到随时随地签名批注。

Description

一种基于WEB的原笔迹手写输入方法、装置及终端
技术领域
本发明涉及计算机程序技术，具体涉及电子签名技术。
背景技术
当前市面上的无纸化原笔迹电子签名解决方案大多需要硬件和软件硬件相结合，通过为电脑搭载原笔迹手写输入技术的终端(电磁屏搭配电磁笔)，借助这些硬件完成电子文档签名、批注、修改等关键应用。这样不但提高了成本，而且加大了实施和推广难度。
名词解释：
1、无纸化办公：指在不用纸张办公，在无纸化办公环境中进行的一种工作方式，无纸化办公需要硬件、软件与通信网络协力才能达到的办公体验。
2、原笔迹手写签名：这里指书面签名的数字图像化，将手写板上的书写痕迹直接数字化，并在电脑中原笔迹呈现。
发明内容
为了克服现有技术的不足，本发明的目的之一在于提供一种基于WEB的原笔迹手写输入方法，其能解决需要借助硬件才能实现电子签名的问题。
本发明的目的之二在于提供一种基于WEB的原笔迹手写输入装置，其能解决需要借助硬件才能实现电子签名的问题。
本发明的目的之三在于提供一种终端，其能解决需要借助硬件才能实现电子签名的问题。
为了实现上述目的之一，本发明所采用的技术方案如下：
一种基于WEB的原笔迹手写输入方法，其包括以下步骤：
接收来自用户通过触发WEB浏览器而产生的启动签名命令；
根据所述WEB浏览器的类型，注册鼠标移动事件或触摸事件；
获取基于鼠标移动事件的鼠标移动信号或基于触摸事件的触摸信号在签名画板上移动的事件；
根据所述签名画板上移动的事件形成线条，并将所述线条导出为图片；
将所述图片发送至服务端存储。
优选的，还包括以下步骤：当判断WEB浏览器支持签名画板功能时，在所述WEB浏览器上显示所述签名画板。
优选的，所述签名画板为基于canvas标签的签名画板。
优选的，当所述WEB浏览器的类型为移动终端浏览器时，注册触摸事件；当所述WEB浏览器的类型为电脑浏览器时，注册鼠标移动事件。
优选的，将所述图片发送至服务端存储的步骤具体为：将所述图片转换为字节流，将所述字节流通过HTTP协议发送至服务端进行存储。
优选的，所述图片与所述用户形成关联关系。
为了实现上述目的之二，本发明所采用的技术方案如下：
一种基于WEB的原笔迹手写输入装置，其包括以下模块：
接收模块，用于接收来自用户通过触发WEB浏览器而产生的启动签名命令；
事件注册模块，用于根据所述WEB浏览器的类型，注册鼠标移动事件或触摸事件；
事件获取模块，用于获取基于鼠标移动事件的鼠标移动信号或基于触摸事件的触摸信号在签名画板上移动的事件；
响应模块，用于根据所述签名画板上移动的事件形成线条，并将所述线条导出为图片；
发送模块，用于将所述图片发送至服务端存储。
为了实现上述目的之三，本发明所采用的技术方案如下：
一种终端，其包括存储器和处理器；
所述存储器，用于存储程序指令；
所述处理器，用于执行所述程序指令，以执行以下步骤：
接收来自用户通过触发WEB浏览器而产生的启动签名命令；
根据所述WEB浏览器的类型，注册鼠标移动事件或触摸事件；
获取基于鼠标移动事件的鼠标移动信号或基于触摸事件的触摸信号在签名画板上移动的事件；
根据所述签名画板上移动的事件形成线条，并将所述线条导出为图片；
将所述图片发送至服务端存储。
优选的，当所述WEB浏览器的类型为移动终端浏览器时，注册触摸事件；当所述WEB浏览器的类型为电脑浏览器时，注册鼠标移动事件。
优选的，所述图片与所述用户形成关联关系。
相比现有技术，本发明的有益效果在于：
用户可以脱离硬件限制，只需通过浏览器，即可做到随时随地签名批注。比如用户在浏览了电子文档或电子协议后，可以简单、直观地使用数字笔在屏幕上对电子文档或电子协议进行电子签名和批注操作。本发明自然直观的交互方式解决了原笔迹书写的数据交互难题，实现了数字化的手写批注和手写签名。
附图说明
图1为本发明较佳实施例的基于WEB的原笔迹手写输入方法的流程图；
图2为本发明较佳实施例的基于WEB的原笔迹手写输入装置的结构示意图；
图3为本发明较佳实施例的终端的结构示意图。
具体实施方式
下面，结合附图以及具体实施方式，对本发明做进一步描述：
如图1所示，本实施例提出了一种基于WEB的原笔迹手写输入方法，其包括以下步骤：
步骤S1、接收来自用户通过触发WEB浏览器而产生的启动签名命令。该步骤具体是，用户通过PC、手机或平板电脑(PAD)等设备打开WEB浏览器，访问支持原笔迹手写签名功能的网站，并启动签名功能。
步骤S2、当判断WEB浏览器支持签名画板功能时，在所述WEB浏览器上显示所述签名画板。本步骤具体为：判断所述WEB浏览器是否完整支持HTML5，若支持，则构建基于canvas标签的签名画板，在所述WEB浏览器上显示所述签名画板，该签名画板用于网页绘制图像，否则，提示用户不支持并禁止该签名画板功能。
步骤S3、根据所述WEB浏览器的类型，注册鼠标移动事件或触摸事件。本步骤具体为：可以通过userAgent判断所述WEB浏览器的类型，判断是注册鼠标移动事件还是触摸事件。例如，当所述WEB浏览器的类型为移动终端浏览器时，说明请求设备为手机或PAD，则注册触摸事件；当所述WEB浏览器的类型为电脑浏览器时，所述请求设备为PC，则注册鼠标移动事件。
步骤S4、获取基于鼠标移动事件的鼠标移动信号或基于触摸事件的触摸信号在签名画板上移动的事件。本步骤具体为：监听用户通过鼠标或触摸屏在签名画板上的书写操作。
步骤S5、根据所述签名画板上移动的事件形成线条，并将所述线条导出为图片。本步骤具体为：实时获取书写操作在签名画板上形成的坐标点，将各坐标点连接成线条，通过所述线条还原用户在签名画板上书写的原笔迹。
步骤S6、将所述图片发送至服务端存储。本步骤具体为：将原笔迹的图片导出成图片，将所述图片转换为字节流，将所述字节流通过HTTP协议发送至服务端进行存储。所述图片与所述用户形成关联关系。，形成对应的签名数据，以便用户后续调取使用。
如图2所示，与上述方法对应提出一种基于WEB的原笔迹手写输入装置，本装置为虚拟装置，其包括以下模块：
接收模块，用于接收来自用户通过触发WEB浏览器而产生的启动签名命令。本模块具体是，用户通过PC、手机或平板电脑(PAD)等设备打开WEB浏览器，访问支持原笔迹手写签名功能的网站，并启动签名功能。
判断模块，用于当判断WEB浏览器支持签名画板功能时，在所述WEB浏览器上显示所述签名画板。本模块具体为：判断所述WEB浏览器是否完整支持HTML5，若支持，则构建基于canvas标签的签名画板，在所述WEB浏览器上显示所述签名画板，该签名画板用于网页绘制图像，否则，提示用户不支持并禁止该签名画板功能。
事件注册模块，用于根据所述WEB浏览器的类型，注册鼠标移动事件或触摸事件。本模块具体为：可以通过userAgent判断所述WEB浏览器的类型，判断是注册鼠标移动事件还是触摸事件。例如，当所述WEB浏览器的类型为移动终端浏览器时，说明请求设备为手机或PAD，则注册触摸事件；当所述WEB浏览器的类型为电脑浏览器时，所述请求设备为PC，则注册鼠标移动事件。
事件获取模块，用于获取基于鼠标移动事件的鼠标移动信号或基于触摸事件的触摸信号在签名画板上移动的事件。本模块具体为：监听用户通过鼠标或触摸屏在签名画板上的书写操作。
响应模块，用于根据所述签名画板上移动的事件形成线条，并将所述线条导出为图片。本模块具体为：实时获取书写操作在签名画板上形成的坐标点，将各坐标点连接成线条，通过所述线条还原用户在签名画板上书写的原笔迹。
发送模块，用于将所述图片发送至服务端存储。本模块具体为：将原笔迹的图片导出成图片，将所述图片转换为字节流，将所述字节流通过HTTP协议发送至服务端进行存储。所述图片与所述用户形成关联关系。，形成对应的签名数据，以便用户后续调取使用。
如图3所示，与上述方法对应提出一种终端，其包括存储器和处理器。本终端为实体硬件装置。
所述存储器，用于存储程序指令；
所述处理器，用于执行所述程序指令，以执行以下步骤：
步骤S1、接收来自用户通过触发WEB浏览器而产生的启动签名命令。该步骤具体是，用户通过PC、手机或平板电脑(PAD)等设备打开WEB浏览器，访问支持原笔迹手写签名功能的网站，并启动签名功能。
步骤S2、当判断WEB浏览器支持签名画板功能时，在所述WEB浏览器上显示所述签名画板。本步骤具体为：判断所述WEB浏览器是否完整支持HTML5，若支持，则构建基于canvas标签的签名画板，在所述WEB浏览器上显示所述签名画板，该签名画板用于网页绘制图像，否则，提示用户不支持并禁止该签名画板功能。
步骤S3、根据所述WEB浏览器的类型，注册鼠标移动事件或触摸事件。本步骤具体为：可以通过userAgent判断所述WEB浏览器的类型，判断是注册鼠标移动事件还是触摸事件。例如，当所述WEB浏览器的类型为移动终端浏览器时，说明请求设备为手机或PAD，则注册触摸事件；当所述WEB浏览器的类型为电脑浏览器时，所述请求设备为PC，则注册鼠标移动事件。
步骤S4、获取基于鼠标移动事件的鼠标移动信号或基于触摸事件的触摸信号在签名画板上移动的事件。本步骤具体为：监听用户通过鼠标或触摸屏在签名画板上的书写操作。
步骤S5、根据所述签名画板上移动的事件形成线条，并将所述线条导出为图片。本步骤具体为：实时获取书写操作在签名画板上形成的坐标点，将各坐标点连接成线条，通过所述线条还原用户在签名画板上书写的原笔迹。
步骤S6、将所述图片发送至服务端存储。本步骤具体为：将原笔迹的图片导出成图片，将所述图片转换为字节流，将所述字节流通过HTTP协议发送至服务端进行存储。所述图片与所述用户形成关联关系，形成对应的签名数据，以便用户后续调取使用。
总体而言，本实施例旨在提供一种基于web的原笔迹手写输入技术，让用户可以通过浏览器，随时随地使用PC、手机、Pad等设备进行签审操作。其基本原理是：提供web原笔迹手写签名站点(通常以工具的形式依附于各类主网站中)，用户通过浏览器访问站点，当用户启动签名功能时，本实施例将通过Javascript自动生成签名画板，整合Html5的canvas技术收集用户签名绘图，导出签名数据，并将签名数据传输到服务端，服务端通过不同用户关联保持签名数据。
本实施例属于软件架构和软件工具领域，主要用于涉及大量审批环节的电子事务，如各类申请和文件审核工作，用于替代传统低效率，复杂冗长的纸质办公，为无纸化办公提供原笔迹手写电子签名解决方案。
对本领域的技术人员来说，可根据以上描述的技术方案以及构思，做出其它各种相应的改变以及形变，而所有的这些改变以及形变都应该属于本发明权利要求的保护范围之内。

Claims (10)

1.一种基于WEB的原笔迹手写输入方法，其特征在于，包括以下步骤：
接收来自用户通过触发WEB浏览器而产生的启动签名命令；
根据所述WEB浏览器的类型，注册鼠标移动事件或触摸事件；
获取基于鼠标移动事件的鼠标移动信号或基于触摸事件的触摸信号在签名画板上移动的事件；
根据所述签名画板上移动的事件形成线条，并将所述线条导出为图片；
将所述图片发送至服务端存储。
2.如权利要求1所述的原笔迹手写输入方法，其特征在于，还包括以下步骤：当判断WEB浏览器支持签名画板功能时，在所述WEB浏览器上显示所述签名画板。
3.如权利要求1所述的原笔迹手写输入方法，其特征在于，所述签名画板为基于canvas标签的签名画板。
4.如权利要求1所述的原笔迹手写输入方法，其特征在于，当所述WEB浏览器的类型为移动终端浏览器时，注册触摸事件；当所述WEB浏览器的类型为电脑浏览器时，注册鼠标移动事件。
5.如权利要求1所述的原笔迹手写输入方法，其特征在于，将所述图片发送至服务端存储的步骤具体为：将所述图片转换为字节流，将所述字节流通过HTTP协议发送至服务端进行存储。
6.如权利要求1所述的原笔迹手写输入方法，其特征在于，所述图片与所述用户形成关联关系。
7.一种基于WEB的原笔迹手写输入装置，其特征在于，包括以下模块：
接收模块，用于接收来自用户通过触发WEB浏览器而产生的启动签名命令；
事件注册模块，用于根据所述WEB浏览器的类型，注册鼠标移动事件或触摸事件；
事件获取模块，用于获取基于鼠标移动事件的鼠标移动信号或基于触摸事件的触摸信号在签名画板上移动的事件；
响应模块，用于根据所述签名画板上移动的事件形成线条，并将所述线条导出为图片；
发送模块，用于将所述图片发送至服务端存储。
8.一种终端，其特征在于，包括存储器和处理器；
所述存储器，用于存储程序指令；
所述处理器，用于执行所述程序指令，以执行以下步骤：
接收来自用户通过触发WEB浏览器而产生的启动签名命令；
根据所述WEB浏览器的类型，注册鼠标移动事件或触摸事件；
获取基于鼠标移动事件的鼠标移动信号或基于触摸事件的触摸信号在签名画板上移动的事件；
根据所述签名画板上移动的事件形成线条，并将所述线条导出为图片；
将所述图片发送至服务端存储。
9.如权利要求1所述的终端，其特征在于，当所述WEB浏览器的类型为移动终端浏览器时，注册触摸事件；当所述WEB浏览器的类型为电脑浏览器时，注册鼠标移动事件。
10.如权利要求1所述的终端，其特征在于，所述图片与所述用户形成关联关系。
CN201710330883.6A 2017-05-11 2017-05-11 一种基于web的原笔迹手写输入方法、装置及终端 Pending CN107329681A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201710330883.6A CN107329681A (zh) 2017-05-11 2017-05-11 一种基于web的原笔迹手写输入方法、装置及终端

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201710330883.6A CN107329681A (zh) 2017-05-11 2017-05-11 一种基于web的原笔迹手写输入方法、装置及终端

Publications (1)

Publication Number Publication Date
CN107329681A true CN107329681A (zh) 2017-11-07

Family

ID=60192689

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201710330883.6A Pending CN107329681A (zh) 2017-05-11 2017-05-11 一种基于web的原笔迹手写输入方法、装置及终端

Country Status (1)

Country Link
CN (1) CN107329681A (zh)

Cited By (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108269062A (zh) * 2018-01-23 2018-07-10 平安普惠企业管理有限公司 基于h5的电子合同制作方法、装置、设备及介质
CN109299620A (zh) * 2018-09-04 2019-02-01 山东浪潮通软信息科技有限公司 一种基于canvas实现移动端防篡改的电子签名方法
CN110413187A (zh) * 2018-04-26 2019-11-05 广州视源电子科技股份有限公司 交互智能设备的批注的处理方法和装置
CN111176543A (zh) * 2019-12-25 2020-05-19 数字广东网络建设有限公司 实现电子签名的方法、装置、计算机设备和存储介质
CN112669403A (zh) * 2020-12-23 2021-04-16 广州佰锐网络科技有限公司 一种手写签名的图像生成方法、装置、终端设备及存储介质

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103020065A (zh) * 2011-09-22 2013-04-03 北京神州泰岳软件股份有限公司 一种基于Web页面的签名板实现方法和一种Web系统
US8612763B1 (en) * 2005-06-10 2013-12-17 Assuresign, LLC Digital signature verification processes, methods and systems
US20160087800A1 (en) * 2014-09-22 2016-03-24 The Standard Register Company System and method for signature capture

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US8612763B1 (en) * 2005-06-10 2013-12-17 Assuresign, LLC Digital signature verification processes, methods and systems
CN103020065A (zh) * 2011-09-22 2013-04-03 北京神州泰岳软件股份有限公司 一种基于Web页面的签名板实现方法和一种Web系统
US20160087800A1 (en) * 2014-09-22 2016-03-24 The Standard Register Company System and method for signature capture

Non-Patent Citations (2)

* Cited by examiner, † Cited by third party
Title
DOUBLEYOUNG: ""Html5 canvas 应用于webkit浏览器实现电子签名"", 《HTTPS://BLOG.CSDN.NET/DOUBLEYOUNG/ARTICLE/DETAILS/84014720》 *
LOTOZHOU: ""PHP中的HTML5应用 将Canvas图像保存到服务器"", 《HTTPS://MY.OSCHINA.NET/ZHOUHANG0907/BLOG/543138》 *

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108269062A (zh) * 2018-01-23 2018-07-10 平安普惠企业管理有限公司 基于h5的电子合同制作方法、装置、设备及介质
CN108269062B (zh) * 2018-01-23 2021-08-31 平安普惠企业管理有限公司 基于h5的电子合同制作方法、装置、设备及介质
CN110413187A (zh) * 2018-04-26 2019-11-05 广州视源电子科技股份有限公司 交互智能设备的批注的处理方法和装置
CN109299620A (zh) * 2018-09-04 2019-02-01 山东浪潮通软信息科技有限公司 一种基于canvas实现移动端防篡改的电子签名方法
CN111176543A (zh) * 2019-12-25 2020-05-19 数字广东网络建设有限公司 实现电子签名的方法、装置、计算机设备和存储介质
CN112669403A (zh) * 2020-12-23 2021-04-16 广州佰锐网络科技有限公司 一种手写签名的图像生成方法、装置、终端设备及存储介质

Similar Documents

Publication Publication Date Title
CN107329681A (zh) 一种基于web的原笔迹手写输入方法、装置及终端
CN201302702Y (zh) 用于电容式触控屏体现书写笔画粗细的触控笔
US8941600B2 (en) Apparatus for providing touch feedback for user input to a touch sensitive surface
US20110216015A1 (en) Apparatus and method for directing operation of a software application via a touch-sensitive surface divided into regions associated with respective functions
RU2014128244A (ru) Предоставление открытого экземпляра приложения
CN107430683B (zh) 信息关联方法、电子书签及信息关联系统
JP6041989B2 (ja) 静電容量方式と電磁誘導方式のデュアルモードタッチスクリーンのタッチ制御方法及びハンドヘルド電子装置
CN107229409A (zh) 远程虚拟桌面系统的操作方法及装置
CN108874283A (zh) 图片识别方法、移动终端及计算机可读存储介质
WO2014163373A1 (en) Method and apparatus for inputting text in electronic device having touchscreen
CN202565358U (zh) 基于压力感应实现电子书翻页的系统
WO2012006916A1 (zh) 在网页上实现手写输入的方法及系统
KR20040043454A (ko) 펜 컴퓨팅 시스템에서의 펜 입력 방법 및 장치
CN106874723A (zh) 一种实现解锁的方法及终端
US20230135661A1 (en) Image processing method and apparatus for smart pen, and electronic device
CN104956378A (zh) 电子设备和手写文档处理方法
CN104239326A (zh) 一种对网页字体进行缩放的方法、装置和系统
CN103150116A (zh) 一种基于rdp协议对云桌面进行放大显示的方法
CN108845732A (zh) 一种信息显示方法及终端设备
CN109063079A (zh) 网页标注方法及电子设备
CN110413980A (zh) 用于创建手写内容的用户装置和方法
CN109359080A (zh) 一种阅读信息的处理方法及终端
CN106933463A (zh) 一种在屏幕中显示对象的方法和装置
CN110209296A (zh) 信息处理装置及信息处理方法
CN107402673A (zh) 一种全局搜索方法、终端及计算机可读存储介质

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
RJ01 Rejection of invention patent application after publication

Application publication date: 20171107

RJ01 Rejection of invention patent application after publication