CN116166907B - 一种使用WebAssembly和服务页面编译技术开发Web应用的方法及装置 - Google Patents

Abstract

本发明涉及一种使用WebAssembly和服务页面编译技术开发Web应用的方法及装置。包括：构建Web应用的HTML部分和JavaScript部分；使用CSPC技术，在第一位置嵌入动态的C/C++逻辑业务代码；设定特征功能，针对所述特征功能，编写C/C++函数源码；基于WebAssembly技术，使用Emscripten进行编译，获取Wasm格式文件；整合上下文资源；将上述步骤中生成的所述C/C++源代码编译，生成可执行文件，并打包成Web应用，在生产环境服务器上部署及运行所述Web应用。通过使用C++开发Web前端和后端应用，提高Web应用的运行性能、部署体积、统一技术栈。

Description

一种使用WebAssembly和服务页面编译技术开发Web应用的方 法及装置

技术领域

本发明涉及Web客户端和服务端技术领域，更具体涉及一种使用WebAssembly和服务页面编译技术开发Web应用的方法及装置。

背景技术

随着移动互联网的发展，运行在浏览器中的各类Web应用，它们的体积与复杂性随着时间的推移在不断变大。但与日益庞大和复杂化的Web应用相比，浏览器对自身性能的优化是是举步维艰的。随着Web应用的复杂和日益庞大，浏览器可能无法支撑起这些庞大Web应用的运行。还有因为JavaScript是一个”动态类型”的编程语言。JavaScript这种动态类型语言所独有的特性，在某种程度上相较于静态类型语言而言，会带来额外的运行时性能开销。

为解决该问题，现有技术中提出了基于JavaScript定制页面的方法及系统，能够节省用户在访问页面时的流量，还能够提升浏览器在定制页面时的响应速度。如中国发明专利申请“CN105094786A”记载了一种基于JavaScript定制页面的方法及系统，包括根据浏览器访问的网址获取待处理网页的源页面代码；在待处理网页的源页面代码的head标签后立即插入预设的JavaScript定制页面文件；执行JavaScript定制页面文件，将JavaScript定制页面文件后的源页面代码封装成文本字符串；根据封装后的文本字符串获取待处理页面的业务数据；根据JavaScript定制页面文件中的定制规则，创建基于业务数据的定制页面的DOM对象；加载所述DOM对象，得到定制页面。然而，该方法只能提升浏览器在定制页面时的响应速度，应用的整体效率并没有得到大的提升。如中国发明专利申请“CN112182513A”记载了一种JavaScript代码处理方法及装置，包括：获得用于提供目标业务功能的JavaScript源代码；按照预设操作码生成规则，将至少一部分所述JavaScript源代码编译成操作码形式的字节码；输出包含所述字节码的目标代码。然而，该方法只能保证JavaScript代码不被轻易获取、破解，应用的运行效率和用户体验没有得到有效提高。本发明使用WebAssembly技术来构建web应用，构建的Web应用以二进制形式运行，没有虚拟机解析步骤，同时结合页面编译技术，程序性能得到有效保障，可以大大提高运行效率和用户体验。

发明内容

为了更好的实现上述效果，本发明提供一种使用WebAssembly和服务页面编译技术开发Web应用的方法，主要包括以下步骤：

步骤S1：构建Web应用的HTML部分；

步骤S2：构建所述Web应用的JavaScript部分；

步骤S3：使用CSPC技术，在第一位置嵌入动态的C/C++逻辑业务代码；

步骤S4：设定特征功能，针对所述特征功能，编写C/C++函数源码；

步骤S5：基于WebAssembly技术，使用Emscripten进行编译，获取Wasm格式文件；

步骤S6：整合上下文资源，确定复用模块，所述复用模块包括子程序，将所述复用模块抽象为库；

步骤S7：使用转换模块，将内嵌C/C++代码的HTML模板文件预编译为C/C++源代码,其中，所述转换模块包括命令行工具；

步骤S8：将所述步骤S7中生成的所述C/C++源代码编译，生成可执行文件，并打包成所述Web应用，在生产环境服务器上部署及运行所述Web应用，完成所述Web应用运行检测。

作为本发明的一种优选技术方案，所述步骤S3中，采集完成的HTML代码页面，并将其上传至Git中，从所述Git中下载所述HTML部分到本地，并在所述HTML代码中嵌入动态C/C++逻辑业务代码。

