CN113032205A - 图片的上传方法及装置、存储介质、电子设备 - Google Patents
图片的上传方法及装置、存储介质、电子设备 Download PDFInfo
- Publication number
- CN113032205A CN113032205A CN202110209264.8A CN202110209264A CN113032205A CN 113032205 A CN113032205 A CN 113032205A CN 202110209264 A CN202110209264 A CN 202110209264A CN 113032205 A CN113032205 A CN 113032205A
- Authority
- CN
- China
- Prior art keywords
- uploading
- picture
- page
- window
- graphic
- 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
Links
- 238000000034 method Methods 0.000 title claims abstract description 49
- 238000012544 monitoring process Methods 0.000 claims abstract description 68
- 230000002093 peripheral effect Effects 0.000 claims abstract description 40
- 230000003321 amplification Effects 0.000 claims description 23
- 238000003199 nucleic acid amplification method Methods 0.000 claims description 23
- 238000004891 communication Methods 0.000 claims description 18
- 238000004590 computer program Methods 0.000 claims description 14
- 239000000725 suspension Substances 0.000 claims description 7
- 238000007667 floating Methods 0.000 claims description 5
- 238000005516 engineering process Methods 0.000 abstract description 4
- 238000010586 diagram Methods 0.000 description 10
- 230000005540 biological transmission Effects 0.000 description 7
- 238000012545 processing Methods 0.000 description 5
- 230000001960 triggered effect Effects 0.000 description 5
- 230000004044 response Effects 0.000 description 4
- 230000008878 coupling Effects 0.000 description 3
- 238000010168 coupling process Methods 0.000 description 3
- 238000005859 coupling reaction Methods 0.000 description 3
- 230000006870 function Effects 0.000 description 3
- 230000003287 optical effect Effects 0.000 description 3
- 238000012986 modification Methods 0.000 description 2
- 230000004048 modification Effects 0.000 description 2
- 230000008569 process Effects 0.000 description 2
- 230000000694 effects Effects 0.000 description 1
- 238000010295 mobile communication Methods 0.000 description 1
- 230000001360 synchronised effect Effects 0.000 description 1
- 238000012795 verification Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F11/00—Error detection; Error correction; Monitoring
- G06F11/30—Monitoring
- G06F11/3089—Monitoring arrangements determined by the means or processing involved in sensing the monitored data, e.g. interfaces, connectors, sensors, probes, agents
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F11/00—Error detection; Error correction; Monitoring
- G06F11/30—Monitoring
- G06F11/3003—Monitoring arrangements specially adapted to the computing system or computing system component being monitored
- G06F11/302—Monitoring arrangements specially adapted to the computing system or computing system component being monitored where the computing system component is a software system
-
- 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/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
-
- 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/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
- G06F3/04842—Selection of displayed objects or displayed text elements
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
- H04L67/00—Network arrangements or protocols for supporting network services or applications
- H04L67/01—Protocols
- H04L67/06—Protocols specially adapted for file transfer, e.g. file transfer protocol [FTP]
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Quality & Reliability (AREA)
- Human Computer Interaction (AREA)
- Computing Systems (AREA)
- Mathematical Physics (AREA)
- Computer Networks & Wireless Communication (AREA)
- Signal Processing (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明公开了一种图片的上传方法及装置、存储介质、电子设备,属于计算机领域。其中,该方法包括:在上传页面的图形上传窗口监测指定外设操作,其中,所述上传页面展示在显示客户端的显示界面上;若监测到所述指定外设操作,触发图片重传指令,基于所述图片重传指令在所述图形上传窗口上展示第一图形码,并启动计时器,其中,所述第一图形码包括将第一图片从扫描客户端上传至服务器的上传入口;在所述计时器达到预设时长后,向服务器发送第一轮询请求,其中,所述第一轮询请求用于向所述服务器请求扫描客户端上传的所述第一图片。通过本发明,解决了相关技术在上传页面内重传图片导致效率低的技术问题,并节省了硬件资源。
Description
技术领域
本发明涉及计算机领域,具体而言,涉及一种图片的上传方法及装置、存储介质、电子设备。
背景技术
相关技术中,在备案系统等业务场景中,相关管理部门要求证件上传必须扫码拍照上传证件或者用户图片。在节省硬件资源的前提下优化图片的上传操作,一直是亟待解决的技术问题。
相关技术在扫码上传图片时,直接展示扫码上传二维码,扫码上传完成后在二维码下方展示上传成功的图片。申请人发现相关技术存在如下技术问题:在上传页面内不支持图片重传,只能关闭页面再重传,效率低;上传页面中只有整个网页的刷新按钮,当上传失效的时候,如果用户需要刷新二维码时,需要刷新整个页面;另一方面,页面轮询查询扫码结果的时候没有进行优化,当图片已经上传完成并且PC端已拿到图片后,客户端上的页面还会继续轮询;此外页面扫码上传的二维码不支持点击放大或更新,如果用户屏幕过小或者缩放了窗口,扫码时可能会扫不出来。
针对相关技术中存在的上述问题,目前尚未发现有效的解决方案。
发明内容
本发明实施例提供了一种图片的上传方法及装置、存储介质、电子设备。
根据本申请实施例的一个方面,提供了一种图片的上传方法,包括:在上传页面的图形上传窗口监测指定外设操作,其中,所述上传页面展示在显示客户端的显示界面上;若监测到所述指定外设操作,触发图片重传指令,基于所述图片重传指令在所述图形上传窗口上展示第一图形码,并启动计时器,其中,所述第一图形码包括将第一图片从扫描客户端上传至服务器的上传入口;在所述计时器达到预设时长后,向服务器发送第一轮询请求,其中,所述第一轮询请求用于向所述服务器请求扫描客户端上传的所述第一图片。
进一步,在上传页面的图形上传窗口监测指定外设操作之前,所述方法还包括:向所述服务器发送所述第二轮询请求;接收所述服务器基于所述第二轮询请求上传的第二图片;在所述上传页面的图形上传窗口中填充所述第二图片,并终止发送所述第二轮询请求。
进一步,在基于所述图片重传指令在所述图形上传窗口上展示第一图形码之后,所述方法还包括:在所述上传页面监测所述第一图形码的刷新指令,其中,所述刷新指令用于指示刷新所述图形上传窗口内当前显示的第一图形码;若监测到所述刷新指令,在所述上传页面的图形上传窗口内将所述第一图形码更新为第二图形码。
进一步,在基于所述图片重传指令在所述图形上传窗口上展示第一图形码之后,所述方法还包括:在所述上传页面监测所述第一图形码的放大指令,其中,所述放大指令用于指示放大所述第一图形码;若监测到所述放大指令,在所述上传页面将所述第一图形码从原始尺寸放大至目标尺寸,其中,所述原始尺寸为所述图形上传窗口的尺寸。
进一步,在向服务器发送第一轮询请求之后,所述方法还包括:接收所述服务器基于所述第一轮询请求上传的第一图片,并在所述上传页面的图形上传窗口中填充所述第一图片;在所述显示客户端关闭所述上传页面之后,重载所述上传页面;在所述上传页面重载完成后,在所述显示客户端的缓存中读取所述第一图片;在所述上传页面的图形上传窗口中重新填充所述第一图片。
进一步,基于所述图片重传指令在所述图形上传窗口上展示第一图形码包括:以所述图片重传指令为触发条件,在所述显示客户端的配置表中读取所述指定外设操作的层叠样式表CSS属性,其中,所述CSS属性用于预先通过hover选择器配置所述图形上传窗口的显示样式;基于所述CSS属性在所述图形上传窗口的原始图片上方通过悬浮遮罩层展示所述第一图形码。
进一步,在上传页面的图形上传窗口监测指定外设操作包括以下之一:在上传页面的图形上传窗口监测鼠标的悬浮操作;在上传页面的图形上传窗口监测触控操作;在上传页面的图形上传窗口监测选中操作;在上传页面的图形上传窗口监测点击操作。
根据本申请实施例的另一个方面,还提供了一种图片的上传装置,包括:监测模块,用于在上传页面的图形上传窗口监测指定外设操作,其中,所述上传页面展示在显示客户端的显示界面上;展示模块,用于若监测到所述指定外设操作,触发图片重传指令,基于所述图片重传指令在所述图形上传窗口上展示第一图形码,并启动计时器,其中,所述第一图形码包括将第一图片从扫描客户端上传至服务器的上传入口;第一发送模块,用于在所述计时器达到预设时长后,向服务器发送第一轮询请求,其中,所述第一轮询请求用于向所述服务器请求扫描客户端上传的所述第一图片。
进一步,所述装置还包括:第二发送模块,用于在所述第一监测模块在上传页面的图形上传窗口监测指定外设操作之前,向所述服务器发送所述第二轮询请求;接收模块,用于接收所述服务器基于所述第二轮询请求上传的第二图片;处理模块,用于在所述上传页面的图形上传窗口中填充所述第二图片,并终止发送所述第二轮询请求。
进一步,所述装置还包括:第二监测模块,用于在所述展示模块基于所述图片重传指令在所述图形上传窗口上展示第一图形码之后,在所述上传页面监测所述第一图形码的刷新指令,其中,所述刷新指令用于指示刷新所述图形上传窗口内当前显示的第一图形码;更新模块,用于若监测到所述刷新指令,在所述上传页面的图形上传窗口内将所述第一图形码更新为第二图形码。
进一步,所述装置还包括:第三监测模块,用于在所述展示模块基于所述图片重传指令在所述图形上传窗口上展示第一图形码之后,在所述上传页面监测所述第一图形码的放大指令,其中,所述放大指令用于指示放大所述第一图形码;放大模块,用于若监测到所述放大指令,在所述上传页面将所述第一图形码从原始尺寸放大至目标尺寸,其中,所述原始尺寸为所述图形上传窗口的尺寸。
进一步,所述装置还包括:接收模块,用于在所述第一发送模块向服务器发送第一轮询请求之后,接收所述服务器基于所述第一轮询请求上传的第一图片,并在所述上传页面的图形上传窗口中填充所述第一图片;重载模块,用于在所述显示客户端关闭所述上传页面之后,重载所述上传页面;读取模块,用于在所述上传页面重载完成后,在所述显示客户端的缓存中读取所述第一图片;填充模块,用于在所述上传页面的图形上传窗口中重新填充所述第一图片。
进一步,所述展示模块包括:读取单元,用于以所述图片重传指令为触发条件,在所述显示客户端的配置表中读取所述指定外设操作的层叠样式表CSS属性,其中,所述CSS属性用于预先通过hover选择器配置所述图形上传窗口的显示样式;展示单元,用于基于所述CSS属性在所述图形上传窗口的原始图片上方通过悬浮遮罩层展示所述第一图形码。
进一步,所述第一监测模块包括以下之一:第一监测单元,用于在上传页面的图形上传窗口监测鼠标的悬浮操作;第二监测单元,用于在上传页面的图形上传窗口监测触控操作;第三监测单元,用于在上传页面的图形上传窗口监测选中操作;第四监测单元,用于在上传页面的图形上传窗口监测点击操作。
根据本申请实施例的另一方面,还提供了一种存储介质,该存储介质包括存储的程序,程序运行时执行上述的步骤。
根据本申请实施例的另一方面,还提供了一种电子设备,包括处理器、通信接口、存储器和通信总线,其中,处理器,通信接口,存储器通过通信总线完成相互间的通信;其中:存储器,用于存放计算机程序;处理器,用于通过运行存储器上所存放的程序来执行上述方法中的步骤。
本申请实施例还提供了一种包含指令的计算机程序产品,当其在计算机上运行时,使得计算机执行上述方法中的步骤。
通过本发明,在上传页面的图形上传窗口监测指定外设操作,若监测到指定外设操作,触发图片重传指令,基于图片重传指令在图形上传窗口上展示第一图形码,并启动计时器,在计时器达到预设时长后,向服务器发送第一轮询请求,服务器在接收到第一轮询请求之后,查询并获取实时更新的数据或信息(如第一图片),并反馈至显示客户端。通过在图形上传窗口监测外设操作来触发重传指令,实现了一种在上传页面重传图片的方案,在等待预设时长后向服务器发送第一轮询请求,避免了在用户反应时间内发送无效轮询请求,解决了相关技术在上传页面内重传图片导致效率低的技术问题,同时在不关闭上传页面的前提下可以重传图片,优化了图片上传流程,并节省了硬件资源。
附图说明
此处所说明的附图用来提供对本发明的进一步理解,构成本申请的一部分,本发明的示意性实施例及其说明用于解释本发明,并不构成对本发明的不当限定。在附图中:
图1是本发明实施例的一种计算机的硬件结构框图;
图2是根据本发明实施例的一种图片的上传方法的流程图;
图3是本发明实施例刷新图形码的示意图;
图4是本发明实施例放大图形码的示意图;
图5是根据本发明实施例的一种图片的上传装置的结构框图;
图6是实施本发明实施例的一种电子设备的结构框图。
具体实施方式
为了使本技术领域的人员更好地理解本申请方案,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分的实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都应当属于本申请保护的范围。需要说明的是,在不冲突的情况下,本申请中的实施例及实施例中的特征可以相互组合。
需要说明的是,本申请的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本申请的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含,例如,包含了一系列步骤或单元的过程、方法、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
实施例1
本申请实施例一所提供的方法实施例可以在服务器(如网络服务器、云服务器等)、计算机、手机、平板或者类似的运算装置中执行。以运行在计算机上为例,图1是本发明实施例的一种计算机的硬件结构框图。如图1所示,计算机可以包括一个或多个(图1中仅示出一个)处理器102(处理器102可以包括但不限于微处理器MCU或可编程逻辑器件FPGA等的处理装置)和用于存储数据的存储器104,可选地,上述计算机还可以包括用于通信功能的传输设备106以及输入输出设备108。本领域普通技术人员可以理解,图1所示的结构仅为示意,其并不对上述计算机的结构造成限定。例如,计算机还可包括比图1中所示更多或者更少的组件,或者具有与图1所示不同的配置。
存储器104可用于存储计算机程序,例如,应用软件的软件程序以及模块,如本发明实施例中的一种图片的上传方法对应的计算机程序,处理器102通过运行存储在存储器104内的计算机程序,从而执行各种功能应用以及数据处理,即实现上述的方法。存储器104可包括高速随机存储器,还可包括非易失性存储器,如一个或者多个磁性存储装置、闪存、或者其他非易失性固态存储器。在一些实例中,存储器104可进一步包括相对于处理器102远程设置的存储器,这些远程存储器可以通过网络连接至计算机。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。
传输设备106用于经由一个网络接收或者发送数据。上述的网络具体实例可包括计算机的通信供应商提供的无线网络。在一个实例中,传输设备106包括一个网络适配器(Network Interface Controller,简称为NIC),其可通过基站与其他网络设备相连从而可与互联网进行通讯。在一个实例中,传输设备106可以为射频(Radio Frequency,简称为RF)模块,其用于通过无线方式与互联网进行通讯。
在本实施例中提供了一种图片的上传方法,图2是根据本发明实施例的一种图片的上传方法的流程图,如图2所示,该流程包括如下步骤:
步骤S202,在上传页面的图形上传窗口监测指定外设操作,其中,上传页面展示在显示客户端的显示界面上;
本实施例的指定外设操作可以是鼠标、键盘、触控屏等外设触发的操作,显示客户端可以是PC端、移动端等,上传页面加载在浏览器或者app的UI界面中,上传页面包含图形上传窗口。
步骤S204,若监测到指定外设操作,触发图片重传指令,基于图片重传指令在图形上传窗口上展示第一图形码,并启动计时器,其中,第一图形码包括将第一图片从扫描客户端上传至服务器的上传入口;
本实施例的一个应用场景中,图形上传窗口当前展示原始图片,但原始图片已失效或错误,需要使用第一图片进行更新,在另一个应用场景中,由于网络等原因,图形上传窗口未展示出之前上传的原始图片。用户需要重新上传新的第一图片,并将第一图片展示在该图形上传窗口,通过第一图片更新原始图片。可选的,图形码(如本实施例中的第一图形码、第二图形码等)可以是二维码、条形码等携带指令代码的网络入口,扫描客户端通过扫描图形码,进入图片上传入口,可以将扫描客户端本地的图片上传至与显示客户端连接的服务器。
步骤S206,在计时器达到预设时长后,向服务器发送第一轮询请求,其中,第一轮询请求用于向服务器请求扫描客户端上传的第一图片。
服务器在接收到第一轮询请求之后,查询并获取实时更新的数据或信息(如第一图片),并反馈至显示客户端。
通过上述步骤,在上传页面的图形上传窗口监测指定外设操作,若监测到指定外设操作,触发图片重传指令,基于图片重传指令在图形上传窗口上展示第一图形码,并启动计时器,在计时器达到预设时长后,向服务器发送第一轮询请求,服务器在接收到第一轮询请求之后,查询并获取实时更新的数据或信息(如第一图片),并反馈至显示客户端。通过在图形上传窗口监测外设操作来触发重传指令,实现了一种在上传页面重传图片的方案,在等待预设时长后向服务器发送第一轮询请求,避免了在用户反应时间内发送无效轮询请求,解决了相关技术在上传页面内重传图片导致效率低的技术问题,同时在不关闭上传页面的前提下可以重传图片,优化了图片上传流程,并节省了硬件资源。
在本实施例中,在上传页面的图形上传窗口监测指定外设操作可以但不限于为:在上传页面的图形上传窗口监测鼠标的悬浮操作;在上传页面的图形上传窗口监测触控操作;在上传页面的图形上传窗口监测选中操作;在上传页面的图形上传窗口监测点击操作。
在本实施例的一个实施方式中,基于图片重传指令在图形上传窗口上展示第一图形码包括:以图片重传指令为触发条件,在显示客户端的配置表中读取指定外设操作的层叠样式表(Cascading Style Sheets,CSS)属性,其中,CSS属性用于预先通过hover选择器配置图形上传窗口的显示样式;基于CSS属性在图形上传窗口的原始图片上方通过悬浮遮罩层展示第一图形码。
可选的,在基于CSS属性在图形上传窗口的原始图片上方通过悬浮遮罩层展示第一图形码之后,还可以继续在图形上传窗口监测该指定外设操作,若该指定外设操作消失,删除悬浮遮罩层以及展示的第一图形码,在图形上传窗口上展示原始图片。
在一个示例中,当上传页面已上传图片,用户如果需要重新上传,通过CSS的hover效果只需鼠标移入图片,原图片上层会自动浮现带透明度的新二维码遮罩层,当用户鼠标移开时,二维码遮罩会消失,当用户已经上传完图片并且想更换图片时只需鼠标移入图片上方,二维码遮罩会自动展现出来供用户扫码。
在本实施例的一个实施方式中,在上传页面的图形上传窗口监测指定外设操作之前,还包括:向服务器发送第二轮询请求;接收服务器基于第二轮询请求上传的第二图片;在上传页面的图形上传窗口中填充第二图片,并终止发送第二轮询请求。
可选的,终止发送第二轮询请求的条件包括:显示客户端接收到服务器基于第二轮询请求上传的第二图片,显示客户端在上传页面的图形上传窗口中填充完成第二图片。
在此以备案系统备案验证页面为例,当用户访问上传页面并且填写完相应信息到需要上传证件图片时,上传页面在图形上传窗口展示图形码,用户只需拿出手机扫码就可以进行拍照上传到服务器,手机端上传完后,PC端页面会通过页面轮询自动从该服务器拉取已上传的图片信息并填充到图形上传窗口,并且会自动终止轮询操作,即当轮询获取到扫码结果时会及时终止页面轮询,停止发送轮询请求。
通过在第二图片接收或填充完成之后,终止发送第二轮询请求,减少了无效指令的发送,节约了显示客户端和服务器的资源。
在本实施例的一个实施场景中,还可以在上传页面的图形上传窗口中局部刷新当前显示的图形码。在基于图片重传指令在图形上传窗口上展示第一图形码之后,还包括:在上传页面监测第一图形码的刷新指令,其中,刷新指令用于指示刷新图形上传窗口内当前显示的第一图形码;若监测到刷新指令,在上传页面的图形上传窗口内将第一图形码更新为第二图形码。
本实施例的显示客户端与业务服务器(如web服务器、云服务器等,与上传图片的服务器是同一个服务器或者单独部署)之间通过Ajax(synchronous JavaScript And XML,异步JavaScript和XML)进行交互,在显示客户端的浏览器与业务服务器之间使用异步数据传输,使网页从服务器请求少量的信息,而不是整个上传页面。当用户想刷新二维码时,只需点击上传页面中的图片刷新按钮,二维码就会基于Ajax局部刷新。在另一些切换图像码的场景中,当用户切换到与当前图像码对应的业务类型时,在业务服务器中通过预设表查找与业务类型对应的图像码,并发送到上传页面,上传页面在图形上传窗口中刷新二维码。
图3是本发明实施例刷新图形码的示意图,用户通过点击上传页面中的刷新按钮触发刷新指令,将图像上传窗口中的第一图形码更新为第二图形码,上传页面中其他数据不更新。
在一个实例中,在上传页面的图形上传窗口内将第一图形码更新为第二图形码包括:显示客户端使用JS(JavaScript)调用Ajax引擎向业务服务器发送图形码的数据请求,业务服务器解析该数据请求,向显示客户端反馈第二图形码的数据,显示客户端在在上传页面的图形上传窗口中渲染该数据,生成第二图形码。
在本实施例的一个实施场景中,还可以在上传页面的图形上传窗口中放大当前显示的图形码。在基于图片重传指令在图形上传窗口上展示第一图形码之后,还包括:在上传页面监测第一图形码的放大指令,其中,放大指令用于指示放大第一图形码;若监测到放大指令,在上传页面将第一图形码从原始尺寸放大至目标尺寸,其中,原始尺寸为图形上传窗口的尺寸。
图4是本发明实施例放大图形码的示意图,当上传页面的窗口过小导致扫码不成功时,用户可以通过点击二维码图片,触发放大指令,在不缩放上传页面的基础上放大二维码,提高扫码成功率。
将图形上传窗口中的图形码设置为扩展标记语言Http请求(XMLHttpRequest)对象,基于Ajax和XMLHttpRequest对象,向业务服务器发送刷新指令,业务服务器重新配置图形码的时间戳,并反馈至显示客户端,就可以使用不必让用户等待服务器响应的请求模型,直接针对局部请求作出响应,客户端与业务服务端交互的只是对象的局部数据,而不是整个上传页面,如果页面加载的数据很大的时候,使用Ajax实现局部刷新,缩短了页面加载时间。
在本实施例的一个实施场景中,还可以在重新加载的上传页面中自动填充历史图形码。在向服务器发送第一轮询请求之后,还包括:接收服务器基于第一轮询请求上传的第一图片,并在上传页面的图形上传窗口中填充第一图片;在显示客户端关闭上传页面之后,重载上传页面;在上传页面重载完成后,在显示客户端的缓存中读取第一图片;在上传页面的图形上传窗口中重新填充第一图片。
当用户已经扫码上传过图片但未提交成功,因某些原因关闭了上传页面时,再次进入上传页面时,通过将之前上传的图片保存至显示客户端的缓存中,当重载上传页面时,可以从本地带入上次未提交的图片信息,无需用户再次重复上传,而且页面也不必再触发轮询操作,减少服务器请求节约服务器资源。
通过以上的实施方式的描述,本领域的技术人员可以清楚地了解到根据上述实施例的方法可借助软件加必需的通用硬件平台的方式来实现,当然也可以通过硬件,但很多情况下前者是更佳的实施方式。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质(如ROM/RAM、磁碟、光盘)中,包括若干指令用以使得一台终端设备(可以是手机,计算机,服务器,或者网络设备等)执行本发明各个实施例所述的方法。
实施例2
在本实施例中还提供了一种图片的上传装置,用于实现上述实施例及优选实施方式,已经进行过说明的不再赘述。如以下所使用的,术语“模块”可以实现预定功能的软件和/或硬件的组合。尽管以下实施例所描述的装置较佳地以软件来实现,但是硬件,或者软件和硬件的组合的实现也是可能并被构想的。
图5是根据本发明实施例的一种图片的上传装置的结构框图,如图5所示,该装置包括:第一监测模块50,展示模块52,第一发送模块54,其中,
第一监测模块50,用于在上传页面的图形上传窗口监测指定外设操作,其中,所述上传页面展示在显示客户端的显示界面上;
展示模块52,用于若监测到所述指定外设操作,触发图片重传指令,基于所述图片重传指令在所述图形上传窗口上展示第一图形码,并启动计时器,其中,所述第一图形码包括将第一图片从扫描客户端上传至服务器的上传入口;
第一发送模块54,用于在所述计时器达到预设时长后,向服务器发送第一轮询请求,其中,所述第一轮询请求用于向所述服务器请求扫描客户端上传的所述第一图片。
可选的,所述装置还包括:第二发送模块,用于在所述第一监测模块在上传页面的图形上传窗口监测指定外设操作之前,向所述服务器发送所述第二轮询请求;接收模块,用于接收所述服务器基于所述第二轮询请求上传的第二图片;处理模块,用于在所述上传页面的图形上传窗口中填充所述第二图片,并终止发送所述第二轮询请求。
可选的,所述装置还包括:第二监测模块,用于在所述展示模块基于所述图片重传指令在所述图形上传窗口上展示第一图形码之后,在所述上传页面监测所述第一图形码的刷新指令,其中,所述刷新指令用于指示刷新所述图形上传窗口内当前显示的第一图形码;更新模块,用于若监测到所述刷新指令,在所述上传页面的图形上传窗口内将所述第一图形码更新为第二图形码。
可选的,所述装置还包括:第三监测模块,用于在所述展示模块基于所述图片重传指令在所述图形上传窗口上展示第一图形码之后,在所述上传页面监测所述第一图形码的放大指令,其中,所述放大指令用于指示放大所述第一图形码;放大模块,用于若监测到所述放大指令,在所述上传页面将所述第一图形码从原始尺寸放大至目标尺寸,其中,所述原始尺寸为所述图形上传窗口的尺寸。
可选的,所述装置还包括:接收模块,用于在所述第一发送模块向服务器发送第一轮询请求之后,接收所述服务器基于所述第一轮询请求上传的第一图片,并在所述上传页面的图形上传窗口中填充所述第一图片;重载模块,用于在所述显示客户端关闭所述上传页面之后,重载所述上传页面;读取模块,用于在所述上传页面重载完成后,在所述显示客户端的缓存中读取所述第一图片;填充模块,用于在所述上传页面的图形上传窗口中重新填充所述第一图片。
可选的,所述展示模块包括:读取单元,用于以所述图片重传指令为触发条件,在所述显示客户端的配置表中读取所述指定外设操作的层叠样式表CSS属性,其中,所述CSS属性用于预先通过hover选择器配置所述图形上传窗口的显示样式;展示单元,用于基于所述CSS属性在所述图形上传窗口的原始图片上方通过悬浮遮罩层展示所述第一图形码。
可选的,所述第一监测模块包括以下之一:第一监测单元,用于在上传页面的图形上传窗口监测鼠标的悬浮操作;第二监测单元,用于在上传页面的图形上传窗口监测触控操作;第三监测单元,用于在上传页面的图形上传窗口监测选中操作;第四监测单元,用于在上传页面的图形上传窗口监测点击操作。
需要说明的是,上述各个模块是可以通过软件或硬件来实现的,对于后者,可以通过以下方式实现,但不限于此:上述模块均位于同一处理器中;或者,上述各个模块以任意组合的形式分别位于不同的处理器中。
实施例3
本发明的实施例还提供了一种存储介质,该存储介质中存储有计算机程序,其中,该计算机程序被设置为运行时执行上述任一项方法实施例中的步骤。
可选地,在本实施例中,上述存储介质可以被设置为存储用于执行以下步骤的计算机程序:
S1,在上传页面的图形上传窗口监测指定外设操作,其中,所述上传页面展示在显示客户端的显示界面上;
S2,若监测到所述指定外设操作,触发图片重传指令,基于所述图片重传指令在所述图形上传窗口上展示第一图形码,并启动计时器,其中,所述第一图形码包括将第一图片从扫描客户端上传至服务器的上传入口;
S3,在所述计时器达到预设时长后,向服务器发送第一轮询请求,其中,所述第一轮询请求用于向所述服务器请求扫描客户端上传的所述第一图片。
可选地,在本实施例中,上述存储介质可以包括但不限于:U盘、只读存储器(Read-Only Memory,简称为ROM)、随机存取存储器(Random Access Memory,简称为RAM)、移动硬盘、磁碟或者光盘等各种可以存储计算机程序的介质。
本发明的实施例还提供了一种电子设备,包括存储器和处理器,该存储器中存储有计算机程序,该处理器被设置为运行计算机程序以执行上述任一项方法实施例中的步骤。
可选地,上述电子设备还可以包括传输设备以及输入输出设备,其中,该传输设备和上述处理器连接,该输入输出设备和上述处理器连接。
可选地,在本实施例中,上述处理器可以被设置为通过计算机程序执行以下步骤:
S1,在上传页面的图形上传窗口监测指定外设操作,其中,所述上传页面展示在显示客户端的显示界面上;
S2,若监测到所述指定外设操作,触发图片重传指令,基于所述图片重传指令在所述图形上传窗口上展示第一图形码,并启动计时器,其中,所述第一图形码包括将第一图片从扫描客户端上传至服务器的上传入口;
S3,在所述计时器达到预设时长后,向服务器发送第一轮询请求,其中,所述第一轮询请求用于向所述服务器请求扫描客户端上传的所述第一图片。
可选地,本实施例中的具体示例可以参考上述实施例及可选实施方式中所描述的示例,本实施例在此不再赘述。
图6是本发明实施例的一种电子设备的结构图,如图6所示,包括处理器61、通信接口62、存储器63和通信总线64,其中,处理器61,通信接口62,存储器63通过通信总线64完成相互间的通信,存储器63,用于存放计算机程序;处理器61,用于执行存储器63上所存放的程序。
上述本申请实施例序号仅仅为了描述,不代表实施例的优劣。
在本申请的上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述的部分,可以参见其他实施例的相关描述。
在本申请所提供的几个实施例中,应该理解到,所揭露的技术内容,可通过其它的方式实现。其中,以上所描述的装置实施例仅仅是示意性的,例如所述单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,单元或模块的间接耦合或通信连接,可以是电性或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外,在本申请各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储介质中。基于这样的理解,本申请的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可为个人计算机、服务器或者网络设备等)执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括:U盘、只读存储器(ROM,Read-Only Memory)、随机存取存储器(RAM,Random Access Memory)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。
以上所述仅是本申请的优选实施方式,应当指出,对于本技术领域的普通技术人员来说,在不脱离本申请原理的前提下,还可以做出若干改进和润饰,这些改进和润饰也应视为本申请的保护范围。
Claims (10)
1.一种图片的上传方法,其特征在于,包括:
在上传页面的图形上传窗口监测指定外设操作,其中,所述上传页面展示在显示客户端的显示界面上;
若监测到所述指定外设操作,触发图片重传指令,基于所述图片重传指令在所述图形上传窗口上展示第一图形码,并启动计时器,其中,所述第一图形码包括将第一图片从扫描客户端上传至服务器的上传入口;
在所述计时器达到预设时长后,向服务器发送第一轮询请求,其中,所述第一轮询请求用于向所述服务器请求扫描客户端上传的所述第一图片。
2.根据权利要求1所述的方法,其特征在于,在上传页面的图形上传窗口监测指定外设操作之前,所述方法还包括:
向所述服务器发送第二轮询请求;
接收所述服务器基于所述第二轮询请求上传的第二图片;
在所述上传页面的图形上传窗口中填充所述第二图片,并终止发送所述第二轮询请求。
3.根据权利要求1所述的方法,其特征在于,在基于所述图片重传指令在所述图形上传窗口上展示第一图形码之后,所述方法还包括:
在所述上传页面监测所述第一图形码的刷新指令,其中,所述刷新指令用于指示刷新所述图形上传窗口内当前显示的第一图形码;
若监测到所述刷新指令,在所述上传页面的图形上传窗口内将所述第一图形码更新为第二图形码。
4.根据权利要求1所述的方法,其特征在于,在基于所述图片重传指令在所述图形上传窗口上展示第一图形码之后,所述方法还包括:
在所述上传页面监测所述第一图形码的放大指令,其中,所述放大指令用于指示放大所述第一图形码;
若监测到所述放大指令,在所述上传页面将所述第一图形码从原始尺寸放大至目标尺寸,其中,所述原始尺寸为所述图形上传窗口的尺寸。
5.根据权利要求1所述的方法,其特征在于,在向服务器发送第一轮询请求之后,所述方法还包括:
接收所述服务器基于所述第一轮询请求上传的第一图片,并在所述上传页面的图形上传窗口中填充所述第一图片;
在所述显示客户端关闭所述上传页面之后,重载所述上传页面;
在所述上传页面重载完成后,在所述显示客户端的缓存中读取所述第一图片;
在所述上传页面的图形上传窗口中重新填充所述第一图片。
6.根据权利要求1所述的方法,其特征在于,基于所述图片重传指令在所述图形上传窗口上展示第一图形码包括:
以所述图片重传指令为触发条件,在所述显示客户端的配置表中读取所述指定外设操作的层叠样式表CSS属性,其中,所述CSS属性用于预先通过hover选择器配置所述图形上传窗口的显示样式;
基于所述CSS属性在所述图形上传窗口的原始图片上方通过悬浮遮罩层展示所述第一图形码。
7.根据权利要求1所述的方法,其特征在于,在上传页面的图形上传窗口监测指定外设操作包括以下之一:
在上传页面的图形上传窗口监测鼠标的悬浮操作;
在上传页面的图形上传窗口监测触控操作;
在上传页面的图形上传窗口监测选中操作;
在上传页面的图形上传窗口监测点击操作。
8.一种图片的上传装置,其特征在于,包括:
第一监测模块,用于在上传页面的图形上传窗口监测指定外设操作,其中,所述上传页面展示在显示客户端的显示界面上;
展示模块,用于若监测到所述指定外设操作,触发图片重传指令,基于所述图片重传指令在所述图形上传窗口上展示第一图形码,并启动计时器,其中,所述第一图形码包括将第一图片从扫描客户端上传至服务器的上传入口;
第一发送模块,用于在所述计时器达到预设时长后,向服务器发送第一轮询请求,其中,所述第一轮询请求用于向所述服务器请求扫描客户端上传的所述第一图片。
9.一种存储介质,其特征在于,所述存储介质包括存储的程序,其中,所述程序运行时执行上述权利要求1至7中任一项所述的方法步骤。
10.一种电子设备,包括处理器、通信接口、存储器和通信总线,其中,处理器,通信接口,存储器通过通信总线完成相互间的通信;其中:
存储器,用于存放计算机程序;
处理器,用于通过运行存储器上所存放的程序来执行权利要求1至7中任一项所述的方法步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110209264.8A CN113032205A (zh) | 2021-02-24 | 2021-02-24 | 图片的上传方法及装置、存储介质、电子设备 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110209264.8A CN113032205A (zh) | 2021-02-24 | 2021-02-24 | 图片的上传方法及装置、存储介质、电子设备 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN113032205A true CN113032205A (zh) | 2021-06-25 |
Family
ID=76461668
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202110209264.8A Pending CN113032205A (zh) | 2021-02-24 | 2021-02-24 | 图片的上传方法及装置、存储介质、电子设备 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN113032205A (zh) |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN115422958A (zh) * | 2022-09-06 | 2022-12-02 | 博泰车联网(南京)有限公司 | 图片的操作方法、电子设备及存储介质 |
Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN106230946A (zh) * | 2016-08-03 | 2016-12-14 | 北京天职信息技术有限公司西安分公司 | 一种通过二维码扫描上传实现文件传输的方法 |
CN107798078A (zh) * | 2017-10-11 | 2018-03-13 | 金蝶软件(中国)有限公司 | 看板数据展示方法、装置、计算机设备和存储介质 |
CN108363809A (zh) * | 2018-03-09 | 2018-08-03 | 江苏科建教育软件有限责任公司 | 一种在pc端信息录入界面上传照片的方法 |
CN110430249A (zh) * | 2019-07-23 | 2019-11-08 | 上海易点时空网络有限公司 | 基于手机应用程序的处理方法以及装置 |
US20200065795A1 (en) * | 2017-08-29 | 2020-02-27 | Tencent Technology (Shenzhen) Company Limited | Resource transfer method and apparatus and storage medium |
CN111601149A (zh) * | 2020-06-02 | 2020-08-28 | 青岛海信传媒网络技术有限公司 | 一种操作指南显示方法及显示设备 |
-
2021
- 2021-02-24 CN CN202110209264.8A patent/CN113032205A/zh active Pending
Patent Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN106230946A (zh) * | 2016-08-03 | 2016-12-14 | 北京天职信息技术有限公司西安分公司 | 一种通过二维码扫描上传实现文件传输的方法 |
US20200065795A1 (en) * | 2017-08-29 | 2020-02-27 | Tencent Technology (Shenzhen) Company Limited | Resource transfer method and apparatus and storage medium |
CN107798078A (zh) * | 2017-10-11 | 2018-03-13 | 金蝶软件(中国)有限公司 | 看板数据展示方法、装置、计算机设备和存储介质 |
CN108363809A (zh) * | 2018-03-09 | 2018-08-03 | 江苏科建教育软件有限责任公司 | 一种在pc端信息录入界面上传照片的方法 |
CN110430249A (zh) * | 2019-07-23 | 2019-11-08 | 上海易点时空网络有限公司 | 基于手机应用程序的处理方法以及装置 |
CN111601149A (zh) * | 2020-06-02 | 2020-08-28 | 青岛海信传媒网络技术有限公司 | 一种操作指南显示方法及显示设备 |
Non-Patent Citations (2)
Title |
---|
AMIT YADAV 等: "A secure approach of image encryption using QR code in social media", IEEE, pages 1126 - 1129 * |
杨恒;徐学洲;: "基于SVG的Web页面动态刷新", 微机发展, no. 12, pages 121 - 123 * |
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN115422958A (zh) * | 2022-09-06 | 2022-12-02 | 博泰车联网(南京)有限公司 | 图片的操作方法、电子设备及存储介质 |
CN115422958B (zh) * | 2022-09-06 | 2023-12-22 | 博泰车联网(南京)有限公司 | 图片的操作方法、电子设备及存储介质 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US11164278B2 (en) | Screen capture method, terminal, and storage medium employing both parent application program and sub-application program | |
KR102182917B1 (ko) | 그래픽 코드 디스플레이 방법 및 장치 | |
EP2835952A1 (en) | Information sharing method and device | |
US9185162B2 (en) | System using server to synchronize document displayed on mobile devices | |
CN110990741B (zh) | 一种页面展示方法、装置、电子设备、服务器及存储介质 | |
WO2017211226A1 (zh) | 展示媒体文件的方法、终端和存储介质 | |
EP3142304A1 (en) | Synchronization method for notification message of electronic device, server and electronic device | |
EP3142336A1 (en) | Synchronization method for notification message of electronic device, and electronic device | |
CN110413911B (zh) | 网络图片加载方法、装置、终端设备及存储介质 | |
CN103391307A (zh) | 离线数据的离线透传和显示方法、装置及系统 | |
CN113946403B (zh) | 数据展示方法、装置、存储介质及电子设备 | |
WO2024011899A1 (zh) | 微件的加载方法、装置、设备以及存储介质 | |
EP3242197A1 (en) | Desktop sharing method and mobile terminal | |
CN109388737B (zh) | 一种内容项的曝光数据的发送方法、装置及存储介质 | |
CN113051493A (zh) | 应用程序展示方法、装置、存储介质以及终端 | |
CN116127420A (zh) | 水印的添加方法和装置、存储介质、电子装置 | |
EP3506599A1 (en) | Method for synchronizing contact information, apparatus, medium, electronic device and system | |
CN113032205A (zh) | 图片的上传方法及装置、存储介质、电子设备 | |
CN112148395A (zh) | 页面显示方法、装置、设备及存储介质 | |
CN113419649A (zh) | 用于操作电子装置的方法及其装置 | |
US9942287B2 (en) | Information processing system, terminal device, and method | |
JP5643449B1 (ja) | 端末装置に表示画面を表示させるサーバ及び方法 | |
CN115643468A (zh) | 海报生成方法、装置、电子设备及存储介质 | |
CN113467776B (zh) | 设备的接入方法、装置、存储介质和电子装置 | |
CN112702257B (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 |