Method and system for realizing video plug-in service

By using JS bridge module and WebSocket channel in the embedded browser environment, the problem of video plug-in services adaptation in the embedded browser is solved, and the correct embedding and layout adjustment of the video playback window is realized, providing a better user experience.

CN119562108AActive Publication Date: 2025-03-04E SURFING VISION TECHNOLOGY CO LTD
View PDF 6 Cites 0 Cited by

Patent Information

Application Number
CN202411699992.1
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2024-11-26
Publication Date
2025-03-04
Estimated Expiration
2044-11-26

AI Technical Summary

Technical Problem

The existing video plug-in technology is difficult to adapt in the embedded browser environment, it cannot obtain the embedded browser window handle, it cannot actively start the video plug-in service, and it cannot accurately obtain the display area size of the non-web page content of the browser window, resulting in the video playback window being offset.

Method used

By introducing JS scripts into the web page, determine the access environment, and use the JS bridge module to start the video plug-in service in the embedded browser environment, establish a WebSocket channel, and send the window handle of the embedded browser to the video plug-in service. The video plug-in service locates the embedded browser window according to the window handle, monitors its window state changes, and determines the layout of the video playback window based on the window state and layout data.

Benefits of technology

It realizes the correct embedding and layout adjustment of video plug-in services in the embedded browser environment, ensures that the video playback window is synchronized with the embedded browser window status, avoids the problem of video playback window offset, and provides a better user experience.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119562108A_ABST
    Figure CN119562108A_ABST
Patent Text Reader

Abstract

The invention relates to a method and system for achieving video plug-in service, and belongs to the technical field of computers.The method comprises the steps that under the condition that a JS script is introduced into a Web page, the JS access environment of the Web page is determined; when the access environment is an embedded browser, the Web page JS starts a video plug-in service based on a JS bridging calling mode, and when the Web page JS and the video plug-in service establish a WebSocket channel, a window handle of the embedded browser is sent to the video plug-in service; the video plug-in service positions the embedded browser window according to the window handle and monitors the window state change of the embedded browser window; and under the condition that the video plug-in service receives the video playing instruction and the layout data of the video playing area, determining the layout of the video playing window according to the window state of the embedded browser and the layout data.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention belongs to the field of computer technology, and in particular relates to a method and system for realizing video plug-in service. Background Art

[0002] In the related technology, as the current Web front-end applications are becoming more and more popular and have a wide range of usage scenarios, at the same time, the Web front-end uses JS language to implement plug-in-free video playback, which is not as good as the natively implemented video applications in terms of performance, protocol support, etc., and is insufficient to meet the video playback needs of Web front-end applications. Therefore, there is an urgent need for a cross-browser video plug-in service to provide high-quality video playback functions for Web front-end applications.

[0003] The current plug-in technology solution usually adopts the method of installing a native video plug-in program in the operating system. After the installation is completed, the plug-in background service is automatically run. At the same time, the browser Web page introduces a JS script to interact with the plug-in through signaling. When the browser Web page is loaded, the JS script establishes a connection with the plug-in through communication methods such as WebSocket, and modifies the title of the current web page tab and sends it to the plug-in. The plug-in locates the browser window from the top window according to the tab title. After the location is successful, the JS script can send the video playback instruction and the coordinates of the position where the video is to be displayed. After receiving the playback instruction, the plug-in creates a video playback window at the specified position, and sets the Z order of the video playback window above the browser window, so that the video playback window covers the specified position of the browser page, thereby realizing the plug-in video playback in the Web page. However, these methods are only based on traditional desktop browsers, and do not consider the adaptation of embedded browsers. Nowadays, application parties pay more and more attention to the multi-channel access characteristics of products, that is, users can consistently access product functions and content regardless of whether they access the web page directly through a browser or through a client application. In client applications, embedded browsers are often used to load web pages to achieve the same functions and content as direct browser access. Therefore, how to better implement video plug-in services that are adapted to embedded browsers has become an urgent problem to be solved. Summary of the invention

[0004] In view of the above deficiencies in the prior art, an object of the present invention is to provide a method and system for implementing a video plug-in service.

[0005] The first aspect of the present invention proposes a method for implementing a video plug-in service, comprising: S1, when a JS script is introduced into a Web page, determining the access environment of the Web page JS; S2, when the access environment is an embedded browser, the Web page JS starts the video plug-in service based on calling JS bridging, and when the Web page JS establishes a WebSocket channel with the video plug-in service, sending the window handle of the embedded browser to the video plug-in service; S3, the video plug-in service locates the embedded browser window according to the window handle and listens to its window state change event; S4, when the video plug-in service receives a video playback instruction and layout data of a video playback area, determining the layout of the video playback window according to the window state of the embedded browser and the layout data.

[0006] Furthermore, when the access environment is an embedded browser, it is determined that the client application has been started, and the client application saves the window handle of the embedded browser, and registers the address change monitoring and JS bridge modules to the Web page; wherein the conditions for the Web page JS to call the JS bridge include: the client application dynamically monitors the domain name of the Web page; and when an address change event is received, the JS bridge is provided to the Web page JS based on the domain name of the Web page.

