一种WEB端与交换机的交互方法、设备及介质与流程

一种web端与交换机的交互方法、设备及介质
技术领域
1.本技术涉及通信技术领域领域，具体涉及一种web端与交换机的交互方法、设备及介质。


背景技术：

2.在sdn网络架构中，网络管理人员可以通过sdn网络应用(即控制平面)对网络进行配置和管理。但是在某些特定的场景下，sdn网络应用在某一版本中的功能会有一定的局限性，比如，需要获取交换机更多详细的信息，但是sdn网络应用受到版本的限制不具备展示上述信息的功能，同时还会遇到一些未知的场景导致用户不得不用一些更繁琐的操作去完成任务。在此情景下，通常需要使用第三方终端软件比如xshell等，与交换机进行交互，操作较为繁琐，并且，如果sdn网络应用界面发生了更改，易造成数据的丢失。


技术实现要素：

3.为了解决上述问题，本技术提出了一种web端与交换机的交互方法，应用于所述web端与所述交换机之间的交互系统中，所述交互系统包括web端和服务端，所述方法包括：
4.通过modal组件中的监听器，监听针对所述modal组件的指定操作；
5.响应于所述指定操作，触发resizechange回调函数；
6.通过所述resizechange回调函数，触发terminal组件中的fit调整函数，以通过所述fit调整函数调整所述terminal组件的大小；所述modal组件和所述terminal组件位于所述web端；
7.建立所述terminal组件与所述服务端之间的websocket连接，通过所述websocket连接，确定当前待连接的交换机终端，并向所述服务端发送所述terminal组件产生的指定事件消息，以使所述服务端根据所述指定事件消息调整其对应的shell脚本。
8.在本技术的一种实现方式中，触发terminal组件中的fit调整函数，以通过所述fit调整函数调整所述terminal组件的大小，具体包括：
9.在所述terminal组件中，创建terminal实例以及fitaddon实例；
10.基于所述fitaddon实例，响应于针对所述resizechange回调函数的触发操作，调用fit调整函数；
11.根据所述fit调整函数，调整所述terminal实例的组件参数，以调整所述terminal组件的大小。
12.在本技术的一种实现方式中，所述指定事件消息包括键入消息和调整消息，其特征在于，向所述服务端发送所述terminal组件产生的指定事件消息，具体包括：
13.初始化所述terminal组件中的websocket实例；
14.通过所述terminal实例，监听所述web端传入的键入消息，以及通过所述fitaddon实例，监听所述fit调整函数传入的调整消息；
15.将所述键入消息和所述调整消息传输至所述websocket实例，并通过所述
websocket实例，向所述服务端发送所述键入消息和所述调整消息。
16.在本技术的一种实现方式中，通过所述websocket连接，确定当前待连接的交换机终端，具体包括：
17.通过所述websocket连接，向所述服务端发送连接消息，以使所述服务端根据所述连接消息，确定当前待连接的交换机终端；所述连接消息携带有所述交互系统连接的交换机终端信息。
18.在本技术的一种实现方式中，建立所述terminal组件与所述服务端之间的websocket连接之后，所述方法还包括：
19.在所述web端键入命令的情况下，通过所述websocket连接，向所述服务端发送携带有键入命令的键入消息；
20.获取所述服务端针对所述键入消息发送的返回消息，并根据所述返回消息，将所述返回消息写入至所述terminal组件，以实现所述键入命令的补全操作或换行操作。
21.在本技术的一种实现方式中，方法还包括：
22.基于所述监听器中设置的超时函数，初始化terminal实例，并在所述terminal实例初始化结束后，执行所述resizechange回调函数。
23.在本技术的一种实现方式中，建立所述terminal组件与所述服务端之间的websocket连接，具体包括：
24.在所述websocket连接对应的协议字段上添加安全令牌，以通过所述安全令牌，对所述web端和所述服务端进行接入校验。
25.在本技术的一种实现方式中，监听所述web端传入的键入消息，具体包括：
26.通过所述terminal实例中预设的键入事件监听函数，监听所述web端传入的键入事件；
27.在获取到所述键入事件之后，通过数据监听函数，获取所述键入事件对应的键入数据。
28.本技术实施例提供了一种web端与交换机的交互设备，设备包括：
29.至少一个处理器；以及，
30.与所述至少一个处理器通信连接的存储器；其中，
31.所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够：
32.通过modal组件中的监听器，监听针对所述modal组件的指定操作；
33.响应于所述指定操作，触发resizechange回调函数；
34.通过所述resizechange回调函数，触发terminal组件中的fit调整函数，以通过所述fit调整函数调整所述terminal组件的大小；所述modal组件和所述terminal组件位于web端；
35.建立所述terminal组件与服务端之间的websocket连接，通过所述websocket连接，确定当前待连接的交换机终端，并向所述服务端发送所述terminal组件产生的指定事件消息，以使所述服务端根据所述指定事件消息调整其对应的shell脚本。
36.本技术实施例提供了一种非易失性计算机存储介质，存储有计算机可执行指令，其特征在于，所述计算机可执行指令设置为：
37.通过modal组件中的监听器，监听针对所述modal组件的指定操作；
38.响应于所述指定操作，触发resizechange回调函数；
39.通过所述resizechange回调函数，触发terminal组件中的fit调整函数，以通过所述fit调整函数调整所述terminal组件的大小；所述modal组件和所述terminal组件位于web端；
40.建立所述terminal组件与服务端之间的websocket连接，通过所述websocket连接，确定当前待连接的交换机终端，并向所述服务端发送所述terminal组件产生的指定事件消息，以使所述服务端根据所述指定事件消息调整其对应的shell脚本。
41.通过本技术提出的一种web端与交换机的交互方法能够带来如下有益效果：
42.该方法能够嵌入到交互系统中，操作人员可在交互系统的web端直接与交换机进行交互，无需再通过第三方软件去连接交换机终端，提高了网络运维效率；通过监听针对modal组件的指定操作，可以对设置于web端的terminal组件大小进行自适应调整，进而通过terminal组件与服务端之间的websocket连接，将web端的指定时间消息传入至服务端，以调整服务端的shell脚本，从而保证了前端命令格式与后端命令格式保持一致，避免了因web端组件伸缩造成数据丢失等情况。
附图说明
43.此处所说明的附图用来提供对本技术的进一步理解，构成本技术的一部分，本技术的示意性实施例及其说明用于解释本技术，并不构成对本技术的不当限定。在附图中：
44.图1为本技术实施例提供的一种web端与交换机的交互方法的流程示意图；
45.图2为本技术实施例提供的另一种web端与交换机的交互方法的流程示意图；
46.图3为本技术实施例提供的一种web端与交换机的交互设备的结构示意图。
具体实施方式
47.为使本技术的目的、技术方案和优点更加清楚，下面将结合本技术具体实施例及相应的附图对本技术技术方案进行清楚、完整地描述。显然，所描述的实施例仅是本技术一部分实施例，而不是全部的实施例。基于本技术中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本技术保护的范围。
48.以下结合附图，详细说明本技术各实施例提供的技术方案。
49.如图1所示，本技术实施例提供的一种web端与交换机的交互方法，应用于web端与交换机之间的交互系统中，交互系统包括web端(即client端)和服务端(即server端)，包括：
50.s101：通过modal组件中的监听器，监听针对modal组件的指定操作。
51.如图1所示，web端设有modal组件和terminal组件，其中，modal组件是一个外层包裹组件，主要用于控制terminal组件的伸缩以及拖拽移动。terminal组件是终端主体，在terminal组件输入命令后，可得到系统后台对于该执行命令的相应反馈。
52.modal组件中设有resizeobserver监听器以及draggable实例。当用户在拖动modal组件时，draggable组件会控制位置来使modal移动到指定位置，并且不超出web端的界面。resizeobserver监听器初始化后可监听针对该modal组件进行的指定操作，指定操作
可以是大小调整操作。在用户更改modal组件的大小时，resizeobserver监听器用于监听modal组件的伸缩大小。
53.s102：响应于指定操作，触发resizechange回调函数。
54.web端响应于s101进行的指定操作，触发resizechange回调函数。resizechange回调函数在交互过程中用于传递参数，采用settimeout机制防抖，具体地，resizeobserver监听器中设置有settimeout超时函数，一方面能够避免频繁调用resizechange以及频繁通过websocket发送数据带来的性能消耗，另一方面，超时函数可以使得resizeobserver的回调函数在初始化时进入下一个宏任务中，这样在运行代码时可以跳过第一次的回调函数执行，而回溯到terminal组件中执行terminal实例的初始化，通过初始化自动将modal组件的长度和宽度撑开，当这一轮的宏任务执行完毕，接着去执行resizeobserver中的回调函数，回调函数中的形参的长度和宽度就是被terminal撑开之后的长度和宽度，从而避免了手动更改modal组件的大小。也就是说，在对modal组件进行伸缩后仅是更改了其前端样式，而其具体的设置参数在ternimal实施例初始化之后，通过执行回调函数自动获得的。
55.s103：通过resizechange回调函数，触发terminal组件中的fit调整函数，以通过fit调整函数调整terminal组件的大小；modal组件和terminal组件位于客户端。
56.触发resizechange回调函数的同时，terminal组件会相应初始化xterm.js中的terminal实例以及xterm-addon-fit的fitaddon实例。其中，fitaddon是一个能够用于终端尺寸自适应的插件，其响应于针对resizechange回调函数的触发操作，调用fit调整函数，从而通过fit函数使得terminal组件自动适应外层modal组件的大小，调整述terminal实例的组件参数，实现terminal组件的自适应伸缩。
57.s104：建立terminal组件与服务端之间的websocket连接，通过websocket连接，确定当前待连接的交换机终端，并向服务端发送terminal组件产生的指定事件消息，以使服务端根据指定事件消息调整其对应的shell脚本。
58.由于terminal组件中键入的命令需要传入至后台服务端，在自适应调整terminal组件的大小后，还需建立terminal组件与服务端之间的websocket连接，输出前端组件界面的调整消息，保证web端与服务端的shell脚本行列数一致，从而避免因前端terminal组件的动态伸缩引起数据丢失或数据换行问题。
59.需要说明的是，websocket是一种在单个tcp连接上进行全双工通信的协议，在建立websocket连接时，需要在其对应的协议字段上添加至token安全令牌，通过token能够对web端和服务端进行接入校验，防止恶意接入，保证了交互安全。
60.在建立terminal组件与服务端之间的websocket连接之后，初始化terminal组件中的websocket实例，websocket实例可通过监听message事件，接收terminal组件传入的指定事件消息。指定事件消息包括键入消息和调整消息，键入消息是在terminal终端界面上键入命令后，terminal实例所相应获取到的事件消息，比如，在terminal终端界面上键入一行命令，terminal实例可以监听web端传入的键入消息；调整消息是在调整terminal组件的大小时，fitaddon实例所相应获取到的数据消息。terminal实例和fitaddon实例可将上述键入消息和调整消息均传入至websocket实例中，以通过websocket连接传输至服务端。
61.websocket可实现三种类型的数据传输，分别是op为connect、command和resize的消息。在获取terminal组件产生的指定事件消息之前，首先需服务端发送connect连接消
息，使得服务端确定其所需建立交互连接的交换机终端。connect消息携带有交互系统连接的交换机终端信息，以及host、username和password等连接信息。
62.在web端也就是terminal终端界面上键入命令时，每输入一条命令，通过web端和服务端之间的websocket连接，服务端都能够相应接收到携带有键入命令的command键入消息。terminal实例在监听web端传入的键入消息时，通过onkey键入事件监听函数来监听键入事件，比如，键盘输入、复制粘贴操作等，以及通过ondata数据监听函数来获取键入数据，键入数据表示命令完全写入之前的数据。键入事件监听函数在数据监听函数之前执行，键入事件监听函数能够监听复制粘贴操作、terminal.getselectionposition、terminal.getselection等，terminal.getselectionposition、terminal.getselection用于定位光标，复制粘贴操作用于实现命令的复制粘贴功能。比如，在键入telnet命令时，用户在web端手动键入tel，此时，键入事件监听函数可监听到web端出现键入事件，此时需要调用数据监听函数，获取到键入数据tel。
63.服务端设有node-pty，node-pty是一个伪终端文件，能够返回允许读写的终端对象。在本技术实施例中，其用于将web端传入的指定事件消息传输给shell脚本，然后将shell返回的数据通过websocket连接回传至web端。web端在获取到该键入消息的返回消息后，将该返回消息写入至terminal组件中，这样就能够保证换行操作的正常使用，以及通过tab实现键入命令的补全操作。
64.在terminal组件的大小调整后，为保证前后端界面保持一致，可向服务端发送resize消息，以调整服务端的shell行列数。
65.如图2所示的另一种web端与交换机的交互方法的流程示意图。如图2所示，web端包括modal组件和terminal组件，modal组件中的resizeobserver监听器用于监听modal组件的伸缩情况，发生伸缩后，触发传入至terminal组件的resizechange回调函数。通过resizechange回调函数，调用fit函数，以自适应调整terminal组件的大小，使其适应外部modal组件。terminal组件的大小调整数据resize data、web端键入的命令key data可分别通过fitaddon实例、terminal实例实时传入至websocket实例中，然后通过web端和服务端之间建立的websocket连接，发送至服务端。服务端中的node-pty将指定事件消息经由node-pty传入至shell中，shell返回result消息后通过websocket回传至terminal组件中，至此，就完成了web端与服务端的数据交互。该方法可嵌入到任意需要通过terminal终端连接交换机的系统中。
66.以上为本技术提出的方法实施例。基于同样的思路，本技术的一些实施例还提供了上述方法对应的设备和非易失性计算机存储介质。
67.图3为本技术实施例提供的一种web端与交换机的交互设备的结构示意图。如图3所示，包括：
68.至少一个处理器；以及，
69.至少一个处理器通信连接的存储器；其中，
70.存储器存储有可被至少一个处理器执行的指令，指令被至少一个处理器执行，以使至少一个处理器能够：
71.通过modal组件中的监听器，监听针对modal组件的指定操作；
72.响应于指定操作，触发resizechange回调函数；
73.通过resizechange回调函数，触发terminal组件中的fit调整函数，以通过fit调整函数调整terminal组件的大小；modal组件和terminal组件位于web端；
74.建立terminal组件与服务端之间的websocket连接，通过websocket连接，确定当前待连接的交换机终端，并向服务端发送所述terminal组件产生的指定事件消息，以使服务端根据指定事件消息调整其对应的shell脚本。
75.本技术实施例提供了一种非易失性计算机存储介质，存储有计算机可执行指令，计算机可执行指令设置为：
76.通过modal组件中的监听器，监听针对modal组件的指定操作；
77.响应于指定操作，触发resizechange回调函数；
78.通过resizechange回调函数，触发terminal组件中的fit调整函数，以通过fit调整函数调整terminal组件的大小；modal组件和terminal组件位于web端；
79.建立terminal组件与服务端之间的websocket连接，通过websocket连接，确定当前待连接的交换机终端，并向服务端发送terminal组件产生的指定事件消息，以使服务端根据指定事件消息调整其对应的shell脚本。
80.本技术中的各个实施例均采用递进的方式描述，各个实施例之间相同相似的部分互相参见即可，每个实施例重点说明的都是与其他实施例的不同之处。尤其，对于设备和介质实施例而言，由于其基本相似于方法实施例，所以描述的比较简单，相关之处参见方法实施例的部分说明即可。
81.本技术实施例提供的设备和介质与方法是一一对应的，因此，设备和介质也具有与其对应的方法类似的有益技术效果，由于上面已经对方法的有益技术效果进行了详细说明，因此，这里不再赘述设备和介质的有益技术效果。
82.本领域内的技术人员应明白，本技术的实施例可提供为方法、系统、或计算机程序产品。因此，本技术可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本技术可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、cd-rom、光学存储器等)上实施的计算机程序产品的形式。
83.本技术是参照根据本技术实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
84.这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
85.这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一
个方框或多个方框中指定的功能的步骤。
86.在一个典型的配置中，计算设备包括一个或多个处理器(cpu)、输入/输出接口、网络接口和内存。
87.内存可能包括计算机可读介质中的非永久性存储器，随机存取存储器(ram)和/或非易失性内存等形式，如只读存储器(rom)或闪存(flash ram)。内存是计算机可读介质的示例。
88.计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(pram)、静态随机存取存储器(sram)、动态随机存取存储器(dram)、其他类型的随机存取存储器(ram)、只读存储器(rom)、电可擦除可编程只读存储器(eeprom)、快闪记忆体或其他内存技术、只读光盘只读存储器(cd-rom)、数字多功能光盘(dvd)或其他光学存储、磁盒式磁带，磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。按照本文中的界定，计算机可读介质不包括暂存电脑可读媒体(transitory media)，如调制的数据信号和载波。
89.还需要说明的是，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、商品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、商品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个
……”
限定的要素，并不排除在包括所述要素的过程、方法、商品或者设备中还存在另外的相同要素。
90.以上所述仅为本技术的实施例而已，并不用于限制本技术。对于本领域技术人员来说，本技术可以有各种更改和变化。凡在本技术的精神和原理之内所作的任何修改、等同替换、改进等，均应包含在本技术的权利要求范围之内。