CN107451279A - 文件上传方法、装置、电子设备和计算机可读存储介质 - Google Patents

Abstract

本发明实施例提供了一种文件上传方法及装置、电子设备和计算机可读存储介质。其中，该方法包括利用原生JS，通过目标网页的表单接收待上传文件；其中，目标网页包括内联框架和表单；表单包括待上传文件的编码方式和统一资源定位符URL，编码方式属性为非字符编码方式；内联框架嵌在表单内；利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，实现向URL指向的服务器上传待上传文件。本发明实施例提供的技术方案解决了如何简单且无需刷新网页而实现文件上传的技术问题，提高了文件上传效率而且用户还可以自由定制样式和动画。

Description

文件上传方法、装置、电子设备和计算机可读存储介质

技术领域

本发明涉及互联网技术领域，特别是涉及文件上传方法和装置以及电子设备和计算机可读存储介质。

背景技术

在Web(网站)应用开发中，经常涉及到通过网页上传文件的应用。随着互联网技术的飞速发展，用户对网站的体验要求越来越高，出现许多文件上传技术，例如：异步上传文件、拖拽式上传、黏贴上传、上传进度监控、文件缩略图、大文件断点续传、大文件秒传等等。

但是，上述文件上传技术使用起来较为复杂。例如，它们在实现文件上传的过程中，需要使用jquery(一个JavaScript(基于对象和事件驱动的脚本语言，简称JS)工具库)框架等，引入所依赖的JS文件。而且，上述现有技术在通过表单上传文件时总是存在重新刷新网页的问题。

因此，如何克服现有文件上传方法使用复杂且需要重新刷新页面是丞待解决的问题。

发明内容

本发明实施例的目的在于提供一种文件上传方法，以解决如何简单且无需刷新网页而实现文件上传的技术问题。此外，还提供一种文件上传装置、电子设备和计算机可读存储介质。

为了实现上述目的，本发明的一个方面，提供以下技术方案：

一种文件上传方法，所述方法包括：

利用原生JS，通过目标网页的表单接收待上传文件；其中，所述目标网页包括内联框架和表单；所述表单包括所述待上传文件的编码方式和统一资源定位符URL，所述编码方式属性为非字符编码方式；所述内联框架嵌在所述表单内；

利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器，实现向所述URL指向的服务器上传所述待上传文件。

进一步地，在所述表单接收待上传文件的步骤之后、在将所述表单提交至所述URL指向的服务器的步骤之前，所述方法还包括：

对所述表单进行序列化，得到二进制流形式的表单；

所述利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器的步骤，具体包括：

利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述二进制流形式的表单上传至所述URL指向的服务器。

进一步地，在将所述表单提交至所述URL指向的服务器的步骤之前，所述方法还包括：

在所述表单中创建文件域；

对所述文件域与用于触发文件上传的触发事件进行绑定；

所述利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器的步骤具体包括：

检测所述用于触发上传所述待上传文件的触发事件；

响应检测到的所述触发事件，利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器。

进一步地，所述利用原生JS方法，通过目标网页的表单接收待上传文件的步骤，包括：

利用所述原生JS方法，调用用于在所述目标网页中上传文件的目标函数，通过所述目标函数中定义的表单接收所述待上传文件；

其中，所述目标函数为：嵌入在所述目标网页的HTML文档中的函数，或所述目标函数为：由所述目标网页的HTML文档的外部JS文件确定的函数。

为了实现上述目的，本发明的另一个方面，还提供了以下技术方案：

一种文件上传装置，所述装置包括：

接收模块，用于利用原生JS，通过目标网页的表单接收待上传文件；其中，所述目标网页包括内联框架和表单；所述表单包括所述待上传文件的编码方式和统一资源定位符URL，所述编码方式属性为非字符编码方式；所述内联框架嵌在所述表单内；

上传模块，用于利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器，实现向所述URL指向的服务器上传所述待上传文件。

进一步地，所述文件上传装置还包括：

序列化模块，用于对所述表单进行序列化，得到二进制流形式的表单；

所述上传模块具体包括：

第一上传单元，用于利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述二进制流形式的表单上传至所述URL指向的服务器。

进一步地，所述文件上传装置还包括：

创建模块，用于在所述表单中创建文件域；

绑定模块，用于对所述文件域与用于触发文件上传的触发事件进行绑定；

所述上传模块具体包括：