作为本发明的一种优选技术方案，所述步骤S4中，基于POCO C++库，针对所述特征功能，编写C/C++函数源码。

作为本发明的一种优选技术方案，所述步骤S5中，针对编写的所述C/C++源代码，基于WebAssembly技术，使用Emscripten进行编译，获取Wasm格式文件。

作为本发明的一种优选技术方案，步骤S6整合所述上下文资源，包括如下步骤：

步骤S61：构建所述Web应用时，将所述复用模块以库的形式抽象出来；

步骤S62：再将所述复用模块拆分为多个所述子程序，把所述Web应用中所有重复操作封装成子程序A1、子程序A2、……子程序An，所述子程序被具体实例调用。

作为本发明的一种优选技术方案，步骤S7包括如下步骤：

步骤S71：将所述内嵌C/C++代码的HTML模板文件预编译为C++源代码；

步骤S72：增加数据库访问功能，在服务器上创建所述数据库，测试是否成功连接所述数据库，搭建所述数据库访问的程序框架，创建连接串和连接对象，使用所述连接对象，实现对所述数据库的操作；

步骤S73：基于TCP/IP协议实现所述网络通讯功能。

作为本发明的一种优选技术方案，步骤S8完成所述Web应用运行检测，包括如下步骤：

步骤S81：在所述生产环境服务器上部署所述Web应用；

步骤S82：Web应用测试程序对所述Web应用进行全部功能测试，所述Web应用测试程序包括服务器端功能模块和客户端功能模块；

步骤S83：服务器代码分析器对所述Web应用进行静态分析，获取URL模式及所需参数，并将所述URL模式作为条目存储在URL模式队列中；

步骤S84：获取客户端状态；

步骤S85：客户端代码分析器对所述客户端状态执行静态代码分析，生成匹配所述URL模式队列中的至少一个URL模式的事件序列；

步骤S86：针对每个所述事件序列，在所述客户端状态上执行，并生成URL请求；

步骤S87：测试用例生成器将所述客户端状态、所述事件序列和所述URL请求作为测试用例存储在测试队列中；

步骤S88：对存储在所述测试队列中测试条目的URL发出请求，尝试获取新的客户端状态，重复步骤S85，直到所述Web应用的全部功能检测完成。

作为本发明的一种优选技术方案，所述步骤S85中，所述事件序列的生成，包括：客户端向服务器端发送指定初始URL，从服务器端响应结果中获取客户端代码，对所述客户端代码进行静态分析，获取客户端代码中所有可操作事件，生成事件序列。

本发明还提供一种使用WebAssembly和服务页面编译技术开发Web应用的装置如上所述的一种使用WebAssembly和服务页面编译技术开发Web应用的方法，包括如下步骤：

第一构建单元：用于构建Web应用的HTML部分；

第二构建单元：用于构建Web应用的JavaScript部分；

第三构建单元：用于嵌入动态的C/C++逻辑业务代码；

第四构建单元：编写C/C++函数源码，用于构建特定的高性能功能；

编译单元：基于WebAssembly技术，使用Emscripten编译器，用于获取Wasm格式文件；

整合单元：用于确定复用模块，所述复用模块包括子程序，将所述复用模块抽象为库；

转换模块：用于将内嵌C/C++代码的HTML模板文件预编译为C/C++源代码，其中，所述转换模块包括命令行工具；

生产环境服务器：用于将转换模块生成的所述C/C++源代码编译，生成可执行文件，并打包成Web应用，在生产环境服务器上部署及运行Web应用，完成Web应用运行检测。

与现有技术相比，本发明的有益效果至少如下所述：

1、本发明的技术方案通过WebAssembly技术和CSPC技术结合使用，让Web应用前端和后端的开发统一技术栈；开发语言方面：使用C++语言开发、开发效率有保障、代码复用率高；应用性能方面： Web应用以二进制形式运行，没有虚拟机解析步骤，程序性能有保障；安全性上具有优势。

2、本发明的技术方案通过使用C++开发Web前端和后端应用，通过此种开发方式，提高Web应用的运行性能、部署体积、以及统一技术栈。

附图说明

图1为本发明的一种使用WebAssembly和服务页面编译技术开发Web应用方法的步骤流程图；

图2为本发明的一种使用WebAssembly和服务页面编译技术开发Web应用装置的组成结构图。

