CN116301840A - Operation interface application system based on modern browser - Google Patents

Abstract

The invention discloses an operation interface application system based on a modern browser, relates to the technical field of equipment interface development, and includes an interface interaction terminal and a hardware control module. The interface interaction terminal includes an interface display module, an instruction generation module and an instruction transmission module. The display module is used to open the preset browser and control the opened browser to display the preset operation interface; the instruction generation module is used to generate corresponding control instructions based on the click operation of the operation interface; the instruction transmission module is used to connect with the hardware control module Send the control instruction to the hardware control module; the hardware control module is used to receive the control instruction to control the action of the device. A modern browser visits a specific URL to display a preset web page, and replaces the traditional GUI interface with a web page. Users can also generate control commands to control the actions of hardware devices through the operation of the web page, and the development of web pages More versatile and efficient.

Description

A modern browser-based operating interface application system

technical field

The invention relates to the technical field of device interface development, in particular to an operation interface application system based on a modern browser.

Background technique

Interactive devices in factories often have simple operation interfaces, and users can control the corresponding hardware devices by interacting with the operation interface.

The operation interface of early interactive devices adopts graphical user interface application program (GUI), such as Window MFC, Linux Gnome/KDE, and cross-platform QT development framework.

With the release of CCS, HTML5 and JavaScript engine V8, web pages have become the mainstream of user interaction interfaces. Compared with the traditional GUI, the layout of web pages is more beautiful and the development efficiency is higher.

Drawing on the web, the QT development framework introduces QML, a descriptive scripting language that allows traditional GUI developers to write interfaces like the web. In addition, QT's WebEngine module allows direct embedding of HTML pages. By integrating Web browser controls, such as CEF (Chromium Embedded Framework), the GUI interface allows direct embedding of HTML pages.

However, QT QML is a new language that requires developers to relearn; QT WebEngine does not support new HTML features in a timely manner and is unstable; CEF is a large library with high integration costs and requires maintenance version upgrades. Therefore, a more applicable operation interface application system is needed.

Contents of the invention

The present application provides an operation interface application system based on a modern browser, so that web pages can also be suitable for displaying operation interfaces of interactive devices.

This application provides a modern browser-based operation interface application system, which adopts the following technical solutions:

An operation interface application system based on a modern browser, including an interface interaction terminal and a hardware control module,

The interface interaction terminal includes an interface display module, an instruction generation module and an instruction transmission module, wherein,

The interface display module is used to open a preset browser and control the opened browser to display a preset operation interface;

An instruction generation module, configured to generate corresponding control instructions based on a click operation on the operation interface;

The command transmission module is used to connect with the hardware control module and send the control command to the hardware control module;

The hardware control module is used to receive control instructions and respond to the control instructions to control the actions of hardware devices.

Through the above technical solution, a modern browser accesses a specific website to display a preset web page, and the traditional GUI interface is replaced by the web page, and the user can also normally generate control instructions to control the actions of the hardware device through the operation of the web page. The development of web pages is more versatile and efficient, enabling human reuse.

Optionally, the interface interaction terminal also includes a data receiving module;

The hardware control module is also used to collect the running status of the hardware device and periodically transmit it to the data receiving module;

The data receiving module is used to receive the running status and display the running status on the operation interface.

Through the above technical solution, in addition to interacting with the user to generate control instructions, the operation interface is also used to display the running status of the hardware device, so that the user can understand the real-time status of the hardware device.

Optionally, a self-check module is also included, and the self-check module includes an agent identification module and a pre-start module,

The agent identification module is turned on based on the power-on action, and is used to judge whether there is a preset address. If there is a preset address, it will output a start command. If there is no preset address, it will judge whether there is an agent.

If there is an agent, the preset agent address is used as the default address and the command is started; if there is no proxy, the preset local address is directly used as the default address and the command is started;

The pre-start module is configured to receive a start instruction and respond to the start instruction to start the interface display module.