检测单元，用于检测所述用于触发上传所述待上传文件的触发事件；

第二上传单元，用于响应检测到的所述触发事件，利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器。

进一步地，所述接收模块包括：

接收单元，用于利用所述原生JS方法，调用用于在所述目标网页中上传文件的目标函数，通过所述目标函数中定义的表单接收所述待上传文件；

其中，所述目标函数为：嵌入在所述目标网页的HTML文档中的函数，或所述目标函数为：由所述目标网页的HTML文档的外部JS文件确定的函数。

为了实现上述目的，本发明的再一个方面，还提供了以下技术方案：

一种电子设备，其包括处理器、通信接口、存储器和通信总线，其中，所述处理器、所述通信接口和所述存储器通过所述通信总线完成相互间的通信；

所述存储器，用于存放计算机程序；

所述处理器，用于执行存储器上所存放的程序时，实现上述任一方法技术方案所述的方法步骤。

为了实现上述目的，本发明的又一个方面，还提供了以下技术方案：

一种计算机可读存储介质，所述计算机可读存储介质内存储有计算机程序，所述计算机程序被处理器执行时实现上述任一方法技术方案所述的方法步骤。

本发明实施例提供一种文件上传方法及装置、电子设备和计算机可读存储介质。其中，文件上传方法应用于网页并且包括利用原生JS，通过目标网页的表单接收待上传文件；其中，目标网页包括内联框架和表单；表单包括待上传文件的编码方式和统一资源定位符URL，编码方式属性为非字符编码方式；内联框架嵌在表单内；利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，实现向URL指向的服务器上传待上传文件。与依靠jquery函数库实现文件上传的现有技术相比，本发明实施例提供的技术方案，利用原生JS，通过目标网页的表单接收待上传文件，而没有采用诸如iquery函数库等；因此，可以提高文件上传的效率。另外，由于本实施例将内联框架嵌在表单内，所以，服务器返回的数据会传输至内联框架内。由此，将内联框架内的页面作为表单提交后的页面，从而将待上传文件上传后的刷新操作转移至了内联框架内，在内联框架内进行网页的局部刷新，由此只需对网页中发生变化的元素进行刷新，有限的网络带宽或网络通信拥堵对文件上传操作的影响不大，不会使网页长时间滞留在等待刷新的状态，从而实现了无需刷新整个网页而上传文件的技术效果，进而提高了文件上传的效率。另外，还可以利用内联框架自由定制文件上传的样式和文件上传的动画效果。此外，本发明实施例采用了阿贾克斯方法，并按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，可以实现多个文件的异步上传。

本发明的其它特征和优点将在随后的说明书中阐述，并且，部分地从说明书中变得显而易见，或者通过实施本发明而得以体现。本发明的目的和其他优点可通过在说明书、权利要求书以及附图中所特别指出的结构来实现和获得。

当然，实施本发明的任一产品或方法不必一定需要同时达到以上所述的所有优点。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为根据本发明实施例的文件上传方法的流程示意图；

图2为根据本发明另一实施例的文件上传方法的流程示意图；

图3为根据本发明实施例的文件上传装置的结构示意图；

图4为根据本发明实施例的电子设备的结构示意图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

这里，对本发明实施例的应用环境进行详细说明：

本发明实施例可以通过script标签，以引用的方式，嵌入HTML(超文本标记语言)文档的头部或主体部分，然后由浏览器对HTML文档进行解析，从而在网页上显示文件上传视窗。本发明实施例可以应用于网络系统的前端，即人机交互端。该人机交互端可以通过专门的客户端实现，也可以通过网络浏览器来访问服务器的方式实现，即可以采用浏览器/服务器(B/S)结构，也可以采用客户端/服务器(C/S)结构实现。

在现有的文件上传方法中，单纯地使用表单且需要依赖类似jquery函数库等，并将该函数库导入网页(也称页面)来实现文件上传。所以，现有方法因使用类似jquery函数库等而实现起来复杂且总是刷新网页。因此，本发明实施例提供一种文件上传方法。该方法应用于网页。如图1所示，该方法包括如下步骤S100至步骤S110。

S100：利用原生JS，通过目标网页的表单接收待上传文件；其中，目标网页包括内联框架和表单；表单包括待上传文件的编码方式和统一资源定位符URL，编码方式属性为非字符编码方式；内联框架嵌在表单内。