[0007] Furthermore, the Web page JS starts the video plug-in service based on calling the JS bridge, including: the client application starts the video plug-in JS bridge method is called, wherein the client application starts the video plug-in JS bridge method is called, including: the client application starts the video plug-in service based on the startup parameters, wherein the startup parameters include the target port number, the unique identifier, and the log path.

[0008] Furthermore, it also includes: when the video plug-in service is started, the Web page JS obtains the port number and the window handle of the embedded browser from the client application; wherein the Web page JS establishes a WebSocket channel with the video plug-in service based on the port number.

[0009] Furthermore, it also includes: the Web page JS obtains the size of the non-web content display area of ​​the client application; the Web page JS determines the layout data of the video playback area based on the size of the non-web content display area of ​​the client application, and sends the layout data of the video playback area to the video plug-in service, wherein the layout data includes screen coordinates and size.

[0010] Furthermore, it also includes: when the client application is detected to exit, the video plug-in service executes a program exit method; when the video plug-in service is detected to exit abnormally, the client application is triggered and then canceled, and based on the JS bridge, the Web page JS is notified to display a user prompt page for the video plug-in service exit.

[0011] Furthermore, it also includes: when the access environment is a non-embedded browser, the Web page JS establishes a WebSocket channel with the video plug-in service; the Web page JS sends the web page title to the video plug-in service; the video plug-in service locates the window of the non-embedded browser based on the web page title; when the video plug-in service receives the video playback instruction and the layout data of the video playback area, the layout of the video playback window is determined according to the window state of the non-embedded browser and the layout data.

[0012] According to a second aspect of the present invention, a system for implementing a video plug-in service is proposed, comprising: a first determination module, for determining the access environment of a Web page JS when a JS script is introduced into a Web page; a start and send module, for starting the video plug-in service by the Web page JS based on calling a JS bridge when the access environment is an embedded browser, and for sending the window handle of the embedded browser to the video plug-in service when a WebSocket channel is established between the Web page JS and the video plug-in service; a monitoring module, for the video plug-in service to locate the embedded browser window according to the window handle and to monitor its window state change events; and a second determination module, for determining the layout of the video playback window according to the window state of the embedded browser and the layout data when the video plug-in service receives a video playback instruction and layout data of a video playback area.

[0013] According to a third aspect of the present invention, an electronic device is proposed, comprising: at least one processor; and a memory communicatively connected to the at least one processor; wherein the memory stores instructions executable by the at least one processor, and the instructions are executed by the at least one processor so that the at least one processor can execute any of the methods described in the first aspect of the present invention.

[0014] According to a fourth aspect of the present invention, a non-transitory computer-readable storage medium storing computer instructions is provided, wherein the computer instructions are used to enable the computer to execute any one of the methods according to the first aspect of the present invention.

[0015] The beneficial effects of the present invention are as follows:

[0016] The method and system for realizing video plug-in service of the present invention, when a JS script is introduced into a Web page, the access environment of the Web page JS is determined; when the access environment is an embedded browser, the Web page JS starts the video plug-in service based on the method of calling JS bridging, and when the Web page JS establishes a WebSocket channel with the video plug-in service, the window handle of the embedded browser is sent to the video plug-in service; the video plug-in service locates the embedded browser window according to the window handle and monitors its window state changes; when the video plug-in service receives the video play instruction and the layout data of the video play area, the layout of the video play window is determined according to the window state and layout data of the embedded browser. The method uses the video plug-in service to monitor the window state change events such as display, hiding, minimization, and maximization of the embedded browser according to the window handle of the embedded browser, so that the video play window maintains the window state such as display and hiding that is consistent with the embedded browser window, ensuring that the video play window can be correctly embedded in the Web page; obtains the layout information of the non-webpage display area of ​​the client application through JS, and obtains the layout information such as the screen coordinates of the video play area to be displayed after calculation, thereby ensuring that the video play window is correctly displayed in the expected position, and the layout of the video window is adjusted in real time. This dynamic adjustment capability enables the video plugin to adapt to different screen sizes and resolutions, providing a better user experience. BRIEF DESCRIPTION OF THE DRAWINGS

[0017] The accompanying drawings are only used to illustrate specific embodiments and are not considered to limit the present invention. In the entire drawings, the same reference symbols represent the same components. Obviously, the drawings described below are only some embodiments recorded in the embodiments of the present invention. For those of ordinary skill in the art, other drawings can also be obtained based on these drawings.

[0018] Figure 1 is a flow chart of a method for implementing a video plug-in service according to an embodiment of the present invention;

[0019] Figure 2 is a flow chart of a method for implementing a video plug-in service according to a specific embodiment of the present invention;

[0020] Figure 3 is a schematic diagram of a system for implementing a video plug-in service according to an embodiment of the present invention;

[0021] Figure 4 It is a structural block diagram of an electronic device according to an embodiment of the present invention. DETAILED DESCRIPTION