Through the above technical solutions, the interface interaction terminal is often not connected to the Internet or only connected to the LAN, which leads to the interface interaction terminal can only access local files, and there are two ways to access local files through proxy and without proxy. Distinguish whether there is an agent, and then arrange data reading.

Optionally, a shielding module is also included, the shielding module includes a system detection module and a shielding execution module,

The system detection module is used to identify the type of the operating system where the browser is located to obtain the real-time type, and sends the real-time type to the shielding execution module;

The shielding execution module is configured to determine the shielding mode according to the real-time type, and run the corresponding shielding mode to enable the shielding of the specific key combination.

Through the above technical solutions, mainstream operating systems will provide services or plug-ins that prohibit the browser from exiting the kiosk mode, and different operating systems have different blocking methods, so it is necessary to first determine which system the current browser is in, and then specifically How to perform masking.

Optionally, the shielding module also includes a keyboard detection module;

The keyboard detection module is used to detect whether the interactive device is externally connected with a keyboard, and if so, start the system detection module and the shielding execution module respectively.

Through the above technical solution, the exit of the booth mode generally needs to trigger a specific combination key. After the interactive device is connected with an external keyboard, the user may trigger the combination key. Therefore, when the external keyboard is detected, the shielding execution unit needs to be activated in time to block the combination key.

Optionally, the keyboard detection module is also used to detect whether the operating system where the browser is located has the function of invoking the electronic keyboard, and if so, start the system detection module and the shielding execution module respectively.

Through the above technical solution, in addition to the external keyboard of the interactive device, some systems also allow the electronic keyboard to be directly aroused. Similarly, when the electronic keyboard is aroused, it is also necessary to prevent the combination key from being triggered through the electronic keyboard, so the shielding execution unit also needs to be activated.

Optionally, multiple shielding modes and system types corresponding to the shielding modes are stored in the shielding execution module,

The shielding execution module is used to match the same system type according to the real-time type, and then determine the shielding mode according to the matched system type.

Through the above technical solution, different types of operating systems provide different plug-ins or services for prohibiting combination keys. Therefore, the shielding execution unit needs to confirm the type of the current operating system before prohibiting combination keys, and then prohibit the combination through the corresponding shielding method. key.

Optionally, the hardware control module and the data receiving module use the websocket protocol for data transmission.

Through the above technical solution, the websocket protocol can communicate bidirectionally, and supports the hardware control module to actively communicate with the web page. Therefore, when the hardware control module needs to actively send the running status of the hardware device to the operation interface, it is necessary to additionally build websocket communication.

To sum up, using web pages instead of traditional GUI interfaces realizes manpower reuse; using modern browsers to render pages saves the development work of embedding web browsers.

Description of drawings

FIG. 1 is a schematic diagram of the system structure of the embodiment of the present application.

FIG. 2 is a schematic structural diagram of a self-inspection module in an embodiment of the present application.

Fig. 3 is a schematic structural diagram of a shielding module according to an embodiment of the present application.

Fig. 4 is a schematic diagram of information transmission according to an embodiment of the present application.

Fig. 5 is a schematic diagram of the main interface of the embodiment of the present application.

Explanation of reference signs:

1. Interface interaction terminal; 11. Interface display module; 12. Instruction generation module; 13. Instruction transmission module; 14. Data receiving module; 15. Self-inspection module; 151. Agent identification module; 152. Pre-start module; 16. Shielding module; 161. System detection module; 162. Shielding execution module; 163. Keyboard detection module; 2. Hardware control module.

Detailed ways

The present application will be described in further detail below in conjunction with accompanying drawings 1 to 5 .

A modern browser-based operation interface application system, as shown in FIG. 1 , includes an interface interaction terminal 1 and a hardware control module 2 . Wherein, there may be multiple hardware control modules 2, and the multiple hardware control modules 2 correspond to one hardware device respectively. In addition, multiple hardware control modules 2 have established data transmission channels with the interface interaction terminal 1 . The interface interaction terminal 1 is used to display the operation interface on the display screen on the interaction device. The hardware control device is used to control the corresponding hardware device actions.