具体实施方式

为了使本发明的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本发明进行进一步详细说明。应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。

本发明提供一种使用WebAssembly和服务页面编译技术开发Web应用的方法，如图1所示，主要包括以下步骤过程：

步骤S1：构建Web应用的HTML部分；

步骤S2：构建Web应用的JavaScript部分；

具体的，HTML文件是以.html或.htm 扩展名保存的文本文件，准备一个简单文本编辑器或常用开发工具和一个Web浏览器，创建一个新文件，按实现要求编写HTML代码和JavaScript代码，也可以根据需要，采用内嵌方式的Javascript或外联方式的js文件，编写完成后保存文件。

步骤S3：使用CSPC技术，在第一位置嵌入动态的C/C++逻辑业务代码；

步骤S4：设定特征功能，针对特征功能，编写C/C++函数源码；

步骤S5：基于WebAssembly技术，使用Emscripten进行编译，获取Wasm格式文件；

步骤S6：整合上下文资源，确定复用模块，复用模块包括子程序，将复用模块抽象为库；

步骤S7：使用转换模块，将内嵌C/C++代码的HTML模板文件预编译为C/C++源代码,其中，转换模块包括命令行工具；

步骤S8：将生成的C/C++源代码编译，生成可执行文件，并打包成Web应用，在生产环境服务器上部署及运行Web应用，完成Web应用运行检测。

具体的，CSPC是C/C++后端页面编译技术，是一种使用C/C++语言开发Web应用的方法，即允许使用C/C++代码作为嵌入Web 页面的编程语言，然后通过转换模块将内嵌C++代码的HTML模板文件预编译为C++源代码，进而使用专用的编译器编译成二进制可执行程序。

使用CSPC技术基本的开发流程如下：

1.把HTML代码页面提交给服务器端业务开发人员或C/C++开发工程师，在HTML代码中嵌入动态的C/C++逻辑业务代码，它支持静态语言开发Web应用。

2.使用转换模块（命令行工具），将内嵌C/C++代码的HTML模板文件预编译为C/C++源代码,转换的同时会增加数据库访问和网络通讯的功能。

3. 将生成的C/C++源代码编译，生成可执行文件，并打包成Web应用，在生产环境服务器上部署及运行Web应用，检测Web应用的运行状态。

进一步的，在上述步骤S3中，采集完成的HTML代码页面，并将其上传至Git中，从Git上下载HTML部分到本地，并在HTML代码中嵌入动态C/C++逻辑业务代码。

具体的，Git是一个开源的分布式版本控制系统，可以有效、高速地处理项目版本管理，方便项目团队成员协同工作，下载HTML页面，在HTML页面代码中编写C/C++逻辑业务代码，编写完成后，及时提交到Git上。

进一步的，在上述步骤S4中，基于POCO C++库，针对特征功能，编写C/C++函数源码。

具体的，编写C/C++函数源码就是用C/C++语言编写核心业务实现代码，在编写时，对于主要功能函数应有注释说明，内容包括：功能、入口/出口参数，必要时还可以有备注或补充说明，对于函数中的主要功能代码，也应有注释说明。

进一步的，在上述步骤S5中，针对编写的C/C++源代码，基于WebAssembly技术，使用Emscripten进行编译，获取Wasm格式文件。

具体的，WebAssembly(Wasm)是一个可移植、体积小、加载快并且兼容 Web 的全新格式, 是基于栈式虚拟机的虚拟二进制指令集(V-ISA)，它被设计为高级编程语言的可移植编译目标。不仅能够直接使用HTML、JavaScript来编写各类跨端应用程序，Wasm的出现更能够直接在Web平台上，使用那些业界已存在许久的众多优秀的C/C++代码库。除此之外，Wasm还能让Web应用具有更高的性能，甚至让Web应用能够与原生应用展开竞争。Wasm将成为除现有的HTML、CSS以及JavaScript之外的第四种，W3C 官方推荐在Web平台上使用的“语言”。

WebAssembly被设计成为一种编程语言的可移植编译目标，并且可以通过将其部署在Web平台上，以便为客户端及服务端应用程序提供服务。Wasm不是一门编程语言，因为它完全不同于我们常见的高级程序设计语言，通常仅将其用作编译器的一种新的编译目标。但可以将Wasm看做是一门低级的编程语言，或认为Wasm就是一种可以在虚拟机上执行的字节码。