[0022] In order to enable those skilled in the art to better understand the technical solutions in the embodiments of the present invention, the technical solutions of the present invention will be clearly and completely described below in conjunction with the accompanying drawings. Obviously, the described embodiments are part of the embodiments of the present invention, rather than all of the embodiments. It should be understood that these descriptions are only exemplary and are not intended to limit the scope of the present invention. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in the field without making creative work should fall within the scope of protection of the present invention.

[0023] Furthermore, in the following description, descriptions of well-known structures and technologies are omitted to avoid unnecessarily obscuring the concepts disclosed in the present invention.

[0024] In the description of the present invention, it should be noted that, unless otherwise clearly specified and limited, the orientation or position relationship indicated by the terms "center", "upper", "lower", "left", "right", "vertical", "horizontal", "inside", "outside", etc. is based on the orientation or position relationship shown in the drawings, which is only for the convenience of describing the present invention and simplifying the description, and does not indicate or imply that the device or element referred to must have a specific orientation, be constructed and operated in a specific orientation, and therefore cannot be understood as a limitation of the present invention. In addition, the terms "first", "second", and "third" are only used for descriptive purposes and cannot be understood as indicating or implying relative importance. The terms "installed", "connected", and "connected" should be understood in a broad sense, for example, it can be a fixed connection, a detachable connection, or an integral connection; it can be a mechanical connection or an electrical connection; it can be a direct connection, or it can be indirectly connected through an intermediate medium, or it can be a connection between the two elements. For those of ordinary skill in the art, the specific meanings of the above terms in the present invention can be understood according to specific circumstances.

[0025] Exemplary embodiments will be described in detail herein, examples of which are shown in the accompanying 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 embodiments described in the following exemplary embodiments do not represent all embodiments consistent with the present invention. Instead, they are merely examples of methods and systems consistent with some aspects of the present invention as detailed in the appended claims.

[0026] As Web front-end applications are becoming more and more popular and widely used, the performance and protocol support of plug-in-free video playback implemented by the Web front-end using JS language are not as good as those of native video service programs, which is insufficient to meet the needs of video playback in Web front-end applications. Therefore, there is an urgent need for a cross-browser video plug-in service to provide high-quality video playback for Web front-end applications.

[0027] The current plug-in technology solution usually adopts the installation of native video plug-in programs in the operating system. After the installation is complete, the plug-in background service is automatically run. At the same time, the browser Web page introduces JS scripts to interact with the plug-in through signaling. When the browser Web page is loaded, the JS script establishes a connection with the plug-in through communication methods such as WebSocket, and modifies the title of the current web page tab and sends it to the plug-in. The plug-in locates the browser window from the top window according to the tab title. After the location is successful, the JS script can send the video playback instruction and the coordinates of the position to be displayed of the video. After receiving the playback instruction, the plug-in creates a video playback window at the specified location, and sets the Z order of the video playback window above the browser window so that it covers the browser page, thereby realizing the plug-in video playback in the Web page.

[0028] However, these methods are only implemented based on traditional desktop browsers, without considering the adaptation to embedded browsers. When applied in embedded browsers, there are at least the following shortcomings:

[0029] Unable to obtain the embedded browser window handle. In the embedded browser, the page title of the web page is not the program window title of the client application. Using JS language to modify the tab title cannot modify the title of the program window, i.e. the top-level window. Therefore, the video plug-in service cannot obtain the embedded browser window handle based on the tab title.

[0030] Unable to actively start the video plug-in service. In traditional browsers, you can generally use a custom URL Scheme to actively start the video plug-in service. However, since most embedded browsers do not support custom URL Schemes by default, users will not be able to actively start the video plug-in service. Using a custom URL Scheme will cause abnormal web page rendering, which will appear as a white screen.

[0031] The size of the non-webpage content display area of ​​the browser window cannot be accurately obtained, resulting in the possible offset of the video playback window. Since the JS language cannot directly obtain the screen coordinates of page elements, the following method is generally used to obtain approximate screen coordinates: that is, obtain the browser window size and the browser visible area size, subtract the two to estimate the size of the browser non-webpage content display area, and then convert the relative coordinates into approximate screen coordinates. Since the browser non-webpage content display area may be located up, down, left, or right, JS cannot determine the size in each direction, so the video playback window positioning may be offset due to incorrect direction estimation.

[0032] To this end, the present invention proposes a method, system and related equipment for implementing a video plug-in service. Specifically, the method, system and related equipment for implementing a video plug-in service according to an embodiment of the present invention are described below with reference to the accompanying drawings.

[0033] Figure 1 1 is a flow chart of a method for implementing a video plug-in service according to an embodiment of the present invention. It should be noted that the method for implementing a video plug-in service according to an embodiment of the present invention can be applied to a system for implementing a video plug-in service according to an embodiment of the present invention. The system for implementing a video plug-in service can be configured on an electronic device or in a server. This embodiment of the present application does not limit this.

[0034] like Figure 1 As shown, the method for implementing the video plug-in service includes:

[0035] S110, when a JS script is introduced into a Web page, determining an access environment of the Web page JS.

[0036] In an embodiment of the present invention, the access environment of the Web page JS may be determined based on the existence of the JS bridge module.