The interface interaction terminal 1 displays the operation interface on the display screen through a modern browser. A modern browser refers to a browser that can understand and support HTML and XHTML, such as Google Chrome (Chrome) and Microsoft Edge. In this article, the modern browser will be referred to as for the browser.

The web page provided by the browser is the mainstream of the current user interaction interface, which is technically versatile and has low development costs. Compared with traditional graphical user interface applications (GUI), such as Window MFC, Linux Gnome/KDE, and cross-platform QT development frameworks, the use of web pages to develop device GUI interfaces is conducive to the realization of human reuse.

After the interface interaction terminal 1 displays the operation interface through the browser, it can also generate control instructions through interaction with the user, and the interface interaction terminal 1 then transmits the control instructions to the adapted hardware control module 2 . The hardware control module 2 is used to control the actions of corresponding hardware devices according to the received control instructions.

Referring to FIG. 1 , the interface interaction terminal 1 includes an interface display module 11 , an instruction generation module 12 and an instruction transmission module 13 .

The interface display module 11 is configured to open a preset browser and control the opened browser to display a preset operation interface.

Because browser elements such as address bar, tool bar, and bookmark bar exist in the web page of the browser, these browser elements are useless for user operations, and may even interfere with the normal interaction of the user. Therefore, these useless browser elements need to be removed during use. The mainstream browsers all have a kiosk mode. In kiosk mode, the HTML page is displayed in full screen without any trace of the browser.

In addition, a complete interface interaction terminal 1 often has multiple operation interfaces to display different content respectively, and there will be a main interface in these operation interfaces, and other operation interfaces are connected in series through the main interface to realize the display of interface interaction terminal 1. Switching of the operation interface. The preset operation interface is the main interface, and the interface layout of the main interface can be referred to as shown in FIG. 5 .

The preset operation interface corresponds to a preset address, and the preset address is a webpage address corresponding to a web page accessed by a browser to display the preset operation interface.

Therefore, the interface display module 11 controls the browser to start and access the preset address and enter the kiosk mode at the same time.

In order to ensure synchronization, the preset method for the browser to enter the booth mode will be combined with the preset address to form a comprehensive command. By starting the browser through the comprehensive command, the browser can access the preset address and enter the booth mode synchronously.

The instruction generation module 12 is configured to generate corresponding control instructions based on the click operation on the operation interface.

There are many types of instructions generated based on the click operation on the operation interface. According to different application objects, these instructions can be divided into control instructions and basic instructions. Among them, the basic instruction refers to the instruction that only operates on the interface interaction terminal 1 itself, such as the instruction corresponding to the above-mentioned switching of the operation interface; the control instruction refers to the instruction for sending to the hardware control module 2 .

Therefore, the control instructions generated by the instruction generation module 12 will be sent to the hardware control module 2 through the instruction transmission module 13, and the basic instructions generated by the instruction generation module 12 will be directly executed.

The command transmission module 13 is used for connecting with the hardware control module 2 and sending the control command to the hardware control module 2 .

The hardware control module 2 has an HTTP interface. The instruction transmission module 13 and the hardware control module 2 use the HTTP protocol for data transmission.

In addition, when there are multiple hardware control modules 2, in order to improve the accuracy of sending the control commands, the control commands will include ports corresponding to the hardware control modules 2, and each hardware control module 2 corresponds to a port. After the instruction generation module 12 generates the control instruction, the instruction transmission module 13 can accurately send the control instruction to the corresponding hardware control module 2 according to the port.

The hardware control module 2 is used to receive control instructions and respond to the control instructions to control the actions of hardware devices.

It should be noted that the interface interaction terminal 1 is not necessarily connected to the Internet, which requires that the interface interaction terminal 1 can display the operation interface normally even when the network is disconnected. Then the browser in the interface interaction terminal 1 must access the local data. There are two ways to deploy local data: local file deployment and local nginx deployment. Local file deployment is to directly store the data resources required by the web page in the local disk. The local nginx deployment is to place the data resources required by the web page in a specific path of nginx.

