一种前端应用预览的方法及终端技术

本发明专利技术公开一种前端应用预览的方法及终端，接收前端应用平台发送的预览请求，所述预览请求包括待预览的前端应用的应用标识和预览标识；根据所述预览标识，创建对应的编译环境，并将预存的基础工程代码同步至所述创建的编译环境中；根据所述应用标识获取与所述前端应用对应的配置数据，将所述配置数据转化为应用代码，并将所述应用代码同步至所述创建的编译环境中；发送包含所述预览标识的编译请求至编译器，使得所述编译器根据所述预览标识到对应的编译环境编译对应的工程代码，并将编译完成的可执行代码同步至web服务容器；通过所述web服务容器将预览结果返回给所述前端应用平台；集成了开发到预览的整个过程，提高了前端应用的预览效率。

A preview method and terminal of front-end application

【技术实现步骤摘要】
一种前端应用预览的方法及终端
本专利技术涉及前端应用开发领域，尤其涉及一种前端应用预览的方法及终端。
技术介绍
随着互联网产业的爆炸式增长，与之伴生的web前端技术也在不断进步和推陈出新。尤其是近几年随着移动终端的发展，越来越多的人开始投身或转行至新领域，这更为当今的IT产业注入了新的活力。在web底层技术HTML、JavaScript和CSS基础上发展了各类组件、框架。项目过程的工程化，解决方案的轻量化，库和框架的多元化，知识结构的体系化，这种趋势在今后会变得越来越明显，也昭示着前端技术的发展方向。项目开发过程中，分工也越来越细，简化能简化的过程，都是发展进步。开发过程中，当要将最新的前端应用部署到预览环境时，需要生成最新的代码，再编译代码，最后再部署到预览环境中，整个过程比较耗费时间。并且现有技术基本都是靠手动分别依次来完成最新代码的生成，待代码生成后再手动进行编译，最后再手动将编译好的代码部署到预览环境进行预览，整个过程效率较低。
技术实现思路
本专利技术所要解决的技术问题是：提供一种前端应用预览的方法及终端，提高前端应用的预览效率。为了解决上述技术问题，本专利技术采用的一种技术方案为：一种前端应用预览的方法，包括步骤：S1、接收前端应用平台发送的预览请求，所述预览请求包括待预览的前端应用的应用标识和预览标识；S2、根据所述预览标识，创建对应的编译环境，并将预存的基础工程代码同步至所述创建的编译环境中；S3、根据所述应用标识获取与所述前端应用对应的配置数据，将所述配置数据转化为应用代码，并将所述应用代码同步至所述创建的编译环境中；S4、发送包含所述预览标识的编译请求至编译器，使得所述编译器根据所述预览标识到对应的编译环境编译对应的工程代码，并将编译完成的可执行代码同步至web服务容器；S5、通过所述web服务容器将预览结果返回给所述前端应用平台。为了解决上述技术问题，本专利技术采用的另一种技术方案为：一种前端应用预览的终端，包括存储器、处理器及存储在存储器上并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现以下步骤：S1、接收前端应用平台发送的预览请求，所述预览请求包括待预览的前端应用的应用标识和预览标识；S2、根据所述预览标识，创建对应的编译环境，并将预存的基础工程代码同步至所述创建的编译环境中；S3、根据所述应用标识获取与所述前端应用对应的配置数据，将所述配置数据转化为应用代码，并将所述应用代码同步至所述创建的编译环境中；S4、发送包含所述预览标识的编译请求至编译器，使得所述编译器根据所述预览标识到对应的编译环境编译对应的工程代码，并将编译完成的可执行代码同步至web服务容器；S5、通过所述web服务容器将预览结果返回给所述前端应用平台。本专利技术的有益效果在于：集成了开发到预览的整个过程，在前端应用平台预览请求的触发下，能够自动执行开发、编译环境部署、编译以及预览，大大缩短了前端应用的预览时间，提高了前端应用的预览效率，整个过程在一个端运行即可，比如服务端，前端应用设计人员本机不需要开发环境就可以预览效果，提升了开发的效率和质量。附图说明图1为本专利技术实施例的一种前端应用预览的方法的步骤流程图；图2为本专利技术实施例的一种前端应用预览的终端的结构示意图；标号说明：1、一种前端应用预览的终端；2、存储器；3、处理器。具体实施方式为详细说明本专利技术的
技术实现思路
、所实现目的及效果，以下结合实施方式并配合附图予以说明。请参照图1，一种前端应用预览的方法，包括步骤：S1、接收前端应用平台发送的预览请求，所述预览请求包括待预览的前端应用的应用标识和预览标识；S2、根据所述预览标识，创建对应的编译环境，并将预存的基础工程代码同步至所述创建的编译环境中；S3、根据所述应用标识获取与所述前端应用对应的配置数据，将所述配置数据转化为应用代码，并将所述应用代码同步至所述创建的编译环境中；S4、发送包含所述预览标识的编译请求至编译器，使得所述编译器根据所述预览标识到对应的编译环境编译对应的工程代码，并将编译完成的可执行代码同步至web服务容器；S5、通过所述web服务容器将预览结果返回给所述前端应用平台。由上述描述可知，本专利技术的有益效果在于：集成了开发到预览的整个过程，在前端应用平台预览请求的触发下，能够自动执行开发、编译环境部署、编译以及预览，大大缩短了前端应用的预览时间，提高了前端应用的预览效率，整个过程在一个端运行即可，比如服务端，前端应用设计人员本机不需要开发环境就可以预览效果，提升了开发的效率和质量。进一步的，所述步骤S2包括：根据所述预览标识判断是否存在对应的编译环境，若是，则直接调用已存在的对应的编译环境；否则，创建对应的编译环境，并将预存的基础工程代码同步至所述创建的编译环境中。由上述描述可知，先根据预览标识判断是否已存在对应的编译环境，若否，才创建新的编译环境，否则，直接调用已存在的编译环境即可，避免重复创建，既节约资源，也提高效率。进一步的，所述步骤S3中将所述应用代码同步至所述创建的编译环境中包括：将所述应用代码与已存在的编译环境中的代码比较，将新增的和修改的代码拷贝至增量文件夹中，并将所述增量文件夹中的内容拷贝至所述编译环境中。由上述描述可知，对于已在编译环境中的代码，不必重复同步，只需要通过比较，同步新增的和修改的代码即可，能够进一步提高效率。进一步的，还包括步骤：接收对前端应用平台的各个前端应用对应的配置数据的调整请求，所述调整请求包含待调整的前端应用的应用标识；根据所述待调整的前端应用的应用标识，修改对应的前端应用的配置数据。由上述描述可知，当设计的前端应用有调整时，根据前端应用平台发送的调整请求，对前端应用对应的配置数据进行局部调整，修改下局部的配置数据，然后再重新预览即可，操作方便快捷，灵活性高。进一步的，所述步骤S5包括：根据所述前端应用平台定时向所述web服务容器发送的预览请求，通过所述web服务容器将预览结果返回给所述前端应用平台创建的浏览器窗口中。由上述描述可知，通过浏览器实现前端应用的预览，并且具体的开发、部署以及编译过程独立于实现预览的浏览器，能够使得web前端代码在开发时候使用统一的开发模式，开发的时候可以集成时下最先进的Web前端技术，系统开发完毕后，通过编译工具生成符合生产要求的代码，这样让Web开发过程变得更加纯净，在开发时候不用过多考虑浏览器兼容性的相关难题。请参照图2，一种前端应用预览的终端，包括存储器、处理器及存储在存储器上并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现以下步骤：S1、接收前端应用平台发送的预览请求，所述预览请求包括待预览的前端应用的应用标识和预览标识；S2、根据所述预览标识本文档来自技高网...