[0037] S120, when the access environment is an embedded browser, the Web page JS starts the video plug-in service based on calling the JS bridge, and when the Web page JS establishes a WebSocket channel with the video plug-in service, the window handle of the embedded browser is sent to the video plug-in service.

[0038] In an embodiment of the present invention, when the access environment is an embedded browser, it is determined that the client application has been started, and the client application saves the window handle of the embedded browser and registers the address change monitoring and JS bridge module with the Web page.

[0039] In the embodiment of the present invention, the client application dynamically monitors the domain name of the web page; when receiving an address change event, the client application provides a JS bridge to the web page JS based on the domain name of the web page. That is, based on the domain name of the web page, the client application provides a JS bridge to the web page of the domain name, and then the web page JS starts the video plug-in service by calling the JS bridge.

[0040] In an embodiment of the present invention, the video plug-in JS bridge method can be called by the client application to realize that the Web page JS starts the video plug-in service based on the calling JS bridge. The client application starts the video plug-in service based on the startup parameters, and the startup parameters include the target port number, the unique identifier, and the log path. That is, the video plug-in service process is started based on the target port number, and the listening port number of the video plug-in service is directly agreed upon, and the port is confirmed to be available, and the Web page JS script does not need to perform port detection.

[0041] It can be understood that the client application obtains all TCP and UDP listening programs on the local computer through the network connection interface, obtains relevant connection information, thereby excluding occupied port numbers and obtaining confirmed available port numbers. Secondly, use the registry operation method to open the registry, obtain the installation path of the video plug-in service, and then use the command line method to use the application's unique identifier, port number, log path, etc. as command line parameters to start the video plug-in service. After the video plug-in service is started, parse the command line parameters, run the WebSocket service to listen to the specified port number, and at the same time, determine whether the log path is entered. If not, set the log path to the directory generated according to the unique identifier under the application cache directory, otherwise set it to the specified path.

[0042] It should be noted that when the client application initializes the embedded browser, it intercepts the navigation request through the custom request processing interface of the embedded browser. When the navigation request is triggered, it determines whether the URL address of the page request is a custom Url Scheme. If it is and it is determined that there is no video plug-in service running, the default port number is used to start the video plug-in service, allowing the Web page JS to use the URL Scheme to start the video plug-in service like in a traditional browser, avoiding page rendering anomalies due to the embedded browser not supporting the custom Url Scheme and not processing. Secondly, when the embedded browser is created, the client application injects the JS bridging module implemented by the client application into the Web page and provides it to the Web page JS for use. At the same time, a whitelist list of domain names can be defined. When the page address of the embedded browser is monitored to change, if it is not within the whitelist range, the JS bridging method registration is canceled to provide customized video plug-in services only for some pages.

[0043] In an embodiment of the present invention, the video plug-in service writes custom URL Scheme information to the registry when installed, and the client application supports the Web page JS to use the custom URL Scheme to invoke the video service plug-in by monitoring the internal events of the embedded browser.

[0044] In an embodiment of the present invention, when the video plug-in service is started, the Web page JS obtains the port number and the window handle of the embedded browser from the client application; then the Web page JS establishes a WebSocket channel with the video plug-in service based on the port number. The Web page JS obtains the window handle of the embedded browser from the client application, and directly obtains the window handle of the embedded browser, and the browser window can be located without modifying the browser tab title, which solves the problem in the existing method that the video plug-in service cannot locate the browser window because the Web page JS script cannot modify the embedded browser tab title, thereby failing to correctly display the video playback window.

[0045] S130, the video plug-in service locates the embedded browser window according to the window handle and monitors changes in its window state.

[0046] In an embodiment of the present invention, upon receiving the window handle, the video plug-in service can locate the embedded browser window according to the window handle and monitor its window state changes, such as monitoring the embedded browser window display, hide, minimize, maximize and other events.

[0047] S140: When the video plug-in service receives the video play instruction and the layout data of the video play area, the layout of the video play window is determined according to the window state of the embedded browser and the layout data.

[0048] In an embodiment of the present invention, the web page JS obtains the size of the non-webpage content display area of ​​the client application; the web page JS determines the layout data of the video playback area based on the size of the non-webpage content display area of ​​the client application, and sends the layout data of the video playback area to the video plug-in service, wherein the layout data includes screen coordinates and size. Then, when the video plug-in service receives the video playback instruction and the layout data of the video playback area, the layout of the video playback window is determined according to the window state and layout data of the embedded browser. This achieves that the web page does not need to estimate the size of the non-webpage content display area by subtracting the browser size from the visible area size, thereby avoiding miscalculation and causing the video playback window to be offset.