相较与JavaScript而言，浏览器引擎在执行Wasm字节码时不需要经过诸如“生成AST”、“生成Bytecode字节码”、“生成IR”以及“收集运行时信息”等多个步骤。JavaScript引擎的优化编译器后端可以直接将Wasm字节码转换为经过优化的机器码，进而以接近Native代码的效率来运行。不仅如此，Wasm字节码在实际的执行过程中，也不会存在类似JavaScript代码的“去优化”过程，因此性能表现会更加稳定。

进一步的，在上述步骤S6中，整合上下文资源，包括如下步骤：

步骤S61：构建Web应用时，把复用模块以库的形式抽象出来；

步骤S62：再将复用模块拆分为多个子程序，把Web应用中所有重复操作封装成子程序A1、子程序A2、……子程序An，子程序被具体实例调用。

具体的，在构建Web应用的时候，可以将能够复用的模块以库的形式抽象出来，例如，软交换系统需要使用sip协议栈，那么就可以把sip协议栈开发成为一个库，这样就可以在其他程序（比如TG）中复用sip库，如果软交换程序要重新开发，也可以直接复用以前的sip库，其他相同的比如tcp分包流控模块，定时器模块等；再将模块拆分为多个子程序，把Web应用中所有重复操作封装成一个个子程序，例如子程序A1是 TCP建立连接、子程序A2是TCP关闭连接、……子程序An是收发包等，具体实例可以直接调用子程序，达到子程序的复用，模块具有高内聚、低耦合的特性，有效提高开发效率，降低修改成本。

进一步的，上述步骤S7还包括如下步骤：

步骤S71：将内嵌C/C++代码的HTML模板文件预编译为C++源代码；

步骤S72：增加数据库访问功能，在服务器上创建数据库，测试是否成功连接数据库，搭建数据库访问的程序框架，创建连接串和连接对象，使用连接对象，实现对数据库的操作；

步骤S73：基于TCP/IP协议实现网络通讯功能。

具体的，CSPC使用C++语言作为脚本语言，经过编译后再执行代码，例如，编译后的文件$(CSPC) ./html/main-all.cspc，需要做的是维护CSPC的源码，编译过程由CSPC内置编译器来完成，称为现场编译，保存编译后的二进制代码，以提高再次执行的速度，由于使用标准的动态连接思想，因此CSPC可以被用户非常方便的扩充，对于复杂的或者保密要求高的应用，完全可以通过CSPC扩展来完全隐藏实现的细节。

TCP/IP协议是面向连接的，安全的；例如，服务端实现：接收客户端发过来的ABC，则给客户端发送字符123，接收XYZ，则发送字符789，客户端实现：给服务端发送ABC，则会接受到字符123，发送XYZ，则收到字符789。

现有技术对Web应用的静态分析中，难以准确地预测服务器代码生成哪种客户端代码。由于客户端具有动态代码，因此很难通过静态分析找到所有代码路径。与Web应用的每种可能交互的事件树也都在动态增长并且呈指数增长。因此，即使尝试完全搜索Web应用，动态分析也需要不切实际的时间，并且可能导致无限循环。此外，通过在客户端上模拟Javascript代码的执行结果，将搜索限制在预定范围内，但是代码覆盖率可能不完整，最终失败。因此，传统的自动化Web应用测试技术对于动态Web应用不能更好地工作。本发明为解决上述问题而发展新技术，在上述步骤S8中，为了更好地实现对Web应用的运行检测，包括如下步骤：

步骤S81：在生产环境服务器上部署Web应用；

步骤S82：Web应用测试程序对Web应用进行全部功能测试，Web应用测试程序包括服务器端功能模块和客户端功能模块；

步骤S83：服务器代码分析器对Web应用进行静态分析，获取URL模式及所需参数，并将URL模式作为条目存储在URL模式队列中；

步骤S84：获取客户端状态；

步骤S85：客户端代码分析器对客户端状态执行静态代码分析，生成匹配URL模式队列中的至少一个URL模式的事件序列；

步骤S86：针对每个事件序列，在客户端状态上执行，并生成URL请求；

步骤S87：测试用例生成器将客户端状态、事件序列和URL请求作为测试用例存储在测试队列中；

步骤S88：对存储在测试队列中测试条目的URL发出请求，尝试获取新的客户端状态，重复步骤S85，直到Web应用的全部功能检测完成。

