本发明涉及网络技术领域，具体涉及一种web的前端可视化打包部署方法及相关产品。
背景技术：
在一套后端服务对应多种前端业务的场景下，前端代码打包根据不同的环境，打包出所需要的代码，此时需要写大量的环境配置文件和执行脚本，费事费力，代码也变得不好维护。
因此现有的前端业务的打包的成本高，维护成本也高，影响了效率。
技术实现要素：
本发明实施例提供了一种web的前端可视化打包部署方法及相关产品，可根据环境数据，自动化构建环境配置文件和执行发布的系统，降低了成本，提高了效率。
第一方面，本发明实施例提供一种web的前端可视化打包部署方法，所述方法包括如下步骤：
电子设备读取本地服务配置信息，返回前端，前端对配置信息进行筛选后得到筛选信息；
电子设备将该筛选信息发送至后端，后端依据该筛选信息执行过滤处理得到当前环境需要的环境变量，将该环境变量动态写入配置文件中；
电子设备对配置文件打包后进行本地压缩得到压缩包，将该压缩包发送至远端服务器，指示远端服务器进行备份和解压得到配置文件
第二方面，提供一种web的前端可视化打包部署系统，所述系统包括：
读取单元，用于读取本地服务配置信息，返回前端，；
处理单元，用于调用前端对配置信息进行筛选后得到筛选信息将该筛选信息发送至后端，后端依据该筛选信息执行过滤处理得到当前环境需要的环境变量，将该环境变量动态写入配置文件中；对配置文件打包后进行本地压缩得到压缩包，将该压缩包发送至远端服务器，指示远端服务器进行备份和解压得到配置文件。
第三方面，提供一种电子设备，所述电子设备用于执行上述的web的前端可视化打包部署方法。
第四方面，提供一种计算机可读存储介质，其存储用于电子数据交换的程序，其中，所述程序使得终端执行第一方面或第二方面提供的方法。
实施本发明实施例，具有如下有益效果：
本申请提供的技术方案读取本地服务配置信息，返回前端，前端对配置信息进行筛选后得到筛选信息；将该筛选信息发送至后端，后端依据该筛选信息执行过滤处理得到当前环境需要的环境变量，将该环境变量动态写入配置文件中；对配置文件打包后进行本地压缩得到压缩包，将该压缩包发送至远端服务器，指示远端服务器进行备份和解压得到配置文件。因此可以自动的可根据环境数据，自动化构建环境配置文件和执行发布的系统。
附图说明
为了更清楚地说明本发明实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
图1是一种电子设备的结构示意图。
图2是一种web的前端可视化打包部署方法的流程示意图。
图3是一种web的前端可视化打包部署方法的另一流程示意图。
图4是本申请提供的web的前端可视化打包部署系统的结构示意图。
具体实施方式
下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
本发明的说明书和权利要求书及所述附图中的术语“第一”、“第二”、“第三”和“第四”等是用于区别不同对象，而不是用于描述特定顺序。此外，术语“包括”和“具有”以及它们任何变形，意图在于覆盖不排他的包含。例如包含了一系列步骤或单元的过程、方法、系统、产品或设备没有限定于已列出的步骤或单元，而是可选地还包括没有列出的步骤或单元，或可选地还包括对于这些过程、方法、产品或设备固有的其它步骤或单元。
在本文中提及“实施例”意味着，结合实施例描述的特定特征、结果或特性可以包含在本发明的至少一个实施例中。在说明书中的各个位置出现该短语并不一定均是指相同的实施例，也不是与其它实施例互斥的独立的或备选的实施例。本领域技术人员显式地和隐式地理解的是，本文所描述的实施例可以与其它实施例相结合。
请参阅图1，图1是本申请实施例公开的一种电子设备的结构示意图，电子设备100包括存储和处理电路110，以及与所述存储和处理电路110连接的传感器170，传感器170包括前置摄像头和后置摄像头，其中：
电子设备100可以包括控制电路，该控制电路可以包括存储和处理电路110。该存储和处理电路110可以存储器，例如硬盘驱动存储器，非易失性存储器(例如闪存或用于形成固态驱动器的其它电子可编程只读存储器等)，易失性存储器(例如静态或动态随机存取存储器等)等，本申请实施例不作限制。存储和处理电路110中的处理电路可以用于控制电子设备100的运转。该处理电路可以基于一个或多个微处理器，微控制器，数字信号处理器，基带处理器，功率管理单元，音频编解码器芯片，专用集成电路，显示驱动器集成电路等来实现。
存储和处理电路110可用于运行电子设备100中的软件，例如互联网浏览应用程序，互联网协议语音(voiceoverinternetprotocol,voip)电话呼叫应用程序，电子邮件应用程序，媒体播放应用程序，操作系统功能等。这些软件可以用于执行一些控制操作，例如，基于照相机的图像采集，基于环境光传感器的环境光测量，基于接近传感器的接近传感器测量，基于诸如发光二极管的状态指示灯等状态指示器实现的信息显示功能，基于触摸传感器的触摸事件检测，与在多个(例如分层的)显示屏上显示信息相关联的功能，与执行无线通信功能相关联的操作，与收集和产生音频信号相关联的操作，与收集和处理按钮按压事件数据相关联的控制操作，以及电子设备100中的其它功能等，本申请实施例不作限制。
电子设备100可以包括输入-输出电路150。输入-输出电路150可用于使电子设备100实现数据的输入和输出，即允许电子设备100从外部设备接收数据和也允许电子设备100将数据从电子设备100输出至外部设备。输入-输出电路150可以进一步包括传感器170。传感器170静脉识别模组，还可以包括环境光传感器，基于光和电容的接近传感器，指纹识别模组，、触摸传感器(例如，基于光触摸传感器和/或电容式触摸传感器，其中，触摸传感器可以是触控显示屏的一部分，也可以作为一个触摸传感器结构独立使用)，加速度传感器，摄像头，和其它传感器等。
输入-输出电路150还可以包括一个或多个显示屏，当为多个显示屏时，例如2个显示屏时，一个显示屏可以设置在电子设备的前面，另一个显示屏可以设置在电子设备的后面，例如显示屏130。显示屏130可以包括液晶显示屏，有机发光二极管显示屏，电子墨水显示屏，等离子显示屏，使用其它显示技术的显示屏中一种或者几种的组合。显示屏130可以包括触摸传感器阵列(即，显示屏130可以是触控显示屏)。触摸传感器可以是由透明的触摸传感器电极(例如氧化铟锡(ito)电极)阵列形成的电容式触摸传感器，或者可以是使用其它触摸技术形成的触摸传感器，例如音波触控，压敏触摸，电阻触摸，光学触摸等，本申请实施例不作限制。
电子设备100还可以包括音频组件140。音频组件140可以用于为电子设备100提供音频输入和输出功能。电子设备100中的音频组件140可以包括扬声器，麦克风，蜂鸣器，音调发生器以及其它用于产生和检测声音的组件。
通信电路120可以用于为电子设备100提供与外部设备通信的能力。通信电路120可以包括模拟和数字输入-输出接口电路，和基于射频信号和/或光信号的无线通信电路。通信电路120中的无线通信电路可以包括射频收发器电路、功率放大器电路、低噪声放大器、开关、滤波器和天线。举例来说，通信电路120中的无线通信电路可以包括用于通过发射和接收近场耦合电磁信号来支持近场通信(nearfieldcommunication，nfc)的电路。例如，通信电路120可以包括近场通信天线和近场通信收发器。通信电路120还可以包括蜂窝电话收发器和天线，无线局域网收发器电路和天线等。
电子设备100还可以进一步包括电池，电力管理电路和其它输入-输出单元160。输入-输出单元160可以包括按钮，操纵杆，点击轮，滚动轮，触摸板，小键盘，键盘，照相机，发光二极管和其它状态指示器等。
用户可以通过输入-输出电路150输入命令来控制电子设备100的操作，并且可以使用输入-输出电路150的输出数据以实现接收来自电子设备100的状态信息和其它输出。
参阅图2，图2提供了一种web的前端可视化打包部署方法，该方法可以由如图1所示的电子设备执行，该电子设备具体可以为：个人计算机、服务器等等智能设备，该方法如图2所示，包括如下步骤：
步骤s200、电子设备读取本地服务配置信息，返回前端，前端对配置信息进行筛选后得到筛选信息；
具体的筛选方法可以包括：对前端所需信息的格式进行统计确定，对配置信息中非预设格式的文件删除得到该筛选信息。
步骤s201、电子设备将该筛选信息发送至后端，后端依据该筛选信息执行过滤处理得到当前环境需要的环境变量，将该环境变量动态写入配置文件中；
步骤s202、电子设备对配置文件打包后进行本地压缩得到压缩包，将该压缩包发送至远端服务器，指示远端服务器进行备份和解压得到配置文件。
本申请提供的技术方案读取本地服务配置信息，返回前端，前端对配置信息进行筛选后得到筛选信息；将该筛选信息发送至后端，后端依据该筛选信息执行过滤处理得到当前环境需要的环境变量，将该环境变量动态写入配置文件中；对配置文件打包后进行本地压缩得到压缩包，将该压缩包发送至远端服务器，指示远端服务器进行备份和解压得到配置文件。因此可以自动的可根据环境数据，自动化构建环境配置文件和执行发布的系统。
示例的，上述方法还可以包括：
远端服务器依据该配置文件自动化构建环境配置文件和执行发布的系统。
示例的，上述后端具体可以包括：node.js。
示例的，上述方法还可以包括：
远端服务器修改解压后文件名为发布目录，删除云端压缩文件。
node.js是一个基于chromev8引擎的javascript运行环境，使用了一个事件驱动、非阻塞式i/o模型，让javascript运行在服务端的开发平台，它让javascript成为与php、python、perl、ruby等服务端语言平起平坐的脚本语言。
node.js对一些特殊用例进行优化，提供替代的api，使得v8在非浏览器环境下运行得更好，v8引擎执行javascript的速度非常快，性能非常好，基于chromejavascript运行时建立的平台，用于方便地搭建响应速度快、易于扩展的网络应用。
node采用一系列“非阻塞”库来支持事件循环的方式。本质上就是为文件系统、数据库之类的资源提供接口。向文件系统发送一个请求时，无需等待硬盘(寻址并检索文件)，硬盘准备好的时候非阻塞接口会通知node。该模型以可扩展的方式简化了对慢资源的访问，直观，易懂。尤其是对于熟悉onmouseover、onclick等dom事件的用户，更有一种似曾相识的感觉。
虽然让javascript运行于服务器端不是node的独特之处，但却是其一强大功能。不得不承认，浏览器环境限制了我们选择编程语言的自由。任何服务器与日益复杂的浏览器客户端应用程序间共享代码的愿望只能通过javascript来实现。虽然还存在其他一些支持javascript在服务器端运行的平台，但因为上述特性，node发展迅猛，成为事实上的平台。
在node启动的很短时间内，社区就已经贡献了大量的扩展库(模块)。其中很多是连接数据库或是其他软件的驱动，但还有很多是凭他们的实力制作出来的非常有用的软件。
node使用module模块去划分不同的功能，以简化应用的开发。modules模块有点像c 语言中的类库。每一个node的类库都包含了十分丰富的各类函数，比如http模块就包含了和http功能相关的很多函数，可以帮助开发者很容易地对比如http,tcp/udp等进行操作，还可以很容易的创建http和tcp/udp的服务器。
参阅图3，图3提供了一种web的前端可视化打包部署方法，该方法具体可以包括：
步骤s301、打包构建：读取本地服务配置信息后，返回到前端。
步骤s302、前端筛选出配置信息后提交到node.js后端。
步骤s303、node.js根据筛选的信息过滤出当前环境需要的环境变量，动态写入配置文件中。
步骤s304、打包后进行本地压缩。
步骤s305、node.js的ssh工具连接到远端服务器。
步骤s306、上传到远端。
步骤s307、进行备份和解压。
参阅图4，图4提供了一种web的前端可视化打包部署系统，所述系统包括：
读取单元401，用于读取本地服务配置信息，返回前端，；
处理单元402，用于调用前端对配置信息进行筛选后得到筛选信息将该筛选信息发送至后端，后端依据该筛选信息执行过滤处理得到当前环境需要的环境变量，将该环境变量动态写入配置文件中；对配置文件打包后进行本地压缩得到压缩包，将该压缩包发送至远端服务器，指示远端服务器进行备份和解压得到配置文件。
示例的，所述系统还包括：远端服务器，
远端服务器，用于依据该配置文件自动化构建环境配置文件和执行发布的系统。
示例的，远端服务器，还用于修改解压后文件名为发布目录，删除云端压缩文件。
示例的，所述处理单元，具体用于对前端所需信息的格式进行统计确定，对配置信息中非预设格式的文件删除得到该筛选信息。
本发明实施例还提供一种计算机存储介质，其中，该计算机存储介质存储用于电子数据交换的计算机程序，该计算机程序使得计算机执行如上述方法实施例中记载的任何一种方法的部分或全部步骤。
本发明实施例还提供一种计算机程序产品，所述计算机程序产品包括存储了计算机程序的非瞬时性计算机可读存储介质，所述计算机程序可操作来使计算机执行如上述方法实施例中记载的任何一种方法的部分或全部步骤。
需要说明的是，对于前述的各方法实施例，为了简单描述，故将其都表述为一系列的动作组合，但是本领域技术人员应该知悉，本发明并不受所描述的动作顺序的限制，因为依据本发明，某些步骤可以采用其他顺序或者同时进行。其次，本领域技术人员也应该知悉，说明书中所描述的实施例均属于可选实施例，所涉及的动作和模块并不一定是本发明所必须的。
在上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其他实施例的相关描述。
在本申请所提供的几个实施例中，应该理解到，所揭露的装置，可通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，装置或单元的间接耦合或通信连接，可以是电性或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件程序模块的形式实现。
所述集成的单元如果以软件程序模块的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储器中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储器中，包括若干指令用以使得一台计算机设备(可为个人计算机、服务器或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储器包括：u盘、只读存储器(rom，read-onlymemory)、随机存取存储器(ram，randomaccessmemory)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。
本领域普通技术人员可以理解上述实施例的各种方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成，该程序可以存储于一计算机可读存储器中，存储器可以包括：闪存盘、只读存储器(英文：read-onlymemory，简称：rom)、随机存取器(英文：randomaccessmemory，简称：ram)、磁盘或光盘等。
以上对本发明实施例进行了详细介绍，本文中应用了具体个例对本发明的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本发明的方法及其核心思想；同时，对于本领域的一般技术人员，依据本发明的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本发明的限制。
1.一种web的前端可视化打包部署方法，其特征在于，所述方法包括如下步骤：
电子设备读取本地服务配置信息，返回前端，前端对配置信息进行筛选后得到筛选信息；
电子设备将该筛选信息发送至后端，后端依据该筛选信息执行过滤处理得到当前环境需要的环境变量，将该环境变量动态写入配置文件中；
电子设备对配置文件打包后进行本地压缩得到压缩包，将该压缩包发送至远端服务器，指示远端服务器进行备份和解压得到配置文件。
2.根据权利要求1所述的方法，其特征在于，所述方法还包括：
远端服务器依据该配置文件自动化构建环境配置文件和执行发布的系统。
3.根据权利要求1所述的方法，其特征在于，所述方法还包括：
远端服务器修改解压后文件名为发布目录，删除云端压缩文件。
4.根据权利要求1所述的方法，其特征在于，所述前端对配置信息进行筛选后得到筛选信息具体包括：
对前端所需信息的格式进行统计确定，对配置信息中非预设格式的文件删除得到该筛选信息。
5.一种web的前端可视化打包部署系统，其特征在于，所述系统包括：
读取单元，用于读取本地服务配置信息，返回前端，；
处理单元，用于调用前端对配置信息进行筛选后得到筛选信息将该筛选信息发送至后端，后端依据该筛选信息执行过滤处理得到当前环境需要的环境变量，将该环境变量动态写入配置文件中；对配置文件打包后进行本地压缩得到压缩包，将该压缩包发送至远端服务器，指示远端服务器进行备份和解压得到配置文件。
6.根据权利要求5所述的系统，其特征在于，所述系统还包括：远端服务器，
远端服务器，用于依据该配置文件自动化构建环境配置文件和执行发布的系统。
7.根据权利要求6所述的系统，其特征在于，
远端服务器，还用于修改解压后文件名为发布目录，删除云端压缩文件。
8.根据权利要求5所述的系统，其特征在于，
所述处理单元，具体用于对前端所需信息的格式进行统计确定，对配置信息中非预设格式的文件删除得到该筛选信息。
9.一种电子设备，其特征在于，所述电子设备用于执行如权利要求1所述的web的前端可视化打包部署方法。
10.一种计算机可读存储介质，其存储用于电子数据交换的程序，其中，所述程序使得执行如权利要求1-4任意一项提供的方法。
技术总结