[0049] It should be noted that the non-webpage display area of ​​the client application can be understood as the non-working area of ​​the client application and other UI display areas in the working area of ​​the client application excluding the embedded browser. Among them, the non-working area of ​​the client application generally includes the border and title bar of the client application window. Since the client application can accurately obtain the location and size of these areas and other information, it can be directly passed to the Web page JS to accurately calculate the layout data of the video playback area. In traditional desktop browsers, the Web page JS does not have a relevant interface to obtain the size of the non-webpage display area in all directions of the traditional browser (including the favorites bar, sidebar, download prompt, etc.), and can only obtain the relative coordinates of the page elements in the visible area. The Web page JS generally uses the relative coordinates, the size of the browser outer window, and the size of the browser visible area to approximate the screen coordinates of the page elements relative to the upper left corner of the screen. At this time, once there are components in the non-top area such as the sidebar and download prompt, it will cause the Web page JS to make an error in judgment, resulting in an error in the calculation of the screen coordinates and an offset in the video playback window.

[0050] In the embodiment of the present invention, when the client application is detected to exit, the video plug-in service program exits. It can be understood that after the client application starts the video plug-in service process through the command line, it can obtain the local handle of the video plug-in service, and the client application uses the handle to create a job object. Then, when the client application exits, the video plug-in service process also exits, avoiding occupying system resources.

[0051] In an embodiment of the present invention, when an abnormal exit of a video plug-in service is detected, the monitoring event of the client application is canceled after being triggered, and the Web page JS is notified based on the JS bridge to display a user prompt page for the exit of the video plug-in service. That is, the monitoring event in the client application is no longer monitored, and the Web page is notified based on the JS bridge to display a user prompt page for the exit of the video plug-in service.

[0052] According to the method for realizing the video plug-in service of the embodiment of the present invention, when the JS script is introduced into the web page, the access environment of the web page JS is determined; when the access environment is an embedded browser, the web page JS starts the video plug-in service based on the way of calling JS bridging, and when the web page JS establishes a WebSocket channel with the video plug-in service, the window handle of the embedded browser is sent to the video plug-in service; the video plug-in service locates the embedded browser window according to the window handle and monitors its window state changes; when the video plug-in service receives the video play instruction and the layout data of the video play area, the layout of the video play window is determined according to the window state and layout data of the embedded browser. The method uses the video plug-in service to monitor the window state change events such as display, hiding, minimization, and maximization of the embedded browser according to the window handle of the embedded browser, so that the video play window maintains the window state such as display and hiding that is consistent with the embedded browser window, ensuring that the video play window can be correctly embedded in the web page; obtains the layout information of the non-webpage display area of ​​the client application through JS, and obtains the layout information such as the screen coordinates of the video play area to be displayed after calculation, thereby ensuring that the video play window is correctly displayed in the expected position, and the layout of the video window is adjusted in real time. This dynamic adjustment capability enables the video plugin to adapt to different screen sizes and resolutions, providing a better user experience.

[0053] In order to make it easier for those skilled in the art to understand the present invention, Figure 2 A method for implementing a video plug-in service according to a specific embodiment of the present invention is as follows. Figure 2 As shown, the method for implementing the video plug-in service includes:

[0054] S210: When a JS script is introduced into a Web page, an access environment of the Web page JS is determined.

[0055] S220, when the access environment is an embedded browser, the Web page JS starts the video plug-in service based on calling the JS bridge, and when the Web page JS establishes a WebSocket channel with the video plug-in service, the window handle of the embedded browser is sent to the video plug-in service.

[0056] S230, the video plug-in service locates the embedded browser window according to the window handle and monitors changes in its window state.

[0057] S240: When the video plug-in service receives the video play instruction and the layout data of the video play area, the layout of the video play window is determined according to the window state of the embedded browser and the layout data.

[0058] In the embodiment of the present invention, the implementation of steps S210-S240 may refer to the implementation of steps S110-S140, which will not be described in detail in the present invention.

[0059] S250: When the access environment is a non-embedded browser, the Web page JS establishes a WebSocket channel with the video plug-in service.

[0060] In an embodiment of the present invention, when the access environment is a non-embedded browser, the Web page JS can establish a WebSocket channel with the video plug-in service by sequentially detecting from a specified port number.

[0061] S260, the web page JS sends the web page title to the video plug-in service.

[0062] In an embodiment of the present invention, the web page JS adds a unique identifier suffix to the web page title to send the web page title to the video plug-in service.

[0063] S270, the video plug-in service locates the window of the non-embedded browser based on the webpage title.

[0064] S280: When the video plug-in service receives the video play instruction and the layout data of the video play area, the layout of the video play window is determined according to the non-embedded browser window state and the layout data.

[0065] In the embodiments of the present invention, native refers to software, applications or codes optimized for a specific platform, which can directly access and utilize the hardware functions of the device and generally provide better performance.

[0066] Client application: In this article, it refers to desktop applications as opposed to web applications. They need to be downloaded and installed, use embedded browser components to present web page content, and can directly access and utilize the hardware functions of the device.

[0067] JS bridging: A technology that allows JavaScript code in a web application to call client application functions. JS bridging enables web applications to interact with the device's hardware functions (such as camera, geolocation, etc.), thereby providing an experience closer to native applications.

[0068] WebSocket: is a network communication protocol that provides a full-duplex communication channel, allowing the server to actively send messages to the client without the client's request. Compared with the traditional HTTP request / response mode, WebSocket can reduce communication overhead and achieve real-time, continuous connection. It is widely used in applications that require real-time interaction, such as online chat, real-time games, and stock trading.