具体的，将开发完成的Web应用，经本地测试无误后在生产环境服务器上部署，由于测试环境服务器（一般指本地环境）和生产环境服务器的环境和设置不同，例如操作系统不同、依赖的中间件版本不同，部署时文件遗漏等，可能存在程序文件版本不一致和文件的丢失，从而导致Web应用执行错误。在生产环境服务器上安装Web应用测试程序，对Web应用包含的全部功能进行测试操作。

Web应用测试程序包括服务器端功能模块和客户端功能模块；服务器端功能模块包括：生产环境服务器、Web应用、服务器代码分析器；客户端功能模块包括：客户端、DOM树存储单元、测试用例队列、测试用例生成器、客户端代码分析器、URL模式队列。

服务器代码分析器是服务器端功能模块中的一个功能，用于对Web应用进行静态分析，静态分析是一种分析应用程序代码，建立描述应用程序的数学模型并分析此模型以识别安全漏洞的技术，静态分析是对应用程序代码的白盒测试，通过对服务器侧代码静态地分析，才能从代码的字符串中提取URL和输入参数，再将提取的URL和输入参数作为条目存储在URL模式队列中，URL模式队列是等待队列，临时保存从服务器代码分析器传递过来的URL模式，以便生成用于稍后描述的测试用例的条目。URL模式队列保存等待处理的URL模式条目，并且附加有已处理的条目从URL模式队列中删除的检查。

客户端代码分析器是客户端功能模块中的一个功能，用于对从服务器侧获取的客户端代码进行静态分析。当从服务器侧接收到客户端代码时，DOM树存储单元（文档对象建模）将客户端代码中描述的元素保存为树结构，并允许对构成网页的每个元素进行操作。

客户端代码分析器静态分析获取的客户端代码，以获得与URL模式队列中保存的至少一个条目匹配的事件序列。事件序列是指在上述客户端状态上执行的一系列事件。

通过客户端代码分析器分析，找到与URL模式匹配的请求URL（包括输入参数值）的事件序列。例如，在上述带有参数限制的URL模式示例中（“ http：//localhost/web/page_index.jsp？a = z & b = y”，z < y） “两个参数a和b，输入一个满足参数约束条件的特定值，然后单击Submit按钮,将发现在客户端执行的一系列事件。

测试用例生成器从DOM树存储单元中获取客户端状态，对客户端状态执行事件序列，并生成请求URL作为执行结果，生成的请求URL包含与传递的事件序列相对应的URL模式匹配的特定值。例如，在上述事件序列示例中，“在两个参数a和b的每个输入框中输入满足参数约束条件的特定值，然后单击Submit按钮”。例如，请求URL http： //localhost/web/page_index.jsp？a=5 & b=10，此请求URL符合相应的URL模式（“ http://localhost/web/page_index.jsp a = z & b = y”，z < y）。

测试用例生成器生成请求URL时，测试条目是一组捕获的客户端状态，在客户端状态上执行的事件序列被保存在测试队列中，测试用例生成器检查相应的URL模式的条目是否已从URL模式队列中删除或处理，避免无限循环。向测试条目的URL发出HTTP请求，例如从服务器侧接收新的网页，并获取新的客户端状态，当获取到新的客户端状态时，客户端代码分析器为此新客户端状态执行静态代码分析以发现事件序列，测试用例生成器发现新的测试用例，重复这种处理，直到覆盖URL模式队列中的所有条目，或者直到无法获取新的客户端状态为止。

进一步的，在上述步骤S85中，关于如何生成事件序列，包括客户端向服务器端发送指定初始URL，从服务器端响应结果中获取客户端代码，对客户端代码进行静态分析，获取客户端代码中所有可操作事件，生成事件序列。

具体的，在初次对Web应用进行访问时，需要指定初始URL，将指定的初始URL请求发送至服务器端，从服务器端响应结果中获取客户端代码，对客户端代码进行静态分析，获取客户端代码中所有可操作的事件，例如“数据校验”、“提交”、“搜索”等事件，这些事件组成事件序列。

根据本发明的实施例，能够准确地验证代码、高效地生成web应用的测试用例。通过避免无限循环来有效地搜索目标功能，可以自动生成完全覆盖要测试URL模式的测试用例。这样可以显著减少人工操作，从而节省大量成本。提高代码覆盖率，全面发现Web应用中的缺陷，同时也会降低应用程序的开发成本。