其中，原生JS是指不依赖框架的javascript(一种基于对象和事件驱动并具有相对安全性的客户端脚本语言，简称JS)。

通过目标网页的表单接收待上传文件可以理解为将待上传文件作为该表单的内容，也可以理解为：将表单视为框架，该框架将待上传文件封装起来。

内联框架可以理解为利用超文本标记语言中的iframe标签构建的框架，例如，网页上的广告弹出框、网页动画等。

表单可以理解为网页中的一个控件集合。在具体实施过程中，表单可以在网页的HTML文档中通过form标签来构建。

待上传文件的编码方式用来指定待上传文件的传输形式。在通过表单的方式上传文件时，需要将表单的待上传文件的编码方式设置为非字符编码方式，例如，二进制流；否则，无法将文件上传至目标URL指向的服务器，例如，如果使用浏览器上传文件，则浏览器无法将采用字符编码方式的文件上传到服务器；如果使用阿贾克斯方法上传文件时会出现乱码的现象。

URL(Uniform Resoure Locator，统一资源定位符)可以通过表单中的action属性指定。该URL用于指定接收表单待上传文件的地址。例如，在该地址，服务器在接收到表单后做相应的处理，将待上传的文件存储到指定位置。

本发明实施例中，将内联框架嵌在表单内可以通过将表单的目标属性值设置为与内联框架同名来实现，由此，由URL所指向的服务器在接收到上传的文件后，可以将返回结果反馈至内联框架。这样，将利用表单上传文件的刷新动作转移至内联框架内。

另外，本发明实施例还可以在内联框架内部进行自由定制动画、样式等，实现诸如上传前、上传中、上传后的各种动画、样式等有益效果。例如，可以在内联框架内引入广告动画的地址，从而可以在网页上外挂广告动画，而且网页主页的样式不会影响该广告动画；还可以通过内联框架添加诸如透明等装饰属性。

本步骤中，利用原生JS，通过目标网页的表单接收待上传文件，而没有依赖诸如jquery函数库等，所以，无需调用诸如jquery函数库等，因此，提高了文件上传效率。

在一个可选的实施例中，利用原生JS，通过目标网页的表单接收待上传文件的步骤具体可以包括：利用原生JS，调用用于在目标网页中上传文件的目标函数，通过目标函数中定义的表单接收待上传文件；其中，目标函数为：嵌入在目标网页的HTML文档中的函数，或目标函数为：由目标网页的HTML文档的外部JS文件确定的函数。

本实施例中，目标函数为：嵌入在目标网页的HTML文档中的函数，或为：由目标网页的HTML文档的外部JS文件确定的函数，可以理解为目标函数可以通过两种方式引入网页中，也就是说，目标函数可以嵌入在目标网页的HTML文档中，也可以作为目标网页的HTML文档的外部JS文件。

本实施例由于利用原生JS，调用用于在目标网页中上传文件的目标函数，进而通过目标函数中定义的表单接收待上传文件，而没有调用诸如jquery函数库等，所以，本发明实施例可以提高文件上传效率。

S110：利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，实现向URL指向的服务器上传待上传文件。

其中，阿贾克斯是指一种异步爪哇描述语言与可扩展标记语言结合的技术。阿贾克斯方法包括POST方法和GET方法。选择POST方法还是选择GET方法可以通过表单的method属性来定义。如果选择POST方法，则表单将被放在请求体中提交至服务器；如果选择GET方法，则表单以字符串的形式提交至服务器。

提交操作可以由浏览器完成。具体地，浏览器将通过表单接收的待上传文件放在HTTP(超文本传输协议)请求报文的请求体(也称实体)中，进行打包，然后再将打包后的数据发送至服务器。

本步骤采用了阿贾克斯方法，并按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，实现多个文件异步上传的有益效果。

本发明实施例与现有技术相比具有如下有益效果：