[0069] Embedded browser: A browser component embedded in a client application that allows the application to display and interact with web content.

[0070] URL Scheme: Custom URL Scheme, which allows web pages or applications to call local applications through specific protocols. For example, in Windows systems, you can write custom URL Scheme information to the registry to start a local program when clicking a specific link in the browser.

[0071] According to the method for implementing a video plug-in service in an embodiment of the present invention, the method can intelligently identify the JS access environment of a Web page, distinguish between an embedded browser and a non-embedded browser environment, and thus adopt different strategies to start and interact with the video plug-in service. This environmental adaptability enables the method to run seamlessly in a variety of browsers and application environments. In the embedded browser environment, efficient communication between the Web page JS and the video plug-in service is achieved through the JS bridge module and the WebSocket channel. In addition, by dynamically monitoring the domain name of the Web page and providing JS bridging through the client application, the rapid startup and stable connection of the video plug-in service are ensured. At the same time, by directly agreeing on the listening port number of the video plug-in service, the cumbersome process of port detection by the Web page JS script is avoided. The video plug-in service can accurately locate the embedded browser window and monitor its window state changes (such as display, hide, minimize, maximize, etc.) based on the window handle of the embedded browser. This helps to determine the layout of the video playback window while ensuring synchronization with the window state of the embedded browser, thereby improving the user experience. By obtaining the size of the non-webpage content display area from the client application, the Web page JS can accurately determine the layout data of the video playback area and send it to the video plug-in service. This avoids the problem of incorrect video playback window layout caused by the inability of the Web page JS to obtain the size of the non-web page content display area of ​​the browser. The method also takes into account the resource management issues of the client application and the video plug-in service. The video plug-in service process is associated with the client application through the job object, ensuring that the video plug-in service process exits together with the client application when the client application exits, avoiding the occupation of system resources. At the same time, when the abnormal exit of the video plug-in service is detected, the listening event in the client application is triggered and then canceled, and the Web page JS is notified through the JS bridge to display the user prompt page of the video plug-in service exit, ensuring the stability and reliability of the system. For non-embedded browser environments, the method establishes a WebSocket channel with the video plug-in service by detecting in sequence from the specified port number, and locates the window of the non-embedded browser based on the web page title (with a unique identifier suffix added). This ensures that the method can work normally in a non-embedded browser environment, improving the versatility and compatibility of the method.

[0072] Through the description of the above implementation methods, those skilled in the art can clearly understand that the method according to the above embodiment can be implemented by means of software plus a necessary general hardware platform, and of course by hardware, but in many cases the former is a better implementation method. Based on such an understanding, the technical solution of the present application, or the part that contributes to the prior art, can be embodied in the form of a software product, which is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk), and includes a number of instructions for a terminal device (which can be a mobile phone, computer, server, or network device, etc.) to execute the methods of each embodiment of the present application.

[0073] According to one aspect of an embodiment of the present invention, a system for implementing a video plug-in service is also provided. Figure 3 is a structural block diagram of a system for implementing a video plug-in service according to an embodiment of the present invention; Figure 3 As shown, including:

[0074] The first determination module 310 is used to determine the access environment of the Web page JS when the Web page introduces the JS script;

[0075] The starting and sending module 320 is used for starting the video plug-in service by calling the JS bridge when the access environment is an embedded browser, and sending the window handle of the embedded browser to the video plug-in service when the Web page JS establishes a WebSocket channel with the video plug-in service;

[0076] A monitoring module 330, used by the video plug-in service to locate the embedded browser window according to the window handle and monitor its window state change event;

[0077] The second determination module 340 is used to determine the layout of the video play window according to the window state of the embedded browser and the layout data when the video plug-in service receives the video play instruction and the layout data of the video play area.

[0078] According to the system for implementing the video plug-in service of the embodiment of the present invention, when the JS script is introduced into the Web page, the access environment of the Web page JS is determined; when the access environment is an embedded browser, the Web page JS starts the video plug-in service based on the method of calling the JS bridge, and when the Web page JS establishes a WebSocket channel with the video plug-in service, the window handle of the embedded browser is sent to the video plug-in service; the video plug-in service locates the embedded browser window according to the window handle and monitors its window state changes; when the video plug-in service receives the video playback instruction and the layout data of the video playback area, the layout of the video playback window is determined according to the window state and layout data of the embedded browser. Thus, the video plug-in service monitors the window state change events such as display, hiding, minimization, and maximization of the embedded browser according to the window handle of the embedded browser, so that the video playback window maintains the window state such as display and hiding that is consistent with the embedded browser window, ensuring that the video playback window can be correctly embedded in the Web page; the layout information of the non-webpage display area of ​​the client application is obtained through JS, and the layout information such as the screen coordinates of the video playback area to be displayed is obtained after calculation, so as to ensure that the video playback window is correctly displayed in the expected position, and the layout of the video window is adjusted in real time. This dynamic adjustment capability enables the video plugin to adapt to different screen sizes and resolutions, providing a better user experience.