【技术保护点】
1.一种前端应用预览的方法，其特征在于，包括步骤：/nS1、接收前端应用平台发送的预览请求，所述预览请求包括待预览的前端应用的应用标识和预览标识；/nS2、根据所述预览标识，创建对应的编译环境，并将预存的基础工程代码同步至所述创建的编译环境中；/nS3、根据所述应用标识获取与所述前端应用对应的配置数据，将所述配置数据转化为应用代码，并将所述应用代码同步至所述创建的编译环境中；/nS4、发送包含所述预览标识的编译请求至编译器，使得所述编译器根据所述预览标识到对应的编译环境编译对应的工程代码，并将编译完成的可执行代码同步至web服务容器；/nS5、通过所述web服务容器将预览结果返回给所述前端应用平台。/n

【技术特征摘要】
1.一种前端应用预览的方法，其特征在于，包括步骤：
S1、接收前端应用平台发送的预览请求，所述预览请求包括待预览的前端应用的应用标识和预览标识；
S2、根据所述预览标识，创建对应的编译环境，并将预存的基础工程代码同步至所述创建的编译环境中；
S3、根据所述应用标识获取与所述前端应用对应的配置数据，将所述配置数据转化为应用代码，并将所述应用代码同步至所述创建的编译环境中；
S4、发送包含所述预览标识的编译请求至编译器，使得所述编译器根据所述预览标识到对应的编译环境编译对应的工程代码，并将编译完成的可执行代码同步至web服务容器；
S5、通过所述web服务容器将预览结果返回给所述前端应用平台。


2.根据权利要求1所述的一种前端应用预览的方法，其特征在于，所述步骤S2包括：
根据所述预览标识判断是否存在对应的编译环境，若是，则直接调用已存在的对应的编译环境；否则，创建对应的编译环境，并将预存的基础工程代码同步至所述创建的编译环境中。


3.根据权利要求1所述的一种前端应用预览的方法，其特征在于，所述步骤S3中将所述应用代码同步至所述创建的编译环境中包括：
将所述应用代码与已存在的编译环境中的代码比较，将新增的和修改的代码拷贝至增量文件夹中，并将所述增量文件夹中的内容拷贝至所述编译环境中。


4.根据权利要求1所述的一种前端应用预览的方法，其特征在于，还包括步骤：
接收对前端应用平台的各个前端应用对应的配置数据的调整请求，所述调整请求包含待调整的前端应用的应用标识；
根据所述待调整的前端应用的应用标识，修改对应的前端应用的配置数据。


5.根据权利要求1所述的一种前端应用预览的方法，其特征在于，所述步骤S5包括：
根据所述前端应用平台定时向所述web服务容器发送的预览请求，通过所述web服务容器将预览结果返回给所述前端应用平台创建的浏览器窗口中。


6.一种前端应用预览的终端，包括存储器、...

【专利技术属性】
技术研发人员：杜明，
申请(专利权)人：恒鸿达科技有限公司，
类型：发明
国别省市：福建;35