在现有通过表单上传文件的方法中，浏览器会强制刷新网页，当网络带宽有限或网络通信拥堵的时候，该刷新网页的操作会使得网页长时间滞留在等待刷新的状态，从而会严重影响文件上传的效率。与该现有技术相比，在利用阿贾克斯方法向服务器提交表单之后，可以将表单接收的内容提交至URL指定的服务器，然后服务器会返回数据(例如，URL、文件上传成功的消息等)。由于本实施例将内联框架嵌在表单内，所以，服务器返回的数据会传输至内联框架内。由此，将内联框架内的页面作为表单提交后的页面，从而将待上传文件上传后的刷新操作转移至了内联框架内，在内联框架内进行网页的局部刷新，由此只需对网页中发生变化的元素进行刷新，有限的网络带宽或网络通信拥堵对文件上传操作的影响不大，不会使网页长时间滞留在等待刷新的状态，从而实现了无需刷新整个网页而上传文件的技术效果，进而提高了文件上传的效率。另外，还可以利用内联框架自由定制文件上传的样式和文件上传的动画效果。此外，本发明实施例采用了阿贾克斯方法，并按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，可以实现多个文件的异步上传。再者，本发明实施例利用原生JS，通过目标网页的表单接收待上传文件，而没有采用诸如iquery函数库等；因此，本发明实施例可以提高文件上传的效率。

在一些可选的实施例中，在通过目标网页的表单接收待上传文件的步骤之后、在将表单提交至URL指向的服务器的步骤之前，文件上传方法还可以包括步骤a1；利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器的步骤具体可以包括步骤a2。其中：

a1：对表单进行序列化，得到二进制流形式的表单。

其中，序列化可以通过以下方式实现：利用javascript(一种基于对象和事件驱动的脚本语言，简称JS)，并采用UTF8编码方式将表单转化成二进制流形式的表单。

a2：利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将二进制流形式的表单上传至URL指向的服务器。

本步骤可以通过POST或GET方法将二进制流形式的表单传输至URL指向的服务器。

具体地，在利用阿贾克斯提交表单的过程中，可以通过XMLHttpRequest接口向服务器发送HTTP请求；当接收到来自服务器的响应后，将待上传文件的二进制数据嵌入HTTP请求报文的实体中，然后实现表单的提交，最后，浏览器将表单中数据进行打包，以二进制流的形式发送至服务器。

通过本实施例，可以实现多个文件异步上传的效果，从而可以提高用户上传文件的体验。

在一些可选的实施例中，在图1所示实施例的基础上，在将表单提交至URL指向的服务器的步骤之前，文件上传方法还可以包括步骤b1和步骤b2；并且，利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器的步骤具体可以包括步骤b3和步骤b4。其中：

b1：在表单中创建文件域。

其中，文件域可以理解为由一个文本框和一个“浏览”按钮组成的区域，即待上传文件选择输入框。通过文件域，可以直接将要上传的待上传文件的路径输人到文本框中，也可以单击“浏览”按钮选择待上传文件。在表单中创建文件域可以理解为在表单中嵌入待上传文件选择输入框。

本步骤可以通过超文本标记语言中的待上传文件输入标签来创建文件域。例如：input type＝“file”。其中，input是指输入标签；type表示输入类型。

b2：对文件域与用于触发文件上传的触发事件进行绑定。

其中，触发事件可以通过change属性来设定。

b3：检测用于触发上传待上传文件的触发事件。

b4：响应检测到的触发事件，利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器。

本实施例通过采用上述技术方案，利用触发事件，可以实现自动上传文件以及批量上传文件的技术效果。

本发明实施例通过采用上述任一技术方案，没有使用JS框架，无需将类似Jquery的函数库导入页面，而是直接使用JS原生代码，实现起来简单，代码量极小，执行效率高，且没有代码冗余；无需花费大量时间来学习文档，简化了文件上传中开发者的工作量；此外，本发明实施例还将表单与内联框架相结合，用户还可以利用JS的函数库定制样式和动画，而且通过该内联框架可以对待上传文件进行刷新，实现了不刷新整个网页而上传文件的有益效果。

下面结合图2以一优选实施方式来对本发明进行详细说明。

图2示例性地示出了文件上传方法的流程示意图。如图2所示，该文件上传方法包括：

S200：利用原生JS，调用用于在目标网页中上传文件的目标函数，通过目标函数中定义的表单接收待上传文件；目标函数为：嵌入在目标网页的HTML文档中的函数，或目标函数为：由目标网页的HTML文档的外部JS文件确定的函数；其中，目标网页包括内联框架和表单；表单包括待上传文件的编码方式和统一资源定位符URL，编码方式属性为非字符编码方式；内联框架嵌在表单内。

S201：对表单进行序列化，得到二进制流形式的表单。

S202：在表单中创建文件域。

S203：对文件域与用于触发文件上传的触发事件进行绑定。

S204：检测用于触发上传待上传文件的触发事件。