This leads to two corresponding ways for browsers to access local data, that is, directly accessing local files and accessing local files through a proxy. These two different access methods correspond to different preset addresses. It also leads to the need to determine the default address applicable to the current browser before the browser is opened.

Specifically, referring to FIG. 1 and FIG. 2 , the interface interaction terminal 1 further includes a self-check module 15 , and the self-check module 15 includes an agent identification module 151 and a pre-start module 152 .

The agent identification module 151 is used to start based on the power-on action, and judge whether there is a preset address after starting, if there is a preset address, then output a start command, if there is no preset address, then judge whether there is a preset address in the current operating system Agent, if there is an agent in the current operating system, the preset agent address is used as the real-time address and a start command is output; if there is no agent in the current operating system, the preset local address is directly used as the real-time address and the start command is output.

The preset proxy address is the access address for accessing nginx, and the preset local address is the access address of the folder where the local data is located.

Just after the operating system is installed, there is no preset address stored in the operating system. Therefore, when the interactive device is turned on for the first time, the agent identification module 151 will determine that there is no preset address, and then generate a preset address according to whether there is an agent. address. When the interactive device is turned on subsequently, since the operating system has already stored a preset address, the agent identification module 151 will quickly output a startup instruction.

The pre-start module 152 is configured to receive a start command and respond to the start command to control the start of the interface display module 11 .

In addition, the browser can enter the kiosk mode, and can naturally exit the kiosk mode. However, the browser used in the interface interaction terminal 1 does not require the browser to exit the kiosk mode, so it is necessary to actively disable the exit from the kiosk mode, so as to prevent the user from accidentally exiting the kiosk mode during operation.

The way to exit the kiosk mode is that the browser receives the exit command, and the exit command is generated by the trigger of the combination key on the keyboard. Therefore, in order to prevent the browser from exiting the kiosk mode, it is necessary to prohibit the trigger of the combination key to generate the exit command.

A keyboard is an input device used to operate computer equipment. According to different forms, keyboards can be divided into physical keyboards and electronic keyboards. Common physical keyboards are key-type keyboards. Common electronic keyboards include on-screen keyboards and touch keyboards. Among them, the physical keyboard needs to be connected to the interface interactive terminal 1 through a data cable; the electronic keyboard is provided by the application system in the interface interactive terminal 1. When the keyboard is needed, the electronic keyboard is awakened in the application system; when the keyboard is not needed , the electronic keyboard is hidden in the application system again.

Due to the different types of keyboards, the generation of the prohibition exit command needs to take both physical keyboards and electronic keyboards into consideration. Regardless of whether it is a physical keyboard or an electronic keyboard, generally it will not directly prevent the user from triggering any keys, so the generation of the actual prohibition command is to make the operating system not respond to the triggering of the specific key combination.

Specifically, referring to FIG. 1 and FIG. 3 , the interface interaction terminal 1 further includes a shielding module 16 , and the shielding module 16 includes a keyboard detection module 163 , a system detection module 161 and a shielding execution module 162 .

The keyboard detection module 163 is configured to detect whether an external keyboard is connected and whether the operating system where the browser is located activates the electronic keyboard. Whether it detects that an external keyboard is connected, or detects that the operating system where the browser is located activates the electronic keyboard, the keyboard detection module 163 will start the system detection module 161 and the shielding execution module 162 .

The keyboard detection module 163 is opened by manual selection. During the system installation process, the user chooses whether to open the keyboard shield. If the user chooses to open the keyboard shield, the keyboard detection module 163 is started.

The system detection module 161 is configured to identify the type of the operating system where the browser is located to obtain the real-time type, and send the real-time type to the shielding execution module 162 .

The shielding execution module 162 is configured to determine the shielding mode according to the real-time type. Wherein, the shielding execution module 162 stores a plurality of shielding modes and system types corresponding to the shielding modes one-to-one.

