一种前端页面与后端服务器通信方法
【专利摘要】本发明提供一种前端页面与后端服务器通信方法，所述方法包括步骤：S1.当用户打开前端页面时，所述后端服务器向该用户的所述前端页面发送连接组件、封装组件和数据交互组件；所述连接组件用于使前端页面与后端服务器建立TCP长连接；S2.当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，若所述标记值为第一标记值时，则将所述报文解封装并提取所述报文中的数据转发至与所述前端页面在同一聊天区域内其他用户的前端页面。本发明可以实现后端服务器通过长连接向前端页面推送数据，且使用自主设计的通讯协议，减少了数据传输时的无用数据，提高了传输效率。
【专利说明】一种前端页面与后端服务器通信方法
【技术领域】
[0001]本发明涉及通信【技术领域】，尤其涉及一种前端页面与后端服务器通信方法。
【背景技术】
[0002]随着互联网的飞速发展，用户可以通过浏览器查询各种多媒体信息，甚至进行在线数据交互，基于Web前端页面的服务程序与后端服务交换数据的实效性越来越重要。传统的互联网应用常采用ajax (异步JavaScript和XML,指一种创建交互式网页应用的网页开发技术)等方式获取后端服务器数据，但ajax在每种浏览器上的的实现方式各不相同。前端页面可以通过ajax向服务器后端请求的数据，但该请求通常会受到浏览器的限制，比如浏览器限制向相同域名下http服务器最多同时发送6个请求，其他的请求则被浏览器排队，直到前一个请求完成为止，这样页面就会发生阻塞、卡住不动，不能满足用户需求。
[0003]为了解决上述问题,在最新的HTML5标准中提出了一种Web Socket技术,他的意义在于用户可以通过前端页面实现很多以前无法实现的应用。例如目前的在线聊天室，如果用户想要发送一句话，在他按下“发送”按钮的同时，浏览器会递送给目标服务器一个请求，然后服务器端会将这句话显示在前端页面上，用户需要刷新自己的浏览器以获得最新页面才可以看到新消息。但Web Socket的双向通信功能,通过Web Socket技术构建的HTML5应用，用户不再需要频繁的刷新页面以获取新数据，而新数据会自动由服务器端推送至用户的电脑的前端页面上。这样的方式免去了浏览器的访问限制同时简化了用户操作。
[0004]但是目前并不是所有的浏览器均支持HTML5标准，尤其是IE系列的部分浏览器还不能够实现类似Web Socket的双向通信功能，无法通过后端服务器向前端页面提供数据推送服务。
【发明内容】
[0005]有鉴于此，本发明提供一种前端页面与后端服务器通信方法，所述方法应用于后端服务器，所述方法包括如下步骤:
[0006]S1.当用户打开前端页面时，所述后端服务器向该用户的所述前端页面发送连接组件、封装组件和数据交互组件；所述连接组件用于使前端页面与后端服务器建立TCP长连接；
[0007]S2.当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，若所述标记值为第一标记值时，则将所述报文解封装并提取所述报文中的数据根据其应用类型进行相应处理。
[0008]优选的，所述预定封装格式包括:数据长度、指令类型、指令参数以及其他数据，所述预设标记为所述指令类型。
[0009]优选的，所述预设标记的标记值还包括第二标记值，所述方法还包括步骤:
[0010]S3.当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，若所述标记值为第二标记值时，则根据所述报文的指令参数进行登录信息验证，将验证结果返回至所述用户前端页面的数据交互组件。
[0011]优选的，所述预设标记的标记值还包括第三标记值，所述方法还包括步骤:
[0012]S4.当所述后端服务器在预设时间内未收到所述前端页面发送的携带有第三标记值的报文时，则通过所述连接组件断开与所述前端页面的长连接。
[0013]优选的，所述预设标记的标记值还包括第四标记值，所述方法还包括步骤:
[0014]S5.当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，若所述标记值为第四标记值时，则通过所述连接组件断开与所述前端页面的长连接关系。
[0015]优选的，所述封装组件还用于，在到达前端页面后进行初始化，并与所述后端服务器进行非对称加密协商，以协商出用于对数据加密以及解密的密钥，并在协商完成后再为数据交互组件提供服务。
[0016]优选的，所述方法还包括步骤:
[0017]S6.所述后端服务器将数据进行编码并发送至所述前端页面的封装组件；所述封装组件还用于，对接收的所述后端服务器数据进行对应的解码。
[0018]优选的，所述连接组件、封装组件和数据交互组件是基于flash的组件。
[0019]优选的，所述方法还包括步骤:
[0020]S7.所述后端服务器向用户的前端页面发送XML Socket组件。
[0021]相对与现有技术，本发明可以通过后端服务器向浏览器的前端页面发送连接组件、封装组件和数据交互组件来实现后端服务器通过长连接向前端页面推送数据，且本发明使用自主设计的通讯协议，从而减少了数据传输时的无用数据，提高了传输效率。
【专利附图】
【附图说明】
[0022]图1是本发明提供的一种前端页面与后端服务器通信方法的处理流程图；
[0023]图2是本发明提供的一种封装格式示意图；
[0024]图3是本发明实施例中一种前端页面与后端服务器通信方法的处理示意图；
[0025]图4是本发明实施例中另一种前端页面与后端服务器通信方法的处理示意图。
【具体实施方式】
[0026]目前HTML5Web Sockets支持页面使用Web Socket协议与远程主机进行全双工的通信。它引入了 Web Socket套接口并且定义了一个全双工的通信通道，通过一个单一的套接字在Web上进行操作。HTML5Web Sockets以最小的开销高效地提供了 Web连接。相较于经常需要使用推送实时数据到客户端甚至通过维护两个HTTP连接来模拟全双工连接的旧的轮询或长轮询方式来说，这就极大的减少了不必要的网络流量与延迟。在C/S (客户端/服务器)系统里，可以通过Scoket组件提供的通道可以很容易的在数据发生变化时由服务器端主动的将变化后新数据送到客户端，例如用户通过QQ客户端聊天时，不需要刷新就可以收到对方回复的信息。但是若想在B/S (浏览器/服务器)系统里实现向浏览器推送数据是比较困难的事。
[0027]现有技术中，提供了一种解决办法，就是利用Flash XML Socket实现后端数据推送服务，其具体实现的方法是:在HTML页面中陷入一个使用了 XMLSocket类的Flash程序JavaScript通过调用此Flash程序提供的套接口接口与服务端的套接口进行通信；JavaScript在收到服务器端以XML格式传送的信息控制HTML的Dom对象改变页面的内容显示。由于XML Socket实现了客户端套接字，这使得运行Flash Player的计算机可以与由IP地址或域名标识的服务器计算机进行通信。相比于传统的基于HTTP的聊天解决方案频繁轮询服务器，并使用HTTP请求来下载新的消息，XML Socket聊天解决方案保持与服务器的开放连接，这一连接允许服务器即时发送传入的消息，而无需客户端发出请求。
[0028]但是XML Socket套接口与后端服务器所传的数据均为xml格式的文本数据，其遵循的为最基础的通讯协议，通常XML Socket是根据报文中xml标签的完整性来判断数据长度。由于这样传输的数据包含大量的xml标签，且这些标签对于页面所关注的数据是没有意义的，因此会造成传输的数据量的增加，及信道的浪费。
[0029]为了解决上述问题，本发明提供一种前端页面与后端服务器通信方法，所述方法应用于后端服务器，请参见图1，所述方法包括如下步骤:
[0030]101、当用户打开前端页面时，所述后端服务器向该用户的所述前端页面发送连接组件、封装组件和数据交互组件；所述连接组件用于使前端页面与后端服务器建立TCP长连接；需要说明的是，当网络通信时采用TCP/IP协议时，在真正的读写操作之前，用户与服务器之间必须建立一个连接，当读写操作完成后，双方不再需要这个连接时它们可以释放这个连接，而下一次读写操作还要重新建立连接。传统浏览器正是基于上述短连接的HTTP的聊天，通常采用繁轮询服务器，并使用HTTP请求来下载新的消息，也就是说，对端用户回复的信息只能通过本端用户手动刷新页面才能获得。而本发明通常采用TCP长连接，与上述短连接不同的是用户与后端服务器完成一次读写之后，它们之间的连接并不会主动关闭，后续的读写操作会继续使用这个连接。因此TCP长连接是与所述后端服务器的开放连接，这一连接允许后端服务器即时发送传入的信息，而无需用户手动刷新，从而减少用户的操作。
[0031]102、当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，该标记为报文封装中预设的标记字段，该字段中不同的数值对应不同的指令类型，若所述标记值为第一标记值时，则将所述报文解封装并提取所述报文中的数据转发至与所述前端页面在同一聊天区域内其他用户的前端页面根据其应用类型进行相应处理。如聊天类的数据就会被转发至其他用户的前端页面，并由该前端页面上的数据交互组件接收所述数据并将所述数据显示在其对应的前端页面上；如果是消费类的数据就会将处理后的返回结果数据发送至该用户的前端页面上，还有其他类型的应用数据此处不一一列举。在后端服务器向前端页面发送数据过程中，所述封装组件对后端服务器发送的数据进行透明传输。
[0032]相对与现有技术，本发明可以通过后端服务器向浏览器的前端页面发送连接组件、封装组件和数据交互组件来实现后端服务器通过长连接向前端页面推送数据，且本发明使用自主设计的通讯协议，从而减少了数据传输时的无用数据，提高了传输效率。
[0033]在本发明中，为了适应本发明的传输方式，引入了 一种新的封装格式，请参见图2。该封装格式具体包括:数据长度、指令类型、指令参数以及其他数据。其中，所述数据长度与传统协议的定义相同；所述指令类型和指令参数是对报文内容的描述，根据不同的指令类型，指令参数也会不同，所述登录指令对应的参数就是与登录相关的用户名和密码等登录信息，对于数据发送指令，其对应的就是该数据是否被加密，若加密还要有密钥，或是该数据是否被编码，若是还要指出编码格式等信息。
[0034]在优选的实施例中，所述指令类型还分为很多种。当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，若所述标记值为第二标记值时，其中第二标记值对应的为登录指令，则根据所述报文的指令参数(也就是登录信息)进行登录信息验证，将验证结果返回至所述前端页面的数据交互组件，并由所述数据交互组件将所述验证结果显示在所述前端页面上。
[0035]本发明可以通过进行登录信息验证来提高服务器的安全性，并且便于为特定的用户群提供专属服务，从而改善用户体验。
[0036]除此之外，TCP长连接是具有保活功能的，其保活功能主要为服务器服务。当用户已经消失时，服务器由于不能感知，因此会保留一个半开放的连接并等待来自用户的数据，从而导致了服务器资源的浪费，而保活功能就是为了帮助服务器端检测到这种半开放的连接。
[0037]在优选的实施例中，当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，若所述标记值为第三标记值时，则不予以回复；所述第三标记值对应的指令类型为心跳信号指令。其中该心跳信号每个固定时间会发送，一旦所述后端服务器在预设时间内未收到所述前端页面上的所述封装组件向所述后端服务器发送的携带有第三标记值的报文时，则所述后端服务器会认为用户主机异常，从而通过所述连接组件断开与所述前端页面的长连接关系。从上面可以看出，TCP保活功能可以帮助后端服务器探测长连接的存活状况，避免失活用户长期占用服务资源。
[0038]上述的处理方法是针对连接异常情况，而用户主动要与后端服务器断开连接的过程如下。
[0039]当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，若所述标记值为第四标记值时，则通过所述连接组件断开与所述前端页面的长连接关系。其中，所述第四标记值对应的指令类型就是断开连接指令。用户想主动断开连接使就可以通过所述前端页面发送断开连接请求，在经过封装组件的封装后，发送至后端服务器；后端服务器判断封装组件发送的指令类型为断开连接指令后，则控制所述连接组件断开与前端页面的长连接关系，从而释放资源。
[0040]由于现有技术中，通过XML Socket技术向前端页面发送数据时，通常不会将数据进行加密操作。但是用户在浏览器传输聊天数据或是个人信息时都希望将个人隐私进行保护，因此，本发明提供的方法还以进行加密保护。
[0041]在优选的实施例中，当用户打开前端页面时，后端服务器向所述前端页面发送连接组件、封装组件和数据交互组件，当封装组件下发到前端页面后，会初始化程序，初始化完成后，所述封装组件自动与后端服务器进行非对称加密协商，并在协商完成后再为数据交互组件提供服务，协商过程请参见图3。其中，前端页面的封装组件与后端服务器相互发送公钥，然后根据收到的公钥计算出用于对数据加密以及解密的密钥。当所述后端服务器和封装组件获得该密钥后，所述后端服务器将所述数据根据所述密钥进行加密并发送至封装组件，所述封装组件对接收的数据进行解密，并发送至聊天组件数据交互组件，通过聊天窗口将所述推送数据显示在前端页面上。上述非对称加密算法包括RSA、Elgamal、背包算法、Rabin、D-H以及ECC等多种算法，在优选的实施例中，本发明通常采用背包算法进行加密。由于背包算法技术比较普遍，此处不做详细说明。
[0042]由此可见，打开前端页面后，用户发送的登录信息和聊天内容等私密信息都会经过加密，使传输过程中的安全性相比现有技术有了显著的提升。
[0043]本发明除了能够加密的优势外，还可以对数据进行编解码。所述数据编解码的步骤包括:后端服务器将数据进行编码并发送至封装组件；所述封装组件对接收的数据进行对应的解码，并发送至数据交互组件；所述数据交互组件通过聊天窗口将所述推送数据显示在前端页面上。这样一来，经过编码的数据在进行传输时可以减小信道占用，提高传输效率。
[0044]在优选的实施例中，由于Flash是一种广泛使用的、专有的多媒体程序播放器。通常Flash同时有三种含义:创作环境，播放器和程序文件。Flash支持内嵌的脚本语言Action Script (一种基于ECMA Script的脚本语言,可用于编写Adobe Flash动画和应用程序)，由于Action Script和Java Script都是基于ECMA Script语法的，理论上它们互相可以很流畅地从一种语言翻译到另一种。因此，所述后端服务器所下发的连接组件、封装组件和数据交互组件都是基于flash程序开发的组件。而XML Socket组件也是一款基于flash的组件，其功能与本发明中连接组件的工作相似，但效率相对低下，为了兼容既有的一些老应用，所述后端服务器在用户打开前端页面时，还将所述XML Socket组件发送给该用户的前端页面。相对于XML Socket组件，本发明通过自主设计的通讯协议可以减少报文的数据，实现数据的高效传输，并通过加密编码的方式，加强了用户数据的私密性。
[0045]下面请结合说明书附图，对本发明的实施方案进行具体说明。
[0046]前端页面与后端服务器的交互数据有很多种，本实施例中以聊天为例对本发明进行详细介绍。请参见图4，假设用户甲和用户乙使用的IE浏览器分别为前端页面A和前端页面B，并已经成功通过后端服务器进行了登录验证。假设用户甲和用户乙之间通过IE浏览器实现聊天的步骤如下:
[0047]201、用户甲在其前端页面A上数据交互组件A提供的与用户乙的聊天窗口输入“你好”并点击发送，该数据交互组件A将用户甲发送的数据发送到封装组件A中，由封装组件A按照上述的封装格式封装并加密编码后，发给后端服务器；
[0048]202、后端服务器收到由封装组件A发送的报文，先解码、解密，再判断指令类型，当发现是个数据发送指令时，将其数据内容提取出来，并根据报文中的目的用户地址，将该数据发送到前端页面B上的数据交互组件B上，所述数据交互组件B进一步将数据内容显示在所述前端页面B上，于是，用户乙的聊天窗口就出现了用户甲发的“你好”的文字了 ；
[0049]203、用户乙收到信息后，接着在窗口中回复“有事吗”，同理，该数据会通过封装组件B进行封装、加密编码后发送到后端服务器；
[0050]204、后端服务器收到封装组件B的报文也会进行相应的解码解密后，判断指令类型，由于是数据发送指令，则提取数据内容，根据报文中的目的用户地址进行转发；[0051]205、用户甲的封装组件A对后端服务器的数据进行透明传输给数据交互组件A，并由数据交互组件A将数据显示出来，因此用户甲可以从聊天窗口看到用户乙发送的“有事吗”信息。至此，一个完整的数据推送的过程就完成了。按照上述方式，可以实现用户通过浏览器进行即时通信，本发明的实施方式中不只适用于是一对一的通信，一对多也同样可以实现即时数据推送。
[0052]相对与现有技术，本发明可以通过后端服务器向浏览器的前端页面发送连接组件、封装组件和数据交互组件来实现后端服务器通过长连接向不支持Web Socket的浏览器前端页面推送数据；且本发明使用自主设计的通讯协议，减少了数据传输时的无用数据(传输开销)，提高了传输效率；本发明的加密方式还可以有效的保护用户的隐私，从而使用户得到更佳的服务体验。
[0053]以上所述仅为本发明的较佳实施例而已，并不用以限制本发明，凡在本发明的精神和原则之内，所做的任何修改、等同替换、改进等，均应包含在本发明保护的范围之内。
【权利要求】
1.一种前端页面与后端服务器通信方法，其特征在于，所述方法包括如下步骤: S1.当用户打开前端页面时，所述后端服务器向该用户的所述前端页面发送连接组件、封装组件和数据交互组件；所述连接组件用于使前端页面与后端服务器建立TCP长连接； S2.当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，若所述标记值为第一标记值时，则将所述报文解封装并提取所述报文中的数据根据其应用类型进行相应处理。
2.如权利要求1所述的方法，其特征在于，所述预定封装格式包括:数据长度、指令类型、指令参数以及其他数据，所述预设标记为所述指令类型。
3.如权利要求1所述的方法，其特征在于，所述预设标记的标记值还包括第二标记值，所述方法还包括步骤: S3.当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，若所述标记值为第二标记值时，则根据所述报文的指令参数进行登录信息验证，将验证结果返回至所述用户前端页面的数据交互组件。
4.如权利要求1所述的方法，其特征在于，所述预设标记的标记值还包括第三标记值，所述方法还包括步骤: S4.当所述后端服务器在预设时间内未收到所述前端页面发送的携带有第三标记值的报文时，则通过所述连接组件断开与所述前端页面的长连接。
5.如权利要求1所述的方法，其特征在于，所述预设标记的标记值还包括第四标记值，所述方法还包括步骤: S5.当用户通过前端页面上的所述封装组件向所述后端服务器发送按照预定封装格式封装的报文时，所述后端服务器判断封装中预设标记的标记值，若所述标记值为第四标记值时，则通过所述连接组件断开与所述前端页面的长连接关系。
6.如权利要求1所述的方法，其特征在于，所述封装组件还用于，在到达前端页面后进行初始化，并与所述后端服务器进行非对称加密协商，以协商出用于对数据加密以及解密的密钥，并在协商完成后再为数据交互组件提供服务。
7.如权利要求1所述的方法，其特征在于，所述方法还包括步骤: S6.所述后端服务器将数据进行编码并发送至所述前端页面的封装组件；所述封装组件还用于，对接收的所述后端服务器数据进行对应的解码。
8.如权利要求1所述的方法，其特征在于，所述连接组件、封装组件和数据交互组件是基于flash的组件。
9.如权利要求1所述的方法，其特征在于，所述方法还包括步骤: S7.所述后端服务器向用户的前端页面发送XMLSocket组件。
【文档编号】H04L29/06GK103905435SQ201410095255
【公开日】2014年7月2日 申请日期:2014年3月14日 优先权日:2014年3月14日
【发明者】刘涵, 牛建新 申请人:北京六间房科技有限公司