进一步的，一种使用WebAssembly和服务页面编译技术开发Web应用的装置110用于实现上述任一项中一种使用WebAssembly和服务页面编译技术开发Web应用的方法，如图2所示：

第一构建单元101：用于构建Web应用100的HTML部分；

第二构建单元102：用于构建Web应用100的JavaScript部分；

第三构建单元103：用于嵌入动态的C/C++逻辑业务代码；

第四构建单元104：编写C/C++函数源码，用于构建特定的高性能功能；

编译单元105：基于WebAssembly技术，使用Emscripten编译器，用于获取Wasm格式文件；

整合单元106：用于确定复用模块，所述复用模块包括子程序，将所述复用模块抽象为库；

转换模块107：用于将内嵌C/C++代码的HTML模板文件预编译为C/C++源代码，其中，所述转换模块包括命令行工具；

生产环境服务器200：用于将转换模块生成的C/C++源代码编译，生成可执行文件，并打包成Web应用100，在生产环境服务器200上部署及运行Web应用100，完成Web应用100的运行检测。

在一种使用WebAssembly和服务页面编译技术开发Web应用的装置110之外还包括：无线互联网201；电脑客户端301，电脑客户端302，电脑客户端303，手机客户端304，手机客户端305，手机客户端306；

无线互联网201，是提供信息的传输介质；

电脑客户端301，用于访问Web应用100；

电脑客户端302，用于访问Web应用100；

电脑客户端303，用于访问Web应用100；

手机客户端304，用于访问Web应用100；

手机客户端305，用于访问Web应用100；

手机客户端306，用于访问Web应用100。

综上所述，使用C++语言开发Web应用，开发效率有保障、代码复用率高，Web应用以二进制形式运行，没有虚拟机解析步骤，程序性能有保障，通过WebAssembly技术和CSPC技术结合使用，让Web应用前端和后端的开发统一技术栈，有效提高了开发效率和程序性能。

以上上述的实施例的各技术特征可以进行任意的组合，为使描述简洁，未对上述实施例中的各个技术特征所有可能的组合都进行描述，然而，只要这些技术特征的组合不存在矛盾，都应当认为是本说明书记载的范围。

以上上述的实施例仅表达了本发明的几种实施方式，其描述较为具体和详细，但并不能因此而理解为对本发明专利范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本发明构思的前提下，还可以做出若干变形和改进，这些都属于本发明的保护范围。因此，本发明专利的保护范围应以所附权利要求为准。

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

Claims (8)

1.一种使用WebAssembly和服务页面编译技术开发Web应用的方法，其特征在于，使用CSPC技术，所述CSPC是C/C++后端页面编译技术，是一种使用C/C++语言开发Web应用的方法，包括以下步骤：

步骤S1：构建Web应用的HTML部分；

步骤S2：构建所述Web应用的JavaScript部分；

步骤S3：把HTML代码页面提交给服务器端业务开发人员或C/C++开发工程师，在HTML代码中嵌入动态的C/C++逻辑业务代码，它支持静态语言开发Web应用；

步骤S4：设定特征功能，针对所述特征功能，编写C/C++函数源码；

步骤S5：基于WebAssembly技术，使用Emscripten进行编译，获取Wasm格式文件；

步骤S6：整合上下文资源，确定复用模块，所述复用模块包括子程序，将所述复用模块抽象为库；

步骤S7：使用转换模块，将内嵌C/C++代码的HTML模板文件预编译为C/C++源代码,其中，所述转换模块包括命令行工具，转换的同时会增加数据库访问和网络通讯的功能；

步骤S8：将所述步骤S7中生成的所述C/C++源代码编译，生成可执行文件，并打包成所述Web应用，在生产环境服务器上部署及运行所述Web应用，完成所述Web应用运行检测；

所述步骤S6整合所述上下文资源，包括如下步骤：

步骤S61：构建所述Web应用时，将所述复用模块以库的形式抽象出来；

步骤S62：再将所述复用模块拆分为多个所述子程序，把所述Web应用中所有重复操作封装成子程序A1、子程序A2、……子程序An，所述子程序被具体实例调用。

2.根据权利要求1所述一种使用WebAssembly和服务页面编译技术开发Web应用的方法，其特征在于，所述步骤S3中，采集完成的HTML代码页面，并将其上传至Git中，从所述Git中下载所述HTML部分到本地，并在所述HTML代码中嵌入动态C/C++逻辑业务代码。