[0079] Optionally, when the access environment is an embedded browser, it is determined that the client application has been started, and the client application saves the window handle of the embedded browser, and registers address change monitoring and JS bridging modules to the Web page; wherein the conditions for the Web page JS to call JS bridging include: the client application dynamically monitors the domain name of the Web page; and when an address change event is received, the JS bridge is provided to the Web page JS based on the domain name of the Web page.

[0080] Optionally, the starting and sending module 320 is specifically used for the client application to start the video plug-in JS bridging method to be called, wherein the client application starts the video plug-in JS bridging method to be called, including: the client application starts the video plug-in service based on the startup parameters, wherein the startup parameters include the target port number, the unique identifier, and the log path.

[0081] Optionally, it also includes an acquisition module, which is used for the Web page JS to obtain the port number and the window handle of the embedded browser from the client application when the video plug-in service is started; wherein the start and sending module 320 is specifically used for the Web page JS to establish a WebSocket channel with the video plug-in service based on the port number.

[0082] Optionally, a third determination module is further included, which is used for the Web page JS to obtain the size of the non-webpage content display area of ​​the client application; the Web page JS determines the layout data of the video playback area based on the size of the non-webpage content display area of ​​the client application, and sends the layout data of the video playback area to the video plug-in service, wherein the layout data includes screen coordinates and size.

[0083] Optionally, it also includes a detection module, which is used to execute a program exit method of the video plug-in service when it is detected that the client application has exited; when it is detected that the video plug-in service has exited abnormally, the listening event in the client application is triggered and then canceled, and the Web page JS is notified based on the JS bridge to display a user prompt page for the video plug-in service exit.

[0084] Optionally, it also includes a fourth determination module, which is used for, when the access environment is a non-embedded browser, the Web page JS to establish a WebSocket channel with the video plug-in service; the Web page JS sends the web page title to the video plug-in service; the video plug-in service locates the window of the non-embedded browser based on the web page title; when the video plug-in service receives the video playback instruction and the layout data of the video playback area, the layout of the video playback window is determined according to the window status of the non-embedded browser and the layout data.

[0085] According to one aspect of an embodiment of the present invention, an electronic device is provided.

[0086] Figure 4 Schematic diagram of the structure of an electronic device according to an embodiment of the present invention. Figure 4 As shown, the electronic device may include one or more ( Figure 4 Only one is shown in the figure) processor 102 (processor 102 may include but is not limited to a microprocessor (Microprocessor Unit, referred to as MPU) or a programmable logic device (Programmable logic device, referred to as PLD)) and a memory 104 for storing data. In an exemplary embodiment, the electronic device may also include a transmission device 106 and an input / output device 108 for communication functions. It can be understood by those skilled in the art that Figure 4 The structure shown is for illustration only and does not limit the structure of the above terminal device. Figure 4 More or fewer components as shown, or with Figure 4 Equivalent functions or comparisons shown Figure 4 A different configuration with more features is shown.

[0087] The memory 104 can be used to store computer programs, for example, software programs and modules of application software, such as the computer program corresponding to the method for implementing the video plug-in service in the embodiment of the present invention. The processor 102 executes various functional applications and data processing by running the computer program stored in the memory 104, that is, implementing the above method. The memory 104 may include a high-speed random access memory, and may also include a non-volatile memory, such as one or more magnetic storage devices, flash memory, or other non-volatile solid-state memory. In some examples, the memory 104 may further include a memory remotely arranged relative to the processor 102, and these remote memories may be connected to the terminal device via a network. Examples of the above-mentioned network include, but are not limited to, the Internet, an intranet, a local area network, a mobile communication network, and combinations thereof.

[0088] The transmission device 106 is used to receive or send data via a network. The specific example of the above network may include a wireless network provided by a communication provider of the switching device. In one example, the transmission device 106 includes a network adapter (Network Interface Controller, referred to as NIC), which can be connected to other network devices through a base station so as to communicate with the Internet. In one example, the transmission device 106 can be a radio frequency (RF) module, which is used to communicate with the Internet wirelessly.

[0089] The present invention provides a non-transitory computer-readable storage medium storing computer instructions, wherein the computer instructions are used to enable the computer to execute a method for implementing a video plug-in service.

[0090] The applicant of the present invention has made a detailed explanation and description of the implementation examples of the present invention in conjunction with the drawings in the specification. However, those skilled in the art should understand that the above implementation examples are only preferred implementation schemes of the present invention, and the detailed description is only to help readers better understand the spirit of the present invention, but not to limit the scope of protection of the present invention. On the contrary, any improvements or modifications based on the inventive spirit of the present invention should fall within the scope of protection of the present invention.

[0091] In addition, each functional unit in each embodiment of the present invention may be integrated into a processing module, or each unit may exist physically separately, or two or more units may be integrated into one module. The above-mentioned integrated module may be implemented in the form of hardware or in the form of a software functional module. If the integrated module is implemented in the form of a software functional module and sold or used as an independent product, it may also be stored in a computer-readable storage medium.