Most operating systems provide plug-ins or services that prohibit key combinations, but different operating systems often have different tools or services that prohibit key combinations. For example, Ubuntu in the Linux operating system can prohibit unnecessary keys or key combinations through the xmodmap tool; Windows 10 Enterprise Edition provides a keyboard filter function, which can be used to prohibit unnecessary keys or key combinations.

The shielding method is to prohibit the operating system from responding to the triggering of the characteristic key combination through the tools or services provided by the corresponding operating system.

Before determining the shielding method, it is necessary to determine the type of the current operating system.

However, after the shielding execution module 162 determines the shielding mode, the operating system does not necessarily have a plug-in corresponding to the shielding mode, which makes the shielding execution module 162 trigger the restart of the operating system to install the corresponding plug-in. Afterwards, the shielding execution module 162 will set the corresponding plug-in to start automatically, so as to realize long-term shielding of the browser from exiting the kiosk mode.

After the shielding has been completed during the installation of the operating system, the shielding module 16 will not be started in the subsequent process of starting the interface interactive terminal 1 .

In order to facilitate the user to understand the status of each hardware device, in addition to the interface interaction interface transmitting control instructions to the hardware control module 2, the hardware control module 2 can also collect relevant data of the hardware devices and then feed it back to the interface interaction terminal 1.

Specifically, referring to FIG. 1 , the interface interaction terminal 1 further includes a data receiving module 14 . Moreover, the hardware control module 2 also has a websocket interface, and the hardware control module 2 establishes a data communication conforming to the websocket protocol with the data receiving module 14 through the websocket interface.

The hardware control module 2 is also used to collect the operating status of the hardware device and transmit it to the data receiving module 14 .

The hardware control module 2 can regularly transmit the operating status of the hardware device to the data receiving module 14, and can also transmit the operating status of the hardware device to the data receiving module 14 in real time. The specific transmission frequency is determined by the staff depending on actual needs and data processing capabilities. .

The data receiving module 14 is configured to receive the running state and display the running state on the operation interface.

The conventional HTTP protocol can only be accessed by web pages, and cannot be initiated actively by the hardware control module 2 . The websocket protocol is similar to the TCP protocol, can communicate bidirectionally, and supports the hardware control module 2 to actively communicate with the web page. Therefore, through the websocket interface, the hardware control module 2 can actively send data such as notifications and status changes of corresponding hardware devices to the data receiving module 14 .

Of course, after the two-way communication is established through the websocket protocol, the command transmission module 13 can also transmit the control command to the hardware control module 2 through the websocket interface.

In addition, depending on the importance of the device, the cycle of data transmission will be different. When the importance of the device is higher, the cycle of data transmission will be shorter, and the hardware control module 2 will transmit data to the data receiving module 14 more frequently. In addition to actively transmitting relevant data of the device, the hardware control module 2 will also actively transmit heartbeat packets.

Correspondingly, the data receiving module 14 is also used to judge whether the corresponding hardware control module 2 is online by checking whether the heartbeat packet can be received within the preset time limit, wherein the preset time limit is based on the sending interval of the heartbeat packet by the staff. It is set after increasing the time appropriately.

If the hardware control module 2 is offline, the corresponding device may be displayed as offline in the operation interface; otherwise, the corresponding device may be displayed as online in the operation interface. In this way, not only can the operating status generated by the equipment be synchronized to the operation interface, but also can monitor whether the hardware control equipment is normal.

Working principle: When the operating system is just installed, it detects whether the interactive device is connected with an external keyboard or whether the operating system in the interactive device can arouse the electronic keyboard, so as to determine whether a shielding operation is required. If necessary, first determine the type of the operating system, then match the corresponding shielding mode according to the type of the operating system, and run the shielding mode.

Then, after the interface interactive terminal 1 is powered on, according to whether there is an agent, that is, the storage method of local data, a preset address is generated for subsequent browser access.