3.根据权利要求1所述一种使用WebAssembly和服务页面编译技术开发Web应用的方法，其特征在于，所述步骤S4中，基于POCO C++库，针对所述特征功能，编写C/C++函数源码。

4.根据权利要求1所述一种使用WebAssembly和服务页面编译技术开发Web应用的方法，其特征在于，所述步骤S5中，针对编写的所述C/C++源代码，基于WebAssembly技术，使用Emscripten进行编译，获取Wasm格式文件。

5.根据权利要求1所述一种使用WebAssembly和服务页面编译技术开发Web应用的方法，其特征在于，所述步骤S7包括如下步骤：

步骤S71：将所述内嵌C/C++代码的HTML模板文件预编译为C++源代码；

步骤S72：增加数据库访问功能，在服务器上创建所述数据库，测试是否成功连接所述数据库，搭建所述数据库访问的程序框架，创建连接串和连接对象，使用所述连接对象，实现对所述数据库的操作；

步骤S73：基于TCP/IP协议实现网络通讯功能。

6.根据权利要求1所述一种使用WebAssembly和服务页面编译技术开发Web应用的方法，其特征在于，所述步骤S8完成所述Web应用运行检测，包括如下步骤：

步骤S81：在所述生产环境服务器上部署所述Web应用；

步骤S82：Web应用测试程序对所述Web应用进行全部功能测试，所述Web应用测试程序包括服务器端功能模块和客户端功能模块；

步骤S83：服务器代码分析器对所述Web应用进行静态分析，获取URL模式及所需参数，并将所述URL模式作为条目存储在URL模式队列中；

步骤S84：获取客户端状态；

步骤S85：客户端代码分析器对所述客户端状态执行静态代码分析，生成匹配所述URL模式队列中的至少一个URL模式的事件序列；

步骤S86：针对每个所述事件序列，在所述客户端状态上执行，并生成URL请求；

步骤S87：测试用例生成器将所述客户端状态、所述事件序列和所述URL请求作为测试用例存储在测试队列中；

步骤S88：对存储在所述测试队列中测试条目的URL发出请求，尝试获取新的客户端状态，重复步骤S85，直到所述Web应用的全部功能检测完成。

7.根据权利要求6所述一种使用WebAssembly和服务页面编译技术开发Web应用的方法，其特征在于，所述步骤S85中，所述事件序列的生成，包括：客户端向服务器端发送指定初始URL，从服务器端响应结果中获取客户端代码，对所述客户端代码进行静态分析，获取客户端代码中所有可操作事件，生成事件序列。

8.一种使用WebAssembly和服务页面编译技术开发Web应用的装置，所述装置用于实现所述权利要求1-7任一项中所述的使用WebAssembly和服务页面编译技术开发Web应用的方法，其特征在于，使用CSPC技术，所述CSPC是C/C++后端页面编译技术，是一种使用C/C++语言开发Web应用的方法，所述装置包括：

第一构建单元：用于构建Web应用的HTML部分；

第二构建单元：用于构建Web应用的JavaScript部分；

第三构建单元：用于把HTML代码页面提交给服务器端业务开发人员或C/C++开发工程师，在HTML代码中嵌入动态的C/C++逻辑业务代码，它支持静态语言开发Web应用；

第四构建单元：编写C/C++函数源码，用于构建特定的高性能功能；

编译单元：基于WebAssembly技术，使用Emscripten编译器，用于获取Wasm格式文件；

整合单元：用于整合上下文资源，确定复用模块，所述复用模块包括子程序，将所述复用模块抽象为库，所述整合上下文资源包括：构建所述Web应用时，将所述复用模块以库的形式抽象出来，再将所述复用模块拆分为多个所述子程序，把所述Web应用中所有重复操作封装成子程序A1、子程序A2、……子程序An，所述子程序被具体实例调用；

转换模块：用于将内嵌C/C++代码的HTML模板文件预编译为C/C++源代码，其中，所述转换模块包括命令行工具，转换的同时会增加数据库访问和网络通讯的功能；

生产环境服务器：用于将转换模块生成的所述C/C++源代码编译，生成可执行文件，并打包成Web应用，在生产环境服务器上部署及运行Web应用，完成Web应用运行检测。