[0092] The storage medium mentioned above may be a read-only memory, a magnetic disk or an optical disk, etc. Although the embodiments of the present invention have been shown and described above, it can be understood that the above embodiments are exemplary and cannot be understood as limiting the present invention. A person of ordinary skill in the art may change, modify, replace and modify the above embodiments within the scope of the present invention.

[0093] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the embodiments of the present invention, rather than to limit them. Although the present invention has been described in detail with reference to the above embodiments, those skilled in the art should understand that they can still modify the technical solutions recorded in the above embodiments, or replace some of the technical features therein by equivalents; and these modifications or replacements do not make the essence of the corresponding technical solutions deviate from the spirit and scope of the technical solutions of the embodiments of the present invention. Any changes or replacements that can be easily thought of by those skilled in the art within the technical scope disclosed in the present invention should be covered within the protection scope of the present invention.

Claims

1. A method for implementing a video plug-in service, characterized in that: include: S1, when a JS script is introduced into a web page, determining the access environment of the web page JS; S2, when the access environment is an embedded browser, the Web page JS starts the video plug-in service by calling JS bridging, and when the Web page JS establishes a WebSocket channel with the video plug-in service, sends the window handle of the embedded browser to the video plug-in service; S3, the video plug-in service locates the embedded browser window according to the window handle and monitors its window state change event; S4, when the video plug-in service receives the video play instruction and the layout data of the video play area, determining the layout of the video play window according to the window state of the embedded browser and the layout data.

2. The method for implementing a video plug-in service according to claim 1, characterized in that: In the case where the access environment is an embedded browser, determining that the client application has been started, and the client application saves the window handle of the embedded browser, and registers an address change monitor and a JS bridge module with the Web page; The conditions for the Web page JS to call the JS bridge include: The client application dynamically monitors the domain name of the Web page; When an address change event is received, the JS bridge is provided to the Web page JS based on the domain name of the Web page.

3. The method for implementing a video plug-in service according to claim 1, characterized in that: The Web page JS starts the video plug-in service based on the way of calling JS bridging, including: the client application starts the video plug-in JS bridging method is called, wherein, The client application starts the video plug-in JS bridging method to be called, including: The client application starts the video plug-in service based on startup parameters, wherein the startup parameters include a target port number, a unique identifier, and a log path.

4. The method for implementing a video plug-in service according to claim 1, characterized in that: Also includes: When the video plug-in service is started, the Web page JS obtains the port number and the window handle of the embedded browser from the client application; The Web page JS establishes a WebSocket channel with the video plug-in service based on the port number.

5. The method for implementing a video plug-in service according to claim 1, characterized in that: Also includes: The web page JS obtains the size of the non-webpage content display area of ​​the client application; The Web page JS determines the layout data of the video play area based on the size of the non-webpage content display area of ​​the client application, and sends the layout data of the video play area to the video plug-in service, wherein the layout data includes screen coordinates and size.

6. The method for implementing a video plug-in service according to claim 1, characterized in that: Also includes: In the case of detecting that the client application exits, the video plug-in service executes a program exit method; When it is detected that the video plug-in service exits abnormally, the monitoring event in the client application is triggered and then canceled, and the Web page JS is notified based on the JS bridge to display a user prompt page for the video plug-in service exit.

7. The method for implementing a video plug-in service according to claim 1, characterized in that: Also includes: In the case where the access environment is a non-embedded browser, the Web page JS establishes a WebSocket channel with the video plug-in service; The web page JS sends the web page title to the video plug-in service; The video plug-in service positions the window of the non-embedded browser based on the webpage title; When the video plug-in service receives the video play instruction and the layout data of the video play area, the layout of the video play window is determined according to the window state of the non-embedded browser and the layout data.

8. A system for implementing a video plug-in service, characterized in that: include: The first determination module is used to determine the access environment of the Web page JS when the Web page introduces the JS script; A starting and sending module, used for starting the video plug-in service by the Web page JS based on calling JS bridging when the access environment is an embedded browser, and sending the window handle of the embedded browser to the video plug-in service when the Web page JS establishes a WebSocket channel with the video plug-in service; A monitoring module, used for the video plug-in service to locate the embedded browser window according to the window handle and monitor its window state change event; The second determination module is used to determine the layout of the video playback window according to the window state of the embedded browser and the layout data when the video plug-in service receives the video playback instruction and the layout data of the video playback area.

9. An electronic device, characterized in that: include: at least one processor; as well as a memory communicatively connected to the at least one processor; wherein, The memory stores instructions that can be executed by the at least one processor, and the instructions are executed by the at least one processor to enable the at least one processor to perform the method according to any one of claims 1 to 7.

10. A non-transitory computer-readable storage medium storing computer instructions, characterized in that: The computer instructions are used to cause the computer to execute the method according to any one of claims 1 to 7.

Citation Information

Patent Citations

  • Method and system for embedding local application program window into browser in Linux

    CN103064738A

  • Equipment configuration method and apparatus, electronic equipment, and machine readable storage medium

    CN113885946A

  • Method for embedding external video plug-in window into browser

    CN113886110A

  • Video playing method and device

    CN115175002A

  • Method for playing video of front-end camera by web browser plug-in based on windows operating system

    CN117499736A