Implementation Method, Device, Electronic Device and Storage Medium of Embedded Browser
By implementing an embedded browser in the video control device and using shared memory for data interaction, NVR is solved by high resource investment when supporting new IPC functions, and efficient function adaptation and management configuration are achieved.
Patent Information
- Application Number
- CN202111101114.1
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2021-09-18
- Publication Date
- 2025-06-24
- Estimated Expiration
- 2041-09-18
AI Technical Summary
When existing network video recorders (NVRs) support new functions of network cameras (IPC), they need to invest a lot of resources to support local interface and web function development, resulting in low efficiency and high cost.
By implementing an embedded browser in a video control device, using independent processes to run the embedded browser functions, and implementing data interaction between the embedded browser process and the UI process of the video control device through shared memory, thereby accessing the target device's web page and parsing the rendered web page resources.
The video control device accesses the target device's web page through an embedded browser, reducing the complexity and cost of NVR's support for new functions, and improving function adaptation and management efficiency.
Smart Images

Figure CN113867985B_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of security technologies, and in particular, to a method, apparatus, electronic device, and storage medium for implementing an embedded browser. Background Art
[0002] In recent years, the functions supported by Internet Protocol Cameras (IPCs) have become increasingly rich.
[0003] As the integrated control center of IPCs, Network Video Recorders (NVRs) need to be configured in real time with IPCs. For example, when a new function is added to an IPC due to software upgrade, in order to configure for this new function, the NVR needs to invest a relatively large amount of resources in local interface and Web function development support, with low implementation efficiency and high cost. Summary of the Invention
[0004] In view of this, this application provides a method, apparatus, electronic device, and storage medium for implementing an embedded browser.
[0005] According to the first aspect of the embodiments of this application, a method for implementing an embedded browser is provided, which is applied to a video control device. The method includes:
[0006] When a first control instruction is detected, create an embedded browser window, create a web page layer, and start an embedded browser process; where the first control instruction is used to control the video control device to enter the browser mode;
[0007] When a second control instruction is detected, access the Web page of the target device through the embedded browser process according to the address information and login information of the target device; where the second control instruction is used to control the embedded browser process to access the Web page of the target device, and the target device is a device equipped with a Web service;
[0008] Obtain a web page rendering diagram from the web page canvas shared memory through the user interface UI process of the video control device, and fill the web page rendering diagram into the update area on the web page layer in the browser window; where the web page canvas shared memory is shared between the UI process and the embedded browser process of the video control device, and the web page rendering diagram in the web page canvas shared memory is parsed and rendered by the embedded browser process based on the web page resources obtained from the Web page of the target device and saved.
[0009] According to a second aspect of the embodiments of the present application, there is provided an implementation device for an embedded browser, which is applied to a video control device. The device includes:
[0010] A detection unit, configured to detect a control instruction;
[0011] An operation unit, configured to create an embedded browser window form, create a web page layer, and start an embedded browser process when the detection unit detects a first control instruction; wherein, the first control instruction is used to control the video control device to enter the browser mode;
[0012] An access unit, configured to access a Web page of a target device through the embedded browser process according to the address information and login information of the target device when the detection unit detects a second control instruction; wherein, the second control instruction is used to control the embedded browser process to access the Web page of the target device, and the target device is a device equipped with a Web service;
[0013] A processing unit, configured to obtain a web page rendering diagram from a web page canvas shared memory through a user interface UI process of the video control device, and fill the web page rendering diagram into an updated area on the web page layer in the browser window form; wherein, the web page canvas shared memory is shared between the UI process and the embedded browser process of the video control device, and the web page rendering diagram in the web page canvas shared memory is parsed and rendered and saved by the embedded browser process according to the web page resources obtained from the Web page of the target device.
[0014] According to a third aspect of the embodiments of the present application, there is provided an electronic device, including a processor and a machine-readable storage medium. The machine-readable storage medium stores machine-executable instructions that can be executed by the processor, and the processor is configured to execute the machine-executable instructions to implement the method provided in the first aspect.
[0015] According to a fourth aspect of the embodiments of the present application, there is provided a storage medium, in which a computer program is stored. When the computer program is executed by a processor, the method provided in the first aspect is implemented.
[0016] According to a fifth aspect of the embodiments of the present application, there is provided a computer program, which is stored in a machine-readable storage medium, and when the processor executes the computer program, the processor is prompted to execute the method provided in the first aspect.
[0017] The implementation method of the embedded browser according to the embodiments of the present application runs the embedded browser function in an independent process, and realizes the data interaction between the embedded browser process and the UI process of the video control device through the shared memory method. Thus, the video control device can access the Web page of the target device through the embedded browser process, and parse and render the web page resources obtained from the Web page of the target device and save them to the shared memory. Furthermore, according to the data in the shared memory, the web page rendering diagram is filled into the update area on the web page layer in the embedded browser window, and the embedded browser is implemented on the video control device. Brief Description of the Drawings
[0018] Figure 1 is a schematic flowchart of an implementation method of an embedded browser provided by an embodiment of the present application;
[0019] Figure 2 is a schematic diagram of a visual layer in a browser mode provided by an embodiment of the present application;
[0020] Figure 3 is a schematic diagram of the architecture of a specific application scenario provided by an embodiment of the present application;
[0021] Figure 4 is a schematic diagram of the structure of an NVR device provided by an embodiment of the present application;
[0022] Figure 5 is a schematic flowchart of the NVR starting the embedded browser provided by an embodiment of the present application;
[0023] Figure 6 is a schematic diagram of the structure of an implementation device of an embedded browser provided by an embodiment of the present application;
[0024] Figure 7 is a schematic diagram of the hardware structure of an electronic device provided by an embodiment of the present application. Detailed Embodiments
[0025] Here, the exemplary embodiments will be described in detail, and the examples are shown in the drawings. When the following description refers to the drawings, unless otherwise indicated, the same numbers in different drawings represent the same or similar elements. The implementation manners described in the following exemplary embodiments do not represent all implementation manners consistent with the present application. On the contrary, they are merely examples of devices and methods consistent with some aspects of the present application as detailed in the appended claims.
[0026] The terms used in this application are for the purpose of describing specific embodiments only and are not intended to limit this application. The singular forms "a", "the", and "said" used in this application and the appended claims are also intended to include the plural forms unless the context clearly dictates otherwise.
[0027] To enable those skilled in the art to better understand the technical solutions provided by the embodiments of this application and to make the above-mentioned objects, features, and advantages of the embodiments of this application more obvious and understandable, the technical solutions in the embodiments of this application will be further described in detail below with reference to the accompanying drawings.
[0028] Please refer to Figure 1 , which is a schematic flowchart of an implementation method of an embedded browser provided by an embodiment of this application. Among them, the implementation method of this embedded browser can be applied to a video control device, such as an NVR, as Figure 1 shown, the implementation method of this embedded browser may include:
[0029] Step S100: When a first control instruction is detected, create a browser window, create a web page layer, and start an embedded browser process; wherein, the first control instruction is used to control the video control device to enter the browser mode.
[0030] In the embodiments of this application, when the video control device detects a control instruction (referred to as the first control instruction herein) for controlling the video control device to enter the browser mode, it can run the embedded browser, that is, create an embedded browser window, create a web page layer, and start an embedded browser process to enter the browser mode.
[0031] Exemplarily, the embedded browser process may include, but is not limited to, a process for interacting with the UI (User Interface) process of the video control device, a process for pulling web page resources, and a process for parsing and rendering the web page resources to generate a web page rendering diagram, etc.
[0032] For example, the embedded browser process may include a UI process, a Network process, and a Web process. Among them, the Web process of the embedded browser is used to interact with the UI process of the video control device, the Network process is used to pull web page resources according to a specified URL, and the Web process is used to parse and render the web page resources to generate a web page rendering diagram.
[0033] Exemplarily, the web page layer is an area in the embedded browser window for displaying information.
[0034] For example, when the video control device detects a click instruction for the embedded browser entry on the desktop of the video control device, it can determine that the first control instruction is detected and control the video control device to enter the browser mode.
[0035] Exemplarily, the embedded browser entry can be a function button set on the desktop of the video control device for selecting the "browser mode".
[0036] Step S110: When the second control instruction is detected, access the Web page of the target video front-end device through the embedded browser process according to the address information and login information of the target device; wherein, the second control instruction is used to control the embedded browser process to access the Web page of the target video front-end device, and the target device is a device equipped with a Web service.
[0037] In the embodiments of the present application, the target device does not specifically refer to a certain fixed device, but can refer to any device that the video control device can obtain the address information (such as IP address) and login information, and is equipped with a Web service. It can include, but is not limited to, the video front-end devices in the access list of the video control device, and the specified front / back-end devices that can obtain the address information through the search method outside the access list.
[0038] Exemplarily, the login information can include user name and password information.
[0039] Exemplarily, the specified front / back-end devices can include backend devices such as NVR and network storage / control node devices, and can also include IOT (Internet of Things) devices, etc.
[0040] In the embodiments of the present application, when the video control device is in the browser mode, the embedded browser process can be controlled by a control instruction (referred to as the second control instruction in this article) to access the Web page of the target device.
[0041] Exemplarily, the second control instruction can be triggered by the user selecting a device in the access list of the video control device (the selected device is the target device), or can be triggered by the user selecting a device in the online list.
[0042] Exemplarily, the devices in the online list are devices that the video control device searches for the address information through the network search method and can access the Web page.
[0043] It should be noted that for the devices in the access list, their login information can be pre-stored in the video control device; for the devices in the online list, after the user selects the device, the user can be prompted to input the login information through a pop-up window.
[0044] Exemplarily, when the target device is a video front-end device in the access list of the video control device, the second control instruction may carry the identification information of the target device, such as a channel number. When the video control device detects the second control instruction, it may obtain the address information and login information of the target device based on the identification information, and access the Web page of the target device through an embedded browser.
[0045] When the target device is a device outside the access list of the video control device, the second control instruction may also carry the IP address and login information of the target device. The video control device may access the Web page of the target device based on the IP address and login information of the target device carried in the second control instruction.
[0046] Step S120: Obtain a web page rendering diagram from the web page canvas shared memory through the UI process of the video control device, and fill the web page rendering diagram into the update area on the web page layer in the browser window; wherein, the web page canvas shared memory is shared between the UI process of the video control device and the embedded browser process, and the web page rendering diagram in the web page canvas shared memory is parsed and rendered from the web page resources obtained from the Web page of the target device and then saved.
[0047] In the embodiment of the present application, data interaction is realized between the embedded browser process and the UI process of the video control device through shared memory (referred to as web page canvas shared memory in this article), so as to realize the display of the web page data of the Web page of the target device by the video control device.
[0048] Exemplarily, when the embedded browser process accesses the Web page of the target device based on the address information and login information of the target device, it may parse and render the web page resources obtained from the Web page of the target device, and save the obtained web page rendering diagram into the web page canvas shared memory.
[0049] The UI process of the video control device may read the web page rendering diagram from the web page canvas shared memory, and fill the web page rendering diagram into the update area on the web page layer in the embedded browser window.
[0050] Exemplarily, the update area of the web page layer may include the entire area of the web page layer, or a specified area in the web page layer.
[0051] Exemplarily, the position information of the update area may be notified by the embedded browser process to the UI process of the video control device.
[0052] It can be seen that in Figure 1In the method flow shown, by running the embedded browser function in an independent process and through the shared memory method, data interaction between the embedded browser process and the UI process of the video control device is achieved. Thus, the video control device can access the Web page of the target device through the embedded browser process, and after parsing and rendering the web page resources obtained from the Web page of the target device, save them to the shared memory (i.e., the web page canvas shared memory). Furthermore, according to the data in the shared memory, the web page rendering diagram is filled into the updated area on the web page layer in the embedded browser window, and an embedded browser is implemented on the video control device.
[0053] In some embodiments, the process interaction between the embedded browser process and the UI process of the video control device is achieved through a socket communication connection.
[0054] Exemplarily, a socket communication connection can be established between the browser process and the UI process of the video control device, and the inter-process communication between the embedded browser process and the UI process of the video control device is achieved through this socket communication connection, thereby realizing the signaling interaction between the embedded browser process and the video control device.
[0055] In one example, in step S110, according to the address information and login information of the target device, accessing the Web page of the target device through the embedded browser process includes: for realizing obtaining and rendering the web page resources of the Web page
[0056] Generating a target URL according to the IP address of the target video front-end device;
[0057] Through the UI process of the video control device, using this socket communication connection, sending the target URL and login information to the embedded browser process, so that the embedded browser process generates a secure login script according to the login information, and accesses the Web page of the target device according to the target URL and the secure login script.
[0058] Exemplarily, in order to improve the access efficiency of the device Web page, when accessing the target device, a secure login script (which can also be called a security script) can be generated according to the obtained login information of the target device, and the target device can be logged in according to this secure login script. By simulating the operation of a user logging in to the target device through the secure login script, one-key access to the Web page of the target device without logging in is realized.
[0059] In one example, in step S100, after running the embedded browser, it may further include:
[0060] Detecting desktop events in the embedded browser window;
[0061] According to the protocols supported by the embedded browser process, encapsulate the detected desktop events in the embedded browser window body, and through the UI process of the video control device, send the encapsulated events to the embedded browser process using socket communication connection, so that the embedded browser process can respond to the encapsulated events.
[0062] Exemplarily, in the embodiments of the present application, based on the socket communication connection between the UI process of the video control device and the embedded browser process, the UI process of the video control device and the embedded browser process can perform signaling interaction by encapsulating events.
[0063] When the UI process of the video control device detects a desktop event in the embedded browser window body, it can encapsulate the detected desktop event according to the data format (which can also be called data type) supported by the embedded browser process.
[0064] Exemplarily, the detected desktop events in the embedded browser window body may include mouse events or soft keyboard events, that is, mouse events or soft keyboard events detected when the operation focus (such as the mouse cursor) is in the embedded browser window body.
[0065] For example, the UI process of the video control device can convert the detected desktop events in the embedded browser window body into a shared event type adapted to webcore (a typesetting engine) according to the data type of the custom WebEventFactory (web page event factory) in the embedded desktop environment.
[0066] For another example, the UI process of the video control device can encapsulate the detected soft keyboard operations in the embedded browser window body, bind them to the inputMethodFilter (input method filter) of the webkitwebview (Webkit web page view), and implement the call of the soft keyboard by the embedded browser.
[0067] The UI process of the video control device can send the encapsulated events (desktop events) to the embedded browser process through its socket communication connection with the embedded browser process. When the embedded browser process receives the encapsulated events, it can respond to the encapsulated events.
[0068] As an example, after running the embedded browser as described above, it may further include:
[0069] When the duration of not detecting desktop events in the embedded browser window body reaches a preset duration, exit the browser mode.
[0070] Exemplarily, the video control device can support a screensaver function for the embedded browser. When the duration that the UI process of the video control device does not detect desktop events within the embedded browser window reaches a preset duration, the browser mode can be exited.
[0071] In one example, the implementation method of the embedded browser provided by the embodiments of the present application may further include:
[0072] When, through the UI process of the video control device, it is detected, based on the socket communication connection, that the embedded browser process is abnormally frozen or abnormally exited, recycle the previously running embedded browser process and restart the embedded browser process.
[0073] Exemplarily, the UI process of the video control device can detect the state of the embedded browser process based on the socket communication connection between the embedded browser process and the UI process of the video control device.
[0074] When the UI process of the video control device detects, based on the socket communication connection between the embedded browser process and the UI process of the video control device, that the embedded browser process is abnormally frozen or abnormally exited, recycle the previously running embedded browser process and restart the browser process.
[0075] In some embodiments, before creating the embedded browser window, creating the web page layer, and starting the embedded browser process when the first control instruction is detected, it may further include:
[0076] Restrict the operation of the specified functions of the video control device, where the specified functions include some or all of the functions that the video control device does not need to implement with the help of the embedded browser.
[0077] Exemplarily, considering that when the video control device is in the browser mode, the functions that the video control device does not need to implement with the help of the embedded browser usually do not need to be concerned about. Therefore, in order to avoid the resource preemption of these functions that do not need to be implemented with the help of the embedded browser in the browser mode, when the UI process of the video control device detects the instruction for the video control device to enter the browser mode (i.e., the above first control instruction), the video control device can restrict the operation of the specified functions. For example, it can restrict the operation of functions that consume more memory (such as exceeding the preset memory occupancy threshold) and / or occupy more CPU (such as exceeding the preset CPU usage), such as the screenshot function, the alarm function, etc.
[0078] In some embodiments, when the video control device is in the browser mode, the visual layers from top to bottom sequentially include:
[0079] The graphic component layer, the web canvas layer, the menu framework layer, and the video layer;
[0080] Among them, the graphic component layer is used to draw and modify basic graphics and is superimposed and displayed on top of the web canvas layer;
[0081] The web canvas layer is used to display the web rendering diagram obtained after the embedded browser process parses and renders the acquired web resources;
[0082] The menu framework layer is used to display the menu selection list corresponding to the functions supported by the embedded browser process, and superimposes and displays the web canvas layer on top of a preset area outside the area where the menu selection list is located; among them, the display interface corresponding to the selected function in the menu selection list is displayed on the web canvas layer in the form of a web rendering diagram;
[0083] The video layer is used to display the video preview screen of the video front-end device, and its schematic diagram can be as Figure 2 shown.
[0084] Exemplarily, when the display interface of the embedded browser is switched to the intelligent event defense configuration interface, the areas of the menu framework layer and the web canvas layer that match the video preview screen are set with a specified transparency so that the video preview screen is visible to the user. That is, although the video preview screen is at the bottom layer of the visual image of the embedded browser interface, since the areas corresponding to the web rendering diagram screen and the menu framework layer picture above it are set with a specified transparency, the video preview screen can be visible to the user.
[0085] To enable those skilled in the art to better understand the technical solutions provided in the embodiments of the present application, the technical solutions provided in the embodiments of the present application will be described below in conjunction with specific examples.
[0086] Please refer to Figure 3 , which is a schematic diagram of the architecture of a specific application scenario provided in the embodiments of the present application. As Figure 3 shown, this application scenario may include an NVR (i.e., the above-mentioned video control device) that is a storage forwarding and micro-control node of a network video monitoring system, target devices such as IPCs and IOT devices (such as access control and alarm hosts), and a video service platform. Among them:
[0087] The core functions of the NVR are to store, preview, and playback the video streams collected by the front-end cameras, and support the configuration management of the access devices (such as the video front-end devices connected to the NVR), such as network parameters, image and audio-video code stream parameters, intelligent event defense, and storage management.
[0088] Considering that the target device has a wide range of business fields and rapid new feature addition and iteration, for each new function added to the target device, a management page for this function needs to be added to the web application running on the target device. At the same time, the NVR side needs to support the management and configuration of the new functions of the target device. To enable the NVR to quickly adapt to the functional changes of the target device, a browser function can be implemented on the NVR device, allowing users or technical support personnel to access the web application of the target device through a browser tool on the NVR and perform management and configuration of relevant operations on the target device, such as network parameters, image and audio / video stream parameters, intelligent event prevention, and storage management.
[0089] In this embodiment, the embedded application running on the NVR device is implemented based on an embedded desktop system. The NVR is connected to a monitor through an HDMI (High Definition Multimedia Interface) interface or a VGA (Video Graphics Array) interface, and a mouse is connected through a USB (Universal Serial Bus) interface. The user selects the functions to use through the mouse, which may include but are not limited to previewing the IPCs connected to the NVR device, playing back recorded videos, viewing alarm information, and configuring functions.
[0090] To enable the embedded browser to better adapt to the embedded desktop environment of the NVR device, taking the embedded browser using webkit2 as the browser engine as an example, the gtk sub-library (an open-source graphics library) and the UI interaction layer implemented depending on gtk can be stripped on the basis of webkit2 and docked with the embedded desktop environment of the NVR. A communication connection is established between the embedded browser process and the NVR's UI process, and a web page canvas shared memory is set. The embedded browser process no longer directly responds to desktop events within the embedded browser window where the user inputs. Instead, when the NVR's UI process detects a desktop event within the embedded browser window, it sends the encapsulated desktop event to the embedded browser process through the socket communication connection between the NVR's UI process and the embedded browser process, and the embedded browser process responds. At the same time, when the embedded browser process parses and renders web page resources to generate a web page rendering diagram, the web page rendering diagram is no longer displayed by the embedded browser process. Instead, the embedded browser process saves the web page rendering diagram to the web page canvas shared memory, and the NVR's UI process reads the web page rendering diagram from the web page canvas shared memory and fills it into the updated area of the web page layer within the browser window.
[0091] As Figure 4 shown, it is a schematic structural diagram of an NVR device provided by an embodiment of the present application. As Figure 4As shown in the figure, the NVR device may include: the UI process of the NVR, the embedded browser process, and the decoding process.
[0092] Between the UI process of the NVR and the embedded browser process, and between the UI process of the NVR and the decoding process, process communication is carried out through the communication method of the socket process.
[0093] The interaction of the web page rendering diagram is realized between the UI process of the NVR and the embedded browser process through the way of sharing memory of the web page canvas.
[0094] When the NVR detects a control instruction (such as the above-mentioned first control instruction) for instructing the NVR to enter the browser mode, the NVR can run the embedded browser, start the browser process, and create a browser window and a web page layer, and realize the two-way interaction between the UI process of the NVR and the embedded browser process in the way of UnixSocket communication and shared memory.
[0095] The NVR can encapsulate the mouse events and soft keyboard events (i.e., desktop events) detected in the embedded browser window, customize the data type of the WebEventFactory according to the embedded desktop environment of the NVR, convert them into a shared event type adapted to the browser process, and send them to the embedded browser process through the UI process of the NVR by using the socket communication connection between the UI process of the NVR and the embedded browser process, and the embedded browser process responds.
[0096] Taking page refresh as an example, for example, the user switches the display interface of the embedded browser by mouse. When the NVR detects this mouse event, it can convert it into a shared event type adapted to the browser process and send it to the embedded browser process through the UI process of the NVR.
[0097] When the embedded browser process detects the need for page change, the embedded browser process can create a bitmap memory shared among processes according to the size of the Web page, and store the web page rendering diagram data corresponding to the current Web page in this bitmap memory; the embedded browser process can traverse this bitmap memory and update the data of the area to be updated.
[0098] When the embedded browser process completes the data update, it can notify the UI process of the NVR to update the web page canvas shared memory of the BackingStrore (backup memory).
[0099] The UI process of the NVR can generate a canvas of the same size according to the size of the Web page, copy the web page rendering diagram data in the first bitmap memory to this canvas, and refresh the Web page according to the web page rendering diagram data in this canvas.
[0100] When the NVR needs to perform intelligent event prevention and control configuration on a specified IPC through an embedded browser, for example, when the UI process of the NVR detects a mouse click event on the "Event" function button in the display interface of the embedded browser, the NVR can, through the method of event encapsulation, convert it into a data type adapted to the browser process and send it to the embedded browser process through the UI process of the NVR.
[0101] When the embedded browser process receives the encapsulated event, it can refresh the display interface (for the specific implementation, refer to the relevant description in the above embodiments).
[0102] When the display interface of the embedded browser is an intelligent event prevention and control configuration interface, the embedded browser process can send a video area overlay request to the UI process of the NVR, so that the UI process of the NVR allocates a matching video area for the embedded browser process according to the video area overlay position and video area size carried in the video area overlay request.
[0103] Exemplarily, the UI process of the NVR can set a specified transparency for the corresponding areas in the browser window and the web page layer according to the video area overlay position and video area size. For example, taking 100% transparency as completely transparent, the specified transparency can be 100%, 90%, or 80%, etc.; at the same time, the UI process of the NVR can apply for decoding resources from the decoding process, decode the real-time video stream of the target IPC, and play it in the specified area, which is an area that matches both the video area overlay position and the video area size. Thus, the user can view the preview screen of the target IPC.
[0104] It can be seen that in the case where the NVR is in the browser mode, the visual layers from top to bottom include:
[0105] The graphic component layer, the web page canvas layer, the menu framework layer, and the video layer;
[0106] Exemplarily, the graphic component layer is used to draw and modify basic graphics, such as rectangles, triangles, or other irregular graphics, etc., and is superimposed and displayed on the web page canvas layer.
[0107] The web page canvas layer is used to display the web page rendering map obtained after the embedded browser process parses and renders the acquired web page resources;
[0108] The menu framework layer is used to display the menu selection list corresponding to the functions supported by the embedded browser process, and superimposes and displays the web page canvas layer on a preset area outside the area where the menu selection list is located; among them, the display interface corresponding to the selected function in the menu selection list is displayed in the form of a web page rendering map on the web page canvas layer;
[0109] The video layer is used to display the video preview image of the video front-end device.
[0110] Exemplarily, when the NVR is in the browser mode, the video preview image displayed by the video layer may be invisible to the user (covered by the menu frame layer and the web canvas layer).
[0111] Exemplarily, when intelligent event prevention and control configuration is required, the embedded browser process may apply for a video area from the UI process of the NVR. The UI process of the NVR may set the corresponding areas of the web canvas layer and the menu frame layer to a preset transparency according to the position and size of the video area. Thus, the video preview image can be visible to the user, and the user can draw or edit intelligent rule boxes in the graphic component layer in the area where the video preview image is located to implement the configuration of the prevention and control area.
[0112] The following describes the process of the NVR starting the browser.
[0113] Please refer to Figure 5 , which is a schematic diagram of the process of the NVR starting the embedded browser provided by the embodiment of the present application. As Figure 5 shown, the process of the NVR starting the embedded browser may include:
[0114] 1. Before running the embedded browser, mutually exclusive settings are made for the specified functions of the NVR to restrict the enabling of some functions that consume more memory and occupy more CPU.
[0115] 2. Initialize the embedded browser window, such as creating the embedded browser form, creating the web layer, and applying for the shared memory of the web canvas, etc.
[0116] 3. Initialize the resources of the embedded browser, including but not limited to decompressing the resources to the file system and other methods.
[0117] Exemplarily, in order to save storage space, when the NVR device is not in the browser mode, the relevant resources of the embedded browser may be compressed and stored on the disk. When entering the browser mode, the compressed resources may be decompressed to the file system.
[0118] 4. Start the relevant processes of the embedded browser, such as the UI process, the Web process, and the Network process.
[0119] Exemplarily, the UI process may be started first, and a thread related to socket communication with the UI process of the embedded browser may be created within the UI process of the NVR.
[0120] The UI process of the NVR notifies the UI process of the embedded browser to initialize the embedded browser, create a webview, and bind the web page canvas shared memory.
[0121] 5. When a Web page access is required, the UI process of the NVR can send relevant JS script information to the UI process of the embedded browser, and inject it into the current webpage through the UI process.
[0122] For example, use a secure login script to simulate the operation of a user logging in to the IPC, and achieve one-click access to the IPC's web page without logging in.
[0123] 6. The UI process of the NVR sends the URL information of the Web page to be accessed to the UI process of the embedded browser, and injects it into the current webpage through the UI process.
[0124] 7. The Network process of the embedded browser pulls the web page resources based on the URL information, and the Web process of the embedded browser parses and renders the pulled web page resources. The UI process of the embedded browser draws the web page rendering diagram in the web page canvas shared memory, and sends a refresh message to the UI process of the NVR to notify the updated area. The UI process of the NVR reads the web page rendering diagram in the web page canvas shared memory according to the updated area.
[0125] 8. The UI process of the NVR fills the read web page rendering diagram into the updated area on the web page layer in the embedded browser window.
[0126] 9. When a desktop event in the embedded browser window is detected, the NVR encapsulates the detected desktop event, and sends the encapsulated event to the UI process of the embedded browser through the UI process of the NVR. The encapsulated event is sent to the Web process through the UI process of the embedded browser, and the Web process receives and responds to the event.
[0127] Exemplarily, when the Web process receives the encapsulated event, it can render the web page to the page effect after executing the corresponding event and trigger a web page refresh.
[0128] For example, for a button click event, when the Web process receives the encapsulated event, it can render the button element to be highlighted or pop up a window, etc. Its specific response strategy depends on the business logic of the Web page.
[0129] Exemplarily, the NVR supports response - type plug - in functions, opens a video playback screen in a web page, plays the real - time video preview screen of the IPC, such as setting a specified transparency for the corresponding area in the web page, and supports overlaying the drawing effect in the graphic component layer on the video preview screen.
[0130] Exemplarily, the NVR supports socket communication detection for the embedded browser process. When it is detected based on socket communication that the embedded browser process is abnormally frozen or abnormally exited, it supports recycling and restarting the embedded browser process.
[0131] Exemplarily, the NVR supports the screen - saver function for the embedded browser, that is, when the duration of not detecting desktop events within the embedded browser window reaches a preset duration, it exits the browser mode.
[0132] Exemplarily, when the embedded browser process exits normally, it can recycle the threads related to the in - process communication of the NVR's UI process, delete the embedded browser resources from the file system, recycle the web page canvas shared memory, and restore the NVR mutex function (i.e., the above - mentioned specified function).
[0133] The method provided by this application has been described above. Next, the device provided by this application will be described:
[0134] Please refer to Figure 6 , which is a schematic structural diagram of an implementation device of an embedded browser provided by an embodiment of this application. As Figure 6 shown, the implementation device of this embedded browser may include:
[0135] A detection unit 610, configured to detect a control instruction;
[0136] An operation unit 620, configured to create an embedded browser window, create a web page layer, and start an embedded browser process when the detection unit 610 detects a first control instruction; wherein, the first control instruction is used to control the video control device to enter the browser mode;
[0137] An access unit 630, configured to access the Web page of the target device through the embedded browser process according to the address information and login information of the target device when the detection unit 610 detects a second control instruction; wherein, the second control instruction is used to control the embedded browser process to access the Web page of the target device, and the target device is a device equipped with a Web service;
[0138] A processing unit 640 is configured to obtain a web page rendering image from a web page canvas shared memory through a UI process of the video control device, and fill the web page rendering image into an updated area on a web page layer within the browser window; wherein, the web page canvas shared memory is shared between the UI process of the video control device and the embedded browser process, and the web page rendering image in the web page canvas shared memory is parsed and rendered by the embedded browser process based on web page resources obtained from the web page of the target device and then saved.
[0139] In some embodiments, process interaction is implemented between the embedded browser process and the UI process of the video control device through a socket communication connection.
[0140] In some embodiments, the access unit 630 accesses the web page of the target device through the embedded browser process according to the address information and login information of the target device, including:
[0141] Generate a target uniform resource locator (URL) according to the IP address of the target device;
[0142] Through the UI process of the video control device, use the socket communication connection to send the target URL and the login information to the embedded browser process, so that the embedded browser process generates a secure login script according to the login information, and accesses the web page of the target device according to the target URL and the secure login script.
[0143] In some embodiments, the detection unit 610 is further configured to detect desktop events within the embedded browser window.
[0144] The processing unit 640 is further configured to encapsulate the detected desktop events of the embedded browser window according to the protocol supported by the embedded browser process, and use the socket communication connection through the UI process of the video control device to send the encapsulated events to the embedded browser process, so that the embedded browser process responds to the encapsulated events.
[0145] In some embodiments, the processing unit 640 is further configured to exit the browser mode when the duration that the detection unit 610 does not detect desktop events within the embedded browser window reaches a preset duration.
[0146] In some embodiments, the processing unit 640 is further configured to, when it is detected through the UI process of the video control device that the embedded browser process is abnormally frozen or abnormally exited based on the socket communication connection, recycle the previously running embedded browser process and restart the embedded browser process.
[0147] In some embodiments, the processing unit 640 is further configured to, when the detection unit 610 detects a first control instruction, restrict the operation of a specified function of the video control device, where the specified function includes some or all of the functions that the video control device does not need to implement with the help of an embedded browser.
[0148] In some embodiments, when the video control device is in browser mode, the visual layers from top to bottom sequentially include:
[0149] A graphic component layer, a web page canvas layer, a menu frame layer, and a video layer;
[0150] Among them, the graphic component layer is used to draw and modify basic graphics and is superimposed and displayed on the web page canvas layer;
[0151] The web page canvas layer is used to display the web page rendering diagram obtained after the embedded browser process parses and renders the obtained web page resources;
[0152] The menu frame layer is used to display the menu selection list corresponding to the functions supported by the embedded browser process, and superimpose and display the web page canvas layer on a preset area outside the area where the menu selection list is located; among them, the display interface corresponding to the selected function in the menu selection list is displayed on the web page canvas layer in the form of a web page rendering diagram;
[0153] The video layer is used to display the video preview screen of the video front-end device
[0154] An embodiment of the present application provides an electronic device, including a processor and a memory. Among them, the memory stores machine-executable instructions that can be executed by the processor, and the processor is used to execute the machine-executable instructions to implement the implementation method of the embedded browser described above.
[0155] Please refer to Figure 7 , which is a schematic diagram of the hardware structure of an electronic device provided by an embodiment of the present application. The electronic device may include a processor 701 and a memory 702 storing machine-executable instructions. The processor 701 and the memory 702 may communicate via a system bus 703. And by reading and executing the machine-executable instructions corresponding to the implementation logic of the embedded browser in the memory 702, the processor 701 may execute the implementation method of the embedded browser described above.
[0156] The memory 702 mentioned in this text can be any electronic, magnetic, optical or other physical storage device that can contain or store information such as executable instructions, data, and so on. For example, a machine-readable storage medium can be: RAM (Random Access Memory), volatile memory, non-volatile memory, flash memory, storage drives (such as hard disk drives), solid-state drives, any type of storage disk (such as optical discs, DVDs, etc.), or similar storage media, or a combination thereof.
[0157] In some embodiments, a storage medium is also provided, such as Figure 7 the memory 702 in [reference], and machine-executable instructions are stored in this storage medium. When the machine-executable instructions are executed by a processor, the implementation method of the embedded browser described above is realized. For example, the storage medium can be ROM, RAM, CD-ROM, magnetic tape, floppy disk, optical data storage device, etc.
[0158] An embodiment of this application also provides a computer program stored in a read storage medium, such as Figure 7 the memory 702 in [reference], and when the processor executes this computer program, it causes the processor 701 to execute the implementation method of the embedded browser described above.
[0159] It should be noted that in this text, relational terms such as first and second are only used to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any actual relationship or order between these entities or operations. Moreover, the term "comprising", "including" or any other variant thereof is intended to cover non-exclusive inclusion, so that a process, method, article or device comprising a series of elements not only includes those elements, but also includes other elements not expressly listed, or also includes elements inherent to such process, method, article or device. Without further limitation, an element defined by the statement "comprising an..." does not exclude the existence of additional identical elements in the process, method, article or device comprising the element.
[0160] The above are only the preferred embodiments of this application and are not intended to limit this application. Any modifications, equivalent replacements, improvements, etc. made within the spirit and principles of this application shall be included within the scope of protection of this application.
Claims
1. A method for implementing an embedded browser, characterized in that, Applied to a video control device, the method includes: When a first control instruction is detected, create an embedded browser window, create a web page layer, and start an embedded browser process; wherein, the first control instruction is used to control the video control device to enter the browser mode; When a second control instruction is detected, access the Web page of the target device through the embedded browser process according to the address information and login information of the target device; wherein, the second control instruction is used to control the embedded browser process to access the Web page of the target device, and the target device is a device equipped with a Web service; Obtain a web page rendering image from the web page canvas shared memory through the user interface UI process of the video control device, and fill the web page rendering image into the update area on the web page layer in the browser window; wherein, the web page canvas shared memory is shared between the UI process and the embedded browser process of the video control device, and the web page rendering image in the web page canvas shared memory is parsed and rendered by the embedded browser process according to the web page resources obtained from the Web page of the target device and saved.
2. The method according to claim 1, wherein Process interaction is realized between the embedded browser process and the UI process of the video control device through a socket communication connection.
3. The method according to claim 2, characterized in that The accessing the Web page of the target device through the embedded browser process according to the address information and login information of the target device includes: Generate a target Uniform Resource Locator (URL) according to the IP address of the target device; Through the UI process of the video control device, use the socket communication connection to send the target URL and the login information to the embedded browser process, so that the embedded browser process generates a secure login script according to the login information, and accesses the Web page of the target device according to the target URL and the secure login script.
4. The method according to claim 2, wherein After starting the embedded browser process, it further includes: Detect desktop events in the embedded browser window; Encapsulate the detected desktop events of the embedded browser window according to the protocol supported by the embedded browser process, and send the encapsulated events to the embedded browser process through the UI process of the video control device using the socket communication connection, so that the embedded browser process responds to the encapsulated events.
5. The method according to claim 4, characterized in that, After starting the embedded browser, it further includes: When the duration of not detecting desktop events in the embedded browser window reaches a preset duration, exit the browser mode.
6. The method according to claim 2, characterized in that, The method further includes: When it is detected through the UI process of the video control device based on the socket communication connection that the embedded browser process is abnormally frozen or abnormally exited, recycle the previously running embedded browser process and restart the embedded browser process.
7. The method according to any one of claims 1-6, characterized in that, Before creating the embedded browser window, creating the web page layer, and starting the embedded browser process when a first control instruction is detected, it further includes: Restrict the operation of the specified functions of the video control device, where the specified functions include some or all of the functions that the video control device can achieve without relying on an embedded browser.
8. The method according to any one of claims 1-6, characterized in that, When the video control device is in browser mode, the visual layers, from top to bottom, include: A graphic component layer, a web canvas layer, a menu framework layer, and a video layer; Among them, the graphic component layer is used to draw and modify basic graphics and is superimposed and displayed on the web canvas layer; The web canvas layer is used to display the web rendering diagram obtained after the embedded browser process parses and renders the acquired web resources; The menu framework layer is used to display the menu selection list corresponding to the functions supported by the embedded browser process, and superimpose and display the web canvas layer above a preset area outside the area where the menu selection list is located; among them, the display interface corresponding to the selected function in the menu selection list is displayed on the web canvas layer in the form of a web rendering diagram; The video layer is used to display the video preview screen of the video front-end device.
9. An implementation device of an embedded browser, characterized in that, Applied to a video control device, the device includes: A detection unit for detecting control instructions; An operation unit for creating an embedded browser window, creating a web page layer, and starting an embedded browser process when the detection unit detects a first control instruction; where the first control instruction is used to control the video control device to enter browser mode; An access unit for accessing the Web page of the target device through the embedded browser process according to the address information and login information of the target device when the detection unit detects a second control instruction; where the second control instruction is used to control the embedded browser process to access the Web page of the target device, and the target device is a device equipped with a Web service; A processing unit for obtaining the web rendering diagram from the web canvas shared memory through the user interface UI process of the video control device and filling the web rendering diagram into the update area on the web page layer in the browser window; where the web canvas shared memory is shared between the UI process and the embedded browser process of the video control device, and the web rendering diagram in the web canvas shared memory is generated and saved by the embedded browser process according to the web resources obtained from the Web page of the target device through parsing and rendering.
10. The device according to claim 9, characterized in that, The embedded browser process and the UI process of the video control device achieve process interaction through a socket communication connection; Among them, the access unit accesses the Web page of the target device through the embedded browser process according to the address information and login information of the target device, including: Generating a target uniform resource locator URL according to the IP address of the target device; Through the UI process of the video control device, using the socket communication connection, send the target URL and the login information to the embedded browser process, so that the embedded browser process generates a secure login script based on the login information, and accesses the Web page of the target device according to the target URL and the secure login script; Wherein, the detection unit is further configured to detect desktop events within the embedded browser window; The processing unit is further configured to encapsulate the detected desktop events of the embedded browser window according to the protocol supported by the embedded browser process, and send the encapsulated events to the embedded browser process through the UI process of the video control device using the socket communication connection, so that the embedded browser process responds to the encapsulated events; Wherein, the processing unit is further configured to exit the browser mode when the duration for which the detection unit does not detect desktop events within the embedded browser window reaches a preset duration; Wherein, the processing unit is further configured to recycle the previously running embedded browser process and restart the embedded browser process when it is detected through the UI process of the video control device based on the socket communication connection that the embedded browser process is abnormally frozen or abnormally exited; And / or, the processing unit is further configured to restrict the operation of specified functions of the video control device when the detection unit detects a first control instruction, and the specified functions include some or all of the functions that the video control device does not need to implement with the help of an embedded browser; And / or, when the video control device is in the browser mode, the visual layers from top to bottom include: A graphic component layer, a web page canvas layer, a menu framework layer, and a video layer; Wherein, the graphic component layer is used to draw and modify basic graphics and overlay and display them on the web page canvas layer; The web page canvas layer is used to display the web page rendering map obtained after the embedded browser process parses and renders the obtained web page resources; The menu framework layer is used to display the menu selection list corresponding to the functions supported by the embedded browser process, and overlay and display the web page canvas layer on a preset area outside the area where the menu selection list is located; wherein, the display interface corresponding to the selected function in the menu selection list is displayed on the web page canvas layer in the form of a web page rendering map; The video layer is used to display the video preview screen of the video front-end device.
11. An electronic device, characterized in that, It includes a processor and a memory, the memory stores machine-executable instructions that can be executed by the processor, and the processor is used to execute the machine-executable instructions to implement the method according to any one of claims 1-8.
12. A storage medium, characterized in that, The storage medium stores a computer program, and when the computer program is executed by the processor, it implements the method according to any one of claims 1-8.
Citation Information
Patent Citations
Systems and methods for rendering weblinks inside a remote application using an embedded browser
CN113168420A
Web browser proxy-client video system and method
US20120054616A1