S205：响应检测到的触发事件，利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将二进制流形式的表单上传至URL指向的服务器。

通过本优选实施例利用原生JS，通过目标网页的表单接收待上传文件，而没有采用诸如iquery函数库等，由此可以提高文件上传的效率；另外，由于本实施例将内联框架嵌在表单内，所以，服务器返回的数据会传输至内联框架内。由此，将内联框架内的页面作为表单提交后的页面，从而将待上传文件上传后的刷新操作转移至了内联框架内，在内联框架内进行网页的局部刷新，由此只需对网页中发生变化的元素进行刷新，有限的网络带宽或网络通信拥堵对文件上传操作的影响不大，不会使网页长时间滞留在等待刷新的状态，从而实现了无需刷新整个网页而上传文件的技术效果，进而提高了文件上传的效率；而且，利用内联框架还可以自由定制文件上传的样式和文件上传的动画效果。此外，本发明实施例采用了阿贾克斯方法，并按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，可以实现多个文件的异步上传。

基于与上述方法实施例相同的技术构思，本发明实施例还提供一种文件上传装置。如图3所示，该装置包括接收模块31和上传模块32。其中，接收模块31用于利用原生JS，通过目标网页的表单接收待上传文件；其中，目标网页包括内联框架和表单；表单包括待上传文件的编码方式和统一资源定位符URL，编码方式属性为非字符编码方式；内联框架嵌在表单内。上传模块32用于利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，实现向URL指向的服务器上传待上传文件。

本发明实施例中，通过接收模块31和提交模块32以表单的方式实现文件的上传，同时通过将表单的目标属性值设置为与内联框架同名来将内联框架嵌在表单内，由此，由URL所指向的服务器在接收到上传的文件后，可以将返回结果反馈至内联框架。这样，将利用表单上传文件的刷新动作转移至内联框架内，在利用接收模块31接收待上传文件并通过上传模块32上传文件后，可以由内联框架实现页面的局部刷新，由此只需对网页中发生变化的元素进行刷新，从而实现了无需刷新整个网页而上传文件的技术效果，进而提高了文件上传的效率。而且，该技术方案没有使用JS框架，无需将类似jquery的函数库导入页面，而是直接使用JS原生代码，实现起来简单，文件上传效率高；此外，本发明实施例还可以利用内联框架自由定制样式和动画。再者，上传模块32采用了阿贾克斯方法，并按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，可以实现多个文件的异步上传。

在一些可选的实施例中，文件上传装置还包括序列化模块；并且上传模块具体还可以包括第一上传单元。其中，序列化模块用于对表单进行序列化，得到二进制流形式的表单。第一上传单元用于利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将二进制流形式的表单上传至URL指向的服务器。

其中，序列化模块利用javascript，并采用UTF8编码方式将表单转化成二进制流形式的表单。第一上传单元可以通过POST或GET方法将二进制流形式的表单传输至URL指向的服务器。

在一些可选的实施例中，文件上传装置还包括创建模块和绑定模块；并且，上传模块具体包括检测单元和第二上传单元。其中，创建模块用于在表单中创建文件域。绑定模块用于对文件域与用于触发文件上传的触发事件进行绑定。检测单元用于检测用于触发上传待上传文件的触发事件。第二上传单元用于响应检测到的触发事件，利用阿贾克斯方法，按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器。

本实施例通过创建模块在表单中创建文件域，又通过绑定模块将文件域绑定触发事件，由此，提交模块响应于触发事件，通过阿贾克斯方法提交表单，以将待上传文件上传至URL，从而可以实现自动上传文件以及批量上传文件的技术效果。

在一些可选的实施例中，接收模块具体包括接收单元。其中，接收单元用于利用原生JS方法，调用用于在目标网页中上传文件的目标函数，通过目标函数中定义的表单接收待上传文件；其中，目标函数为：嵌入在目标网页的HTML文档中的函数，或目标函数为：由目标网页的HTML文档的外部JS文件确定的函数。

本实施例中，由于接收单元利用原生JS，调用用于在目标网页中上传文件的目标函数，进而通过目标函数中定义的表单接收待上传文件，而没有调用诸如jquery函数库等，所以，本发明实施例可以提高文件上传效率。