Then, the interface display module 11 in the interface interaction terminal 1 starts, and controls the browser to access the preset address and enter the booth mode, and the web interface in the browser is displayed on the display screen of the interactive device. Refer to FIG. 4 for the data interaction mode.

Under the interaction between the user and the interactive device, the instruction generation module 12 generates a control instruction and transmits it to the hardware control module 2 through the HTTP protocol, and the hardware control module 2 controls the hardware module to take corresponding actions according to the control instruction. The hardware control module 2 collects the running state of the hardware device and actively sends it to the interactive device side through the websocket protocol, and the interactive device side displays the running state of the hardware device on the display screen of the interactive device.

All of the above are preferred embodiments of the application, and are not intended to limit the protection scope of the application. Therefore, all equivalent changes made according to the structure, shape, and principle of the application should be covered by the protection scope of the application. Inside.

Claims (8)

1. A modern browser-based operating interface application system, characterized in that: comprising an interface interactive terminal (1) for controlling an interactive device to display an operating interface and a hardware control module (2) for controlling the device, the interface The interactive terminal (1) includes an interface display module (11), an instruction generation module (12) and an instruction transmission module (13), wherein, An interface display module (11), configured to open a preset browser and control the opened browser to display a preset operation interface; An instruction generation module (12), configured to generate a corresponding control instruction based on a click operation on the operation interface; An instruction transmission module (13), which is used to connect with the hardware control module (2) and send the control instruction to the hardware control module (2); The hardware control module (2) is used for receiving control instructions and responding to the control instructions to control the actions of hardware devices. 2. a kind of operation interface application system based on modern browser according to claim 1, is characterized in that: described interface interactive terminal (1) also comprises data receiving module (14); The hardware control module (2) is also used to collect the operating status of the hardware device and periodically transmit it to the data receiving module (14); The data receiving module (14) is used for receiving the running state and displaying the running state on the operation interface. 3. A modern browser-based operation interface application system according to claim 1, characterized in that it also includes a self-inspection module (15), and the self-inspection module (15) includes an agent identification module (151) and pre-boot module(152), The agent identification module (151), which is turned on based on the power-on action, is used to judge whether there is a preset address, if there is a preset address, output a start command, and if there is no preset address, then judge whether there is an agent, If there is an agent, the preset agent address is used as the default address and the command is started; if there is no proxy, the preset local address is directly used as the default address and the command is started; A pre-start module (152), configured to receive a start instruction and respond to the start instruction to start the interface display module (11). 4. A modern browser-based operation interface application system according to claim 1, characterized in that: it also includes a shielding module (16), and the shielding module (16) includes a system detection module (161) and a shielding execution module(162), System detection module (161), for identifying the type of operating system where the browser is located to obtain the real-time type, and send the real-time type to the shielding execution module (162); A shielding execution module (162), configured to determine the shielding mode according to the real-time type, and run the corresponding shielding mode to enable the shielding of the combination key. 5. A modern browser-based operation interface application system according to claim 4, characterized in that: the shielding module (16) also includes a keyboard detection module (163); The keyboard detection module (163) is used to detect whether the interactive device is externally connected with a keyboard, and if so, start the system detection module (161) and the shielding execution module (162) respectively. 6. a kind of operation interface application system based on modern browser according to claim 5 is characterized in that: said keyboard detection module (163), is also used for detecting whether the operating system where browser is located has the ability to evoke electronic keyboard function, if so, then start the system detection module (161) and the shielding execution module (162) respectively. 7. A kind of operation interface application system based on a modern browser according to claim 4, characterized in that: multiple shielding modes and system types corresponding to the shielding modes one-to-one are stored in the shielding execution module (162) , The shielding execution module (162) is used to match the same system type according to the real-time type, and then determine the shielding mode according to the matched system type. 8. A modern browser-based operating interface application system according to claim 2, characterized in that: said hardware control module (2) and data receiving module (14) use websocket protocol for data transmission.

Images