基于与文件上传方法实施例相同的技术构思，本发明实施例还提供一种电子设备。如图4所示，该电子设备包括处理器41、通信接口42、存储器43和通信总线44，其中，处理器41、通信接口42和存储器43通过通信总线44完成相互间的通信；存储器43用于存放计算机程序。处理器41用于执行存储器43上所存放的程序时，实现上述任一文件上传方法实施例所述的方法步骤。

上述电子设备提到的通信总线可以是外设部件互连标准(PeripheralComponentInterconnect，PCI)总线或扩展工业标准结构(Extended IndustryStandardArchitecture，EISA)总线等。该通信总线可以分为地址总线、数据总线、控制总线等。为便于表示，图中仅用一条粗线表示，但并不表示仅有一根总线或一种类型的总线。

上述通信接口42用于上述电子设备与其他设备之间的通信。

上述存储器43可以包括随机存取存储器(Random Access Memory，RAM)，也可以包括非易失性存储器(non-volatile memory，NVM)，例如至少一个磁盘存储器。可选的，存储器还可以是至少一个位于远离前述处理器的存储装置。

上述的处理器41可以是通用处理器，包括中央处理器(Central ProcessingUnit，简称CPU)、网络处理器(Ne twork Processor，NP)等；还可以是数字信号处理器(DigitalSignal Processing，DSP)、专用集成电路(Applica tion SpecificIntegrated Circuit，ASIC)、现场可编程门阵列(Field－Programmable Gate Array，FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。

上述电子设备包括但不限于智能手机、计算机、个人数字助理等。

本实施例利用原生JS，通过目标网页的表单接收待上传文件，而没有采用诸如iquery函数库等；因此，实现起来简单，可以提高文件上传的效率。另外，由于本实施例将内联框架嵌在表单内，所以，服务器返回的数据会传输至内联框架内。由此，将内联框架内的页面作为表单提交后的页面，从而将待上传文件上传后的刷新操作转移至了内联框架内，在内联框架内进行网页的局部刷新，由此只需对网页中发生变化的元素进行刷新，有限的网络带宽或网络通信拥堵对文件上传操作的影响不大，不会使网页长时间滞留在等待刷新的状态，从而实现了由处理器41执行存储器43上所存放的程序时可以无需刷新网页而上传文件的有益效果，进而提高了文件上传的效率。另外，还可以利用内联框架自由定制文件上传的样式和文件上传的动画效果。此外，处理器41执行存储器43上所存放的程序进行文件上传时，采用了阿贾克斯方法，并按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，可以实现多个文件的异步上传。

基于与文件上传方法实施例相同的技术构思，本发明实施例还提供一种计算机可读存储介质。该计算机可读存储介质内存储有计算机程序，计算机程序被处理器执行时实现上述任一文件上传方法实施例所述的方法步骤。

上述计算机可读存储介质可以包括但不限于随机存取存储器(RAM)、动态随机存取存储器(DRAM)、静态随机存取存储器(SRAM)、只读存储器(ROM)、可编程只读存储器(PROM)、可擦写可编程只读存储器(EPROM)、电可擦写可编程只读存储器(EEPROM)、闪存(例如，NOR型闪存或NAND型闪存)、内容可寻址存储器(CAM)、聚合物存储器(例如，铁电聚合物存储器)、相变存储器、双向开关半导体存储器、硅-氧化物-氮化硅-氧化硅-硅(Silicon-Oxide-Nitride-Oxide-Silicon，SONOS)存储器、磁卡或者光卡，亦或是其他任意适当类型的计算机可读存储介质。

本发明实施例利用原生JS，通过目标网页的表单接收待上传文件，而没有采用诸如iquery函数库等；因此，实现起来简单，可以提高文件上传的效率。另外，由于本实施例将内联框架嵌在表单内，所以，服务器返回的数据会传输至内联框架内。由此，将内联框架内的页面作为表单提交后的页面，从而将待上传文件上传后的刷新操作转移至了内联框架内，在内联框架内进行网页的局部刷新，由此只需对网页中发生变化的元素进行刷新，有限的网络带宽或网络通信拥堵对文件上传操作的影响不大，不会使网页长时间滞留在等待刷新的状态，从而实现了计算机程序被处理器执行时可以无需刷新网页而上传文件的有益效果，进而提高了文件上传的效率。另外，还可以利用内联框架自由定制文件上传的样式和文件上传的动画效果。此外，计算机程序被处理器执行时，采用了阿贾克斯方法，并按照非字符编码方式，通过内联框架，将表单提交至URL指向的服务器，可以实现多个文件的异步上传。

需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。

本说明书中的各个实施例均采用相关的方式描述，各个实施例之间相同或相似的部分互相参见即可，每个实施例重点说明的都是与其他实施例的不同之处。尤其，对于文件上传装置实施例、电子设备实施例和计算机可读存储介质实施例而言，由于其基本相似于方法实施例，所以描述的比较简单，相关之处参见方法实施例的部分说明即可。

以上所述仅为本发明的较佳实施例而已，并非用于限定本发明的保护范围。凡在本发明的精神和原则之内所作的任何修改、等同替换、改进等，均包含在本发明的保护范围内。

Claims (10)

1.一种文件上传方法，其特征在于，所述方法包括：

利用原生JS，通过目标网页的表单接收待上传文件；其中，所述目标网页包括内联框架和表单；所述表单包括所述待上传文件的编码方式和统一资源定位符URL，所述编码方式属性为非字符编码方式；所述内联框架嵌在所述表单内；

利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器，实现向所述URL指向的服务器上传所述待上传文件。

2.根据权利要求1所述的方法，其特征在于，在所述表单接收待上传文件的步骤之后、在将所述表单提交至所述URL指向的服务器的步骤之前，所述方法还包括：

对所述表单进行序列化，得到二进制流形式的表单；

所述利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器的步骤，具体包括：

利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述二进制流形式的表单上传至所述URL指向的服务器。

3.根据权利要求1所述的方法，其特征在于，在将所述表单提交至所述URL指向的服务器的步骤之前，所述方法还包括：

在所述表单中创建文件域；

对所述文件域与用于触发文件上传的触发事件进行绑定；

所述利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器的步骤具体包括：

检测所述用于触发上传所述待上传文件的触发事件；

响应检测到的所述触发事件，利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器。

4.根据权利要求1-3中任一所述的方法，其特征在于，所述利用原生JS，通过目标网页的表单接收待上传文件的步骤，包括：

利用所述原生JS，调用用于在所述目标网页中上传文件的目标函数，通过所述目标函数中定义的表单接收所述待上传文件；

其中，所述目标函数为：嵌入在所述目标网页的HTML文档中的函数，或所述目标函数为：由所述目标网页的HTML文档的外部JS文件确定的函数。

5.一种文件上传装置，其特征在于，所述装置包括：

接收模块，用于利用原生JS，通过目标网页的表单接收待上传文件；其中，所述目标网页包括内联框架和表单；所述表单包括所述待上传文件的编码方式和统一资源定位符URL，所述编码方式属性为非字符编码方式；所述内联框架嵌在所述表单内；

上传模块，用于利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器，实现向所述URL指向的服务器上传所述待上传文件。

6.根据权利要求5所述的装置，其特征在于，所述文件上传装置还包括：

序列化模块，用于对所述表单进行序列化，得到二进制流形式的表单；

所述上传模块具体包括：

第一上传单元，用于利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述二进制流形式的表单上传至所述URL指向的服务器。

7.根据权利要求5所述的装置，其特征在于，所述文件上传装置还包括：

创建模块，用于在所述表单中创建文件域；

绑定模块，用于对所述文件域与用于触发文件上传的触发事件进行绑定；

所述上传模块具体包括：

检测单元，用于检测所述用于触发上传所述待上传文件的触发事件；

第二上传单元，用于响应检测到的所述触发事件，利用阿贾克斯方法，按照非字符编码方式，通过所述内联框架，将所述表单提交至所述URL指向的服务器。

8.根据权利要求5-7中任一所述的装置，其特征在于，所述接收模块包括：

接收单元，用于利用所述原生JS方法，调用用于在所述目标网页中上传文件的目标函数，通过所述目标函数中定义的表单接收所述待上传文件；

其中，所述目标函数为：嵌入在所述目标网页的HTML文档中的函数，或所述目标函数为：由所述目标网页的HTML文档的外部JS文件确定的函数。

9.一种电子设备，其特征在于，包括处理器、通信接口、存储器和通信总线，其中，所述处理器、所述通信接口和所述存储器通过所述通信总线完成相互间的通信；

所述存储器，用于存放计算机程序；

所述处理器，用于执行存储器上所存放的程序时，实现权利要求1-4任一所述的方法步骤。

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质内存储有计算机程序，所述计算机程序被处理器执行时实现权利要求1-4任一所述的方法步骤。