WebSocket connection callback methods, devices, storage media, and processors

Abstract

The application provides a WebSocket connection callback method and device, a storage medium and a processor, and relates to the technical field of computers. The method comprises the following steps: establishing a listening event and a WebSocket connection between a front end and a back end; when multiple front end pages call the WebSocket connection, triggering the listening event in a corresponding callback method of each front end page, respectively; writing a general method and a homepage use method corresponding to each front end page into the listening event, respectively, to obtain a callback event corresponding to each front end page, so that the back end can call the callback event corresponding to each page in the listening event to realize the callback of each front end page. The method avoids the situation that multiple pages need to repeatedly modify the callback method, has low code repeatability and high expandability. The method does not affect the processing of other pages, and makes the code engineering more expandable and the componentization higher.

Description

Technical Field

[0001] This application relates to the field of computer technology, specifically to a WebSocket connection callback method, a WebSocket connection callback device, a machine-readable storage medium, and a processor. Background Technology

[0002] In web development, there are scenarios requiring real-time communication between the front-end and back-end. The WebSocket protocol can be used to enable the back-end to proactively send notifications to the front-end, achieving real-time communication. However, when establishing a WebSocket connection, there are scenarios where multiple pages need to use the same connection, and different pages handle the callback differently. For example, page 1 might open a specific pop-up after receiving a message from the back-end, while page 2 might display a text message. While the callback method can be overridden after establishing the connection and navigating to other pages, this overwrites the original callback method, preventing it from being called.

[0003] When multiple pages simultaneously invoke the same WebSocket connection, it's necessary to address the issue of different pages handling callback methods differently. Existing methods involve overriding the callback method on each page, with the following steps: 1) Connect to the WebSocket protocol and write the callback method; 2) Navigate to the next page, override the new callback method, return to the previous page, and override the callback method again.

[0004] Existing methods require repeatedly writing the same callback methods for functions that need to be called on every page, resulting in high code repetition, poor extensibility, and developers needing to understand more logic beyond their assigned functions. If a callback method used by page 1 uses many variables specific to that page, page 2 also needs to use the same method, requiring additional variables to be passed in or the two pages to be merged into one, leading to poor code readability and reduced componentization.

[0005] Therefore, when multiple pages simultaneously call the same WebSocket connection, existing methods suffer from high code duplication and low componentization. Summary of the Invention

[0006] The purpose of this application is to provide a WebSocket connection callback method, apparatus, storage medium, and processor.

[0007] To achieve the above objectives, the first aspect of this application provides a WebSocket connection callback method, which includes:

[0008] Establish event listeners and WebSocket connections between the front-end and back-end;

[0009] When multiple front-end pages call the WebSocket connection, the listening event is triggered in the callback method corresponding to each front-end page;

[0010] The common methods and homepage usage methods corresponding to each front-end page are written into the listening events to obtain the callback events corresponding to each front-end page. This allows the back-end to call the callback events corresponding to each page in the listening events to achieve the callback of each front-end page when performing a callback. The common methods are methods that are common in instant messaging, and the homepage usage methods are methods that are only used on the homepage in instant messaging.

[0011] In this embodiment of the application, the step of writing the general methods and homepage usage methods corresponding to each front-end page into the listener events to obtain the callback events corresponding to each front-end page includes:

[0012] When rendering components or pages, Vue's lifecycle is utilized. After the DOM elements are rendered, the `mounted` hook function is used to execute the operation of writing listener events. This allows the common methods and homepage usage methods corresponding to each front-end page to be written into the listener events, thus obtaining the callback events corresponding to each front-end page.

[0013] In this embodiment of the application, the step of writing the general methods and homepage usage methods corresponding to each front-end page into the listener events to obtain the callback events corresponding to each front-end page includes:

[0014] After performing the open or jump to the target page operation on each front-end page, the general method and homepage usage method corresponding to the target page are written into the listener event to obtain the callback event corresponding to each front-end page.

[0015] In this embodiment of the application, after each front-end page performs a jump to the target page operation, the general method and homepage usage method corresponding to the target page are written into the listener event, including:

[0016] Before performing a page redirection operation, determine whether the callback event corresponding to the current page needs to be destroyed;

[0017] If it is determined that the callback event corresponding to the current page needs to be destroyed, destroy the callback event corresponding to the current page and perform the redirection to the target page.

[0018] After the operation of redirecting to the target page is completed, the general method and homepage usage method corresponding to the target page are written into the listener event.

[0019] In this embodiment of the application, the destruction of the callback event corresponding to the current page includes:

[0020] Destroy the homepage usage methods in the callback event corresponding to the current page, and retain the general methods in the callback event corresponding to the current page;

[0021] The step of writing the general method and homepage usage method corresponding to the target page into the listener event includes:

[0022] The general method in the callback event corresponding to the current page is used as the general method corresponding to the target page, and the homepage usage method corresponding to the target page is written into the listener event.

[0023] In this embodiment of the application, it also includes:

[0024] When leaving the respective front-end pages or preset nodes, disconnect the WebSocket connection and destroy the listening event.

[0025] A second aspect of this application provides a WebSocket connection callback device, the WebSocket connection callback device comprising:

[0026] Establish a module to set up event listeners and WebSocket connections between the front-end and back-end;

[0027] The triggering module is used to trigger the listening event in the callback method of each front-end page when multiple front-end pages call the WebSocket connection;

[0028] The writing module is used to write the general methods and homepage usage methods corresponding to each front-end page into the listening event, respectively, to obtain the callback events corresponding to each front-end page. This allows the back-end to call the callback events corresponding to each page in the listening event to achieve the callback of each front-end page when performing a callback. The general methods are methods commonly used in instant messaging, and the homepage usage methods are methods used only on the homepage in instant messaging.

[0029] A third aspect of this application provides a processor configured to execute the WebSocket connection callback method described above.

[0030] A fourth aspect of this application provides a machine-readable storage medium storing instructions that, when executed by a processor, configure the processor to perform the WebSocket connection callback method described above.

[0031] The fifth aspect of this application provides a computer program product, including a computer program that, when executed by a processor, implements the WebSocket connection callback method described above.

[0032] The above technical solution establishes a listening event and a WebSocket connection between the front-end and back-end. When multiple front-end pages call the WebSocket connection, the listening event is triggered in the callback method corresponding to each front-end page. The common methods and homepage usage methods for each front-end page are written into the listening event, resulting in callback events for each front-end page. This allows the back-end to call the callback events corresponding to each page in the listening events to achieve callbacks to each front-end page. The common methods are those used in instant messaging, while the homepage usage methods are those used only on the homepage in instant messaging. This method does not directly write the methods to be executed in the WebSocket connection callback; instead, it uses the listening event as an intermediary, first calling the listening event and then calling the actual method to be executed through the listening event. This maintains the immediacy of the WebSocket connection while avoiding the need for repeated modification of callback methods across multiple pages, resulting in low code redundancy and high extensibility. When handling WebSocket callbacks, each page only needs to focus on the processing logic of the current page, without needing to consider the callback processing scenarios of other pages. Each page can independently add methods for WebSocket callbacks without affecting the processing of other pages, making the code project more scalable and more component-based.

[0033] Other features and advantages of the embodiments of this application will be described in detail in the following detailed description section. Attached Figure Description

[0034] The accompanying drawings are provided to further illustrate the embodiments of this application and form part of the specification. They are used together with the following detailed description to explain the embodiments of this application, but do not constitute a limitation on the embodiments of this application. In the drawings:

[0035] Figure 1 This illustration schematically shows an application environment diagram of the WebSocket connection callback method according to an embodiment of this application;

[0036] Figure 2 The schematic diagram illustrates a flowchart of a WebSocket connection callback method according to an embodiment of this application;

[0037] Figure 3 This illustration schematically shows a detailed process diagram of a WebSocket connection callback according to an embodiment of this application;

[0038] Figure 4This schematically illustrates a structural block diagram of a WebSocket connection callback device according to an embodiment of this application;

[0039] Figure 5 The diagram illustrates the internal structure of a computer device according to an embodiment of this application.

[0040] Explanation of reference numerals in the attached figures

[0041] 102-Terminal; 104-Server; 410-Establishment Module; 420-Trigger Module; 430-Write Module; A01-Processor; A02-Network Interface; A03-Internal Memory; A04-Display Screen; A05-Input Device; A06-Non-Volatile Storage Medium; B01-Operating System; B02-Computer Program. Detailed Implementation

[0042] To make the objectives, technical solutions, and advantages of the embodiments of this application clearer, the technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. It should be understood that the specific embodiments described herein are only for illustration and explanation of the embodiments of this application and are not intended to limit the embodiments of this application. All other embodiments obtained by those skilled in the art based on the embodiments of this application without creative effort are within the scope of protection of this application.

[0043] It should be noted that if the embodiments of this application involve directional indicators (such as up, down, left, right, front, back, etc.), the directional indicators are only used to explain the relative positional relationship and movement of the components in a certain specific posture (as shown in the figure). If the specific posture changes, the directional indicators will also change accordingly.

[0044] Furthermore, if the embodiments of this application involve descriptions such as "first" or "second," these descriptions are for descriptive purposes only and should not be construed as indicating or implying their relative importance or implicitly specifying the number of technical features indicated. Therefore, features defined with "first" or "second" may explicitly or implicitly include at least one of those features. Additionally, the technical solutions of various embodiments can be combined with each other, but this must be based on the ability of those skilled in the art to implement them. If the combination of technical solutions is contradictory or impossible to implement, it should be considered that such a combination of technical solutions does not exist and is not within the scope of protection claimed in this application.

[0045] The acquisition, transmission, storage, use, and processing of data in this application comply with relevant national laws and regulations. Furthermore, it should be noted that existing industry solutions such as software, components, and models may be mentioned in the embodiments of this application. These should be considered exemplary, intended only to illustrate the feasibility of implementing the technical solution of this application, and do not imply that the applicant has already used or necessarily used such solutions.

[0046] The terms mentioned in this embodiment are explained as follows:

[0047] Vue is a progressive framework for building user interfaces. It employs a bottom-up, incremental development design, providing a software architecture pattern (Model-View-ViewModel, MVVM) with data binding and a composable component system. It features a simple and flexible Application Programming Interface (API), enabling reactive data binding and composable view components through a straightforward API.

[0048] WebSocket: A protocol used to establish real-time, bidirectional communication connections between web applications and servers. It provides persistent connections through a single Transmission Control Protocol (TCP) connection, enabling the web to deliver data from applications in more real-time.

[0049] `addEventListener`: Specifies an event handler for a given element without overwriting existing event handlers. It allows adding multiple event handlers to an element, multiple event handlers of the same type to an element, and can add event handlers to any Document Object Model (DOM) object, not just HTML elements, such as the `window` object. The DOM object is a programming interface used to represent and manipulate HTML, XML, and other documents.

[0050] Callback: A two-way calling pattern in which the called party will also call the other party's interface when the interface is called.

[0051] The WebSocket connection callback method provided in this application can be applied to, for example... Figure 1In the application environment shown, terminal 102 communicates with server 104 via a network. This method does not directly write the method to be executed in the WebSocket connection callback; instead, it uses a listener event as an intermediary, first calling the listener event and then invoking the actual method to be executed through the listener event. This maintains the immediacy of the WebSocket connection while avoiding the need to repeatedly modify the callback method across multiple pages, resulting in low code redundancy and high extensibility. Terminal 102 can be, but is not limited to, various personal computers, laptops, smartphones, tablets, and portable wearable devices, and server 104 can be implemented using a standalone server or a server cluster consisting of multiple servers.

[0052] Figure 2 The schematic diagram illustrates a flowchart of a WebSocket connection callback method according to an embodiment of this application. For example... Figure 2 As shown, in one embodiment of this application, a WebSocket connection callback method is provided. This embodiment mainly applies this method to the above-mentioned... Figure 1 Taking terminal 102 (or server 104) as an example, the following steps are included:

[0053] Step 210: Establish event listeners and WebSocket connections between the front-end and back-end;

[0054] In this embodiment, the aforementioned listening event is a global listening event, which can capture callback events across the entire application. The aforementioned WebSocket connection between the front-end and back-end can be triggered by the front-end to establish the WebSocket connection.

[0055] Step 220: When multiple front-end pages call the WebSocket connection, the listening event is triggered in the callback method corresponding to each front-end page;

[0056] In this embodiment, when multiple front-end pages call the same WebSocket connection simultaneously, the callback method of the WebSocket on the front end can be triggered through the WebSocket protocol with each front-end page, and a listening event can be triggered in the callback method of the WebSocket that needs to use the method.

[0057] Step 230: Write the general method and homepage usage method corresponding to each front-end page into the listening event respectively to obtain the callback event corresponding to each front-end page, so that when the back-end performs a callback, it can call the callback of each front-end page by calling the callback event corresponding to each page in the listening event. The general method is a method that is common in instant messaging, and the homepage usage method is a method that is only used on the homepage in instant messaging.

[0058] In this embodiment, after a listener event is triggered, the functional code to be executed is written into this listener event. That is, the methods corresponding to each front-end page can be written into the listener event; here, the methods corresponding to the front-end page refer to the functional code to be executed. In a Vue project, an event listener method can be created using `window.addEventListener`. When the backend performs a callback, it first calls the listener event, and then calls the actual method to be executed through the listener event, that is, it calls the callback events corresponding to each page in the listener event to implement the callback to each front-end page. The general method is a method common to instant messaging, while the homepage usage method is a method used only on the homepage in instant messaging. For example, when entering a functional module that requires instant messaging, the actions of establishing a WebSocket connection, creating a listener event, and writing a callback method in the listener event will occur when the homepage is opened. In the callback method, methods common to this functional module (such as document expiration reminders, notifications sent from the management end to the client, etc.) and methods used only on the homepage (such as updating some data on the homepage) will be written separately.

[0059] In some embodiments, the step of writing the general methods and homepage usage methods corresponding to each front-end page into the listener events to obtain the callback events corresponding to each front-end page includes the following steps:

[0060] When rendering components or pages, Vue's lifecycle is utilized. After the DOM elements are rendered, the `mounted` hook function is used to execute the operation of writing listener events. This allows the common methods and homepage usage methods corresponding to each front-end page to be written into the listener events, thus obtaining the callback events corresponding to each front-end page.

[0061] In this embodiment, Vue first triggers the `mounted` hook function after completing component initialization and DOM rendering. At this point, the page's DOM structure is stable, allowing for safe DOM manipulation and the addition of event listeners. By writing the corresponding methods for each front-end page into the event listeners, a response mechanism can be established for specific user interactions or system events. When these events are triggered, the corresponding callback events are executed, thereby implementing specific business logic.

[0062] For example, suppose there's a button that, when clicked by a user, needs to execute a specific method to display a tooltip. In the `mounted` hook function, you can add a click event listener for this button and write the method to display the tooltip into this listener. This way, when the user clicks the button, the callback event will be triggered, executing the method to display the tooltip.

[0063] By using Vue's `mounted` hook to write event listeners after the DOM has finished rendering, you can effectively implement the interactive logic of the front-end page, improving user experience and development efficiency. You can start listening for relevant events immediately after the component finishes rendering, avoiding omissions. Each component or page only needs to write the required methods, without overwriting or affecting each other. Furthermore, there are no redundant or unused event listeners before the component is rendered.

[0064] In some embodiments, the step of writing the general methods and homepage usage methods corresponding to each front-end page into the listener events to obtain the callback events corresponding to each front-end page includes:

[0065] After performing the open or jump to the target page operation on each front-end page, the general method and homepage usage method corresponding to the target page are written into the listener event to obtain the callback event corresponding to each front-end page.

[0066] In this embodiment, when a user opens or navigates to a target page on a front-end page, this typically means that the user's action has triggered a change in the page's state. At this point, a specific event mechanism or route navigation hooks can be used to detect this change. Once a page navigation or opening operation is detected, the corresponding methods for the target page can be written into the listener event in the appropriate processing logic. These methods include general methods and homepage usage methods. The purpose of this is to execute specific methods of the target page when a specific event occurs, thereby implementing the interaction logic related to the target page.

[0067] For example, when navigating from page A to page B, the initialization method or specific interaction method of page B can be written into a global event listener within the navigation logic of page A. Once page B has finished loading, this event listener will trigger the corresponding callback event, executing the methods on page B, thus achieving seamless transitions and interactions between pages.

[0068] This approach allows for the establishment of flexible interaction mechanisms between different front-end pages, improving the user experience and scalability of the application. It also enables better management of state and data transfer between pages, making application development more efficient and reliable.

[0069] In some embodiments, after performing the redirection to the target page operation on each front-end page, the general method and homepage usage method corresponding to the target page are written to the listener event, including the following steps:

[0070] First, before performing the page redirection operation, determine whether the callback event corresponding to the current page needs to be destroyed;

[0071] In this embodiment, in actual use, there may be scenarios involving page navigation. For example, if a listener event has been written and a WebSocket connection has been established on page 1, and navigation will destroy page 1, then before performing the navigation action, the characteristics of the listener event can be used to choose whether to destroy the callback event created on page 1. The above judgment can be based on whether the callback event corresponding to the current page is a global tooltip-like event. If so, it does not need to be destroyed; otherwise, it needs to be destroyed.

[0072] Then, if it is determined that the callback event corresponding to the current page needs to be destroyed, the callback event corresponding to the current page is destroyed, and the redirection to the target page is performed;

[0073] In this embodiment, if destruction is not required, it indicates an event similar to a global notification. After page navigation, the event listener can be triggered without rewriting it, and the target page navigation operation is executed. If the event is an event applied independently to page 1, i.e., not a global notification, the event listener can be destroyed along with the current page, so that the original page's event listener will not be triggered after page navigation.

[0074] Finally, after the redirection to the target page is completed, the general method corresponding to the target page and the homepage usage method are written into the listener event.

[0075] In this embodiment, assuming the target page is page 2, after navigating to page 2, the Vue lifecycle is utilized to execute the write event listener operation through the mounted hook function after the DOM element is rendered. This allows the listener to start listening for the corresponding events immediately after page 2 finishes rendering, avoiding any omissions.

[0076] Before performing a navigation, the characteristics of event listeners can be used to choose whether to destroy the event listeners created on the current page. If the event is a global tooltip-like event, it doesn't need to be destroyed; it will trigger again after the page navigation without needing to rewrite the listener. If it's an event independently applied to a page, the listener is destroyed along with the page, so the original page's listener won't be triggered after the page navigation. After navigating to the target page, the operation of writing the listener can be performed, allowing listening for the corresponding events to begin immediately after the page finishes rendering. Public methods in the WebSocket connection callback don't need to be repeatedly written across different pages, reducing code duplication.

[0077] In some embodiments, the destruction of the callback event corresponding to the current page includes:

[0078] Destroy the homepage usage methods in the callback event corresponding to the current page, and retain the general methods in the callback event corresponding to the current page;

[0079] Accordingly, writing the general method and homepage usage method corresponding to the target page into the listener event includes: taking the general method in the callback event corresponding to the current page as the general method corresponding to the target page, and writing the homepage usage method corresponding to the target page into the listener event.

[0080] In this embodiment, before the current page is destroyed, the methods used only on the homepage in the listener events (i.e., the homepage usage methods) are destroyed, while the general methods corresponding to the current page are retained. This ensures that unused methods are not called in subsequent use, and that the general methods do not need to be rewritten. After the page redirection to the target page is completed, the methods used only on the target page and the homepage usage methods corresponding to the target page are written in the listener events. At the same time, the general methods can also be called.

[0081] During use, the general method can complete the writing when the WebSocket connection is established on the current page and can be called normally during full-featured use, thus avoiding duplicate writing. When each page and component is opened or called, an independent homepage usage method is written in the listener event for its own use only, and the homepage usage method is destroyed when the page is destroyed, to avoid triggering callback methods that could cause errors due to missing component data.

[0082] In some embodiments, the method further includes: destroying the callback event corresponding to the component in the listener event when the component in each front-end page is closed.

[0083] In this embodiment, to destroy the callback events corresponding to the component in the event listener, this can be handled in the component's destruction lifecycle hook function (beforeDestroy or destroyed). In these hook functions, methods such as removing the event listener or unsubscribing can be used to ensure that callback events associated with the component are no longer triggered. This ensures application performance and stability, avoiding potential problems caused by undestroyed callback events. It also helps to better manage application resources and state, improving development efficiency and user experience.

[0084] For example, if you add a click event listener to an element in the mounted hook of a component and write the corresponding handling method into the listener, you can use the removeEventListener method in the beforeDestroy hook of the component to remove the click event listener, thereby destroying the corresponding callback event of the component.

[0085] In some embodiments, the method further includes: disconnecting the WebSocket connection and destroying the listening event when leaving the respective front-end pages or preset nodes.

[0086] In this embodiment, the aforementioned preset nodes can be specific nodes, such as page unload event nodes, route change events, etc. Page unload events can be used to perform cleanup operations. Within these event handlers, methods for closing the WebSocket connection can be called, and related listener events can be removed. If a front-end routing framework is used, route change events can be listened to. When a route changes, it is determined whether the user has left a specific page or node; if so, the WebSocket connection is disconnected and the listener events are destroyed.

[0087] When leaving the front-end page or a predefined node, disconnecting the WebSocket connection and destroying the listener event prevents the receipt of WebSocket callback information, thus improving application performance, stability, and maintainability. Writing different method calls within the same listener event will not overwrite previous methods; instead, multiple methods will exist simultaneously and execute sequentially. Destroying the corresponding methods in the listener event when leaving the page or other node avoids the current page's methods affecting other pages, while also preserving previously written methods.

[0088] The following provides a detailed explanation of the solution using specific examples. Please refer to [link / reference]. Figure 3 , Figure 3 The diagram illustrates a detailed process of WebSocket connection callback according to an embodiment of this application.

[0089] First, create a global event listener.

[0090] Then, trigger the WebSocket connection, trigger the listener event in the callback method, and write the method to be executed 1 in the listener event.

[0091] Then, navigate to the next page and write method 2 in the event listener. At this point, both method 1 and method 2 will be called during the callback.

[0092] Then, the page is redirected and method 2 is destroyed. At this point, only method 1 is called during the callback.

[0093] Finally, when leaving the page or a specific node, the WebSocket connection is disconnected and the listener event is destroyed, at which point the WebSocket callback information cannot be received.

[0094] In the above implementation, by establishing a listening event and a WebSocket connection between the front-end and back-end, when multiple front-end pages call the WebSocket connection, the listening event is triggered in the callback method corresponding to each front-end page. The common methods and homepage usage methods corresponding to each front-end page are written into the listening event, resulting in callback events for each front-end page. This allows the back-end to call the callback events corresponding to each page in the listening events to achieve callbacks to each front-end page. The common methods are those used in instant messaging, while the homepage usage methods are those used only on the homepage in instant messaging. This method does not directly write the methods to be executed in the WebSocket connection callback; instead, it uses the listening event as an intermediary, first calling the listening event and then calling the actual method to be executed through the listening event. This maintains the immediacy of the WebSocket connection while avoiding the need for repeated modification of callback methods across multiple pages, resulting in low code redundancy and high extensibility. When handling WebSocket callbacks, each page only needs to focus on the processing logic of the current page, without needing to consider the callback processing scenarios of other pages. Each page can independently add methods for WebSocket callbacks without affecting the processing of other pages, making the code project more scalable and more component-based.

[0095] Figure 2 This is a flowchart illustrating the WebSocket connection callback method in one embodiment. It should be understood that, although... Figure 2 The steps in the flowchart are shown sequentially as indicated by the arrows, but these steps are not necessarily executed in the order indicated by the arrows. Unless otherwise specified herein, there is no strict order in which these steps are executed, and they can be performed in other orders. Figure 2 At least some of the steps in the process may include multiple sub-steps or multiple stages. These sub-steps or stages are not necessarily completed at the same time, but can be executed at different times. The execution order of these sub-steps or stages is not necessarily sequential, but can be executed in turn or alternately with other steps or at least some of the sub-steps or stages of other steps.

[0096] In one embodiment, such as Figure 4 As shown, a WebSocket connection callback device is provided, which includes an establishment module 410, a triggering module 420, and a writing module 430, wherein:

[0097] Establish module 410 to establish event listeners and WebSocket connections between the front-end and back-end;

[0098] Trigger module 420 is used to trigger the listening event in the callback method corresponding to each front-end page when multiple front-end pages call the WebSocket connection;

[0099] The writing module 430 is used to write the general methods and homepage usage methods corresponding to each front-end page into the listening event respectively, so as to obtain the callback events corresponding to each front-end page. This allows the back-end to call the callback events corresponding to each page in the listening event to achieve the callback of each front-end page when performing a callback. The general methods are methods commonly used in instant messaging, and the homepage usage methods are methods used only on the homepage in instant messaging.

[0100] The writing module 430 includes:

[0101] The first writing unit is used to execute the write listener operation through the mounted hook function when rendering components or pages, utilizing Vue's lifecycle. After the DOM element is rendered, the listener is written to the common methods and homepage usage methods corresponding to each front-end page, and the callback events corresponding to each front-end page are obtained.

[0102] The writing module 430 includes:

[0103] The second writing unit is used to write the general method and homepage usage method corresponding to the target page to the listening event after each front-end page performs the operation of opening or jumping to the target page, so as to obtain the callback event corresponding to each front-end page.

[0104] The second writing unit includes:

[0105] The conditional sub-unit is used to determine whether the callback event corresponding to the current page needs to be destroyed before performing the page jump operation;

[0106] The destroy sub-unit is used to destroy the callback event corresponding to the current page and perform the jump to the target page operation when it is determined that the callback event corresponding to the current page needs to be destroyed.

[0107] The write sub-unit is used to write the general method and homepage usage method corresponding to the target page to the listener event after the operation of jumping to the target page is completed.

[0108] Specifically, the destruction sub-unit is used to destroy the home page usage methods in the callback event corresponding to the current page, while retaining the general methods in the callback event corresponding to the current page.

[0109] The writing sub-unit is specifically used to take the general method in the callback event corresponding to the current page as the general method corresponding to the target page, and write the homepage usage method corresponding to the target page into the listening event.

[0110] This also includes:

[0111] The second destruction module is used to disconnect the WebSocket connection and destroy the listening event when leaving the various front-end pages or preset nodes.

[0112] The WebSocket connection callback device includes a processor and a memory. The establishment module 410, triggering module 420 and writing module 430 are all stored in the memory as program units. The processor executes the program modules stored in the memory to implement the corresponding functions.

[0113] The processor contains a kernel, which retrieves the corresponding program unit from memory. One or more kernels can be configured, and the WebSocket connection callback methods can be implemented by adjusting kernel parameters.

[0114] The memory may include non-permanent memory in computer-readable media, such as random access memory (RAM) and / or non-volatile memory, such as read-only memory (ROM) or flash RAM, and the memory includes at least one memory chip.

[0115] This application provides a machine-readable storage medium storing a program that, when executed by a processor, implements the WebSocket connection callback method described above.

[0116] This application provides a processor for running a program, wherein the program executes the WebSocket connection callback method described above.

[0117] In one embodiment, a computer device is provided, which may be a terminal, and its internal structure diagram may be as follows: Figure 5As shown, the computer device includes a processor A01, a network interface A02, a display screen A04, an input device A05, and a memory (not shown) connected via a system bus. The processor A01 provides computing and control capabilities. The memory includes internal memory A03 and a non-volatile storage medium A06. The non-volatile storage medium A06 stores an operating system B01 and a computer program B02. The internal memory A03 provides an environment for the operation of the operating system B01 and the computer program B02 stored in the non-volatile storage medium A06. The network interface A02 is used for communication with external terminals via a network connection. When the computer program is executed by the processor A01, it implements a WebSocket connection callback method. The display screen A04 can be an LCD screen or an e-ink display screen. The input device A05 can be a touch layer covering the display screen, buttons, a trackball, or a touchpad mounted on the computer device casing, or an external keyboard, touchpad, or mouse.

[0118] Those skilled in the art will understand that Figure 5 The structure shown is merely a block diagram of a portion of the structure related to the present application and does not constitute a limitation on the computer device to which the present application is applied. Specific computer devices may include more or fewer components than those shown in the figure, or combine certain components, or have different component arrangements.

[0119] In one embodiment, the workflow approval processing device provided in this application can be implemented as a computer program, and the computer program can be implemented in the form of, for example, Figure 5 It runs on the computer device shown. The computer device's memory can store the various program modules that make up the process approval and processing unit, for example, Figure 4 The shown modules are the creation module 410, the trigger module 420, and the writing module 430. The computer program comprised of these modules causes the processor to execute the steps of the process approval method described in the various embodiments of this application.

[0120] Figure 5 The computer device shown can be used as follows Figure 4 The establishment module 410 in the process approval processing device shown executes step 210. The computer device can execute step 220 through the trigger module 420 and step 230 through the writing module 430.

[0121] This application also provides a computer program product, which, when executed on a data processing device, is suitable for executing a program that initializes the following method steps:

[0122] Establish event listeners and WebSocket connections between the front-end and back-end;

[0123] When multiple front-end pages call the WebSocket connection, the listening event is triggered in the callback method corresponding to each front-end page;

[0124] The common methods and homepage usage methods corresponding to each front-end page are written into the listening events to obtain the callback events corresponding to each front-end page. This allows the back-end to call the callback events corresponding to each page in the listening events to achieve the callback of each front-end page when performing a callback. The common methods are methods that are common in instant messaging, and the homepage usage methods are methods that are only used on the homepage in instant messaging.

[0125] In one embodiment, the step of writing the general methods and homepage usage methods corresponding to each front-end page into the listener event to obtain the callback event corresponding to each front-end page includes:

[0126] When rendering components or pages, Vue's lifecycle is utilized. After the DOM elements are rendered, the `mounted` hook function is used to execute the operation of writing listener events. This allows the common methods and homepage usage methods corresponding to each front-end page to be written into the listener events, thus obtaining the callback events corresponding to each front-end page.

[0127] In one embodiment, the step of writing the general methods and homepage usage methods corresponding to each front-end page into the listener event to obtain the callback event corresponding to each front-end page includes:

[0128] After performing the open or jump to the target page operation on each front-end page, the general method and homepage usage method corresponding to the target page are written into the listener event to obtain the callback event corresponding to each front-end page.

[0129] In one embodiment, after each front-end page performs a redirection to the target page operation, the general method and homepage usage method corresponding to the target page are written to the listener event, including:

[0130] Before performing a page redirection operation, determine whether the callback event corresponding to the current page needs to be destroyed;

[0131] If it is determined that the callback event corresponding to the current page needs to be destroyed, destroy the callback event corresponding to the current page and perform the redirection to the target page.

[0132] After the operation of redirecting to the target page is completed, the general method and homepage usage method corresponding to the target page are written into the listener event.

[0133] In one embodiment, the destruction of the callback event corresponding to the current page includes:

[0134] Destroy the homepage usage methods in the callback event corresponding to the current page, and retain the general methods in the callback event corresponding to the current page;

[0135] The step of writing the general method and homepage usage method corresponding to the target page into the listener event includes:

[0136] The general method in the callback event corresponding to the current page is used as the general method corresponding to the target page, and the homepage usage method corresponding to the target page is written into the listener event.

[0137] In one embodiment, it also includes:

[0138] When leaving the respective front-end pages or preset nodes, disconnect the WebSocket connection and destroy the listening event.

[0139] Those skilled in the art will understand that embodiments of this application can be provided as methods, systems, or computer program products. Therefore, this application can take the form of a completely hardware embodiment, a completely software embodiment, or an embodiment combining software and hardware aspects. Furthermore, this application can take the form of a computer program product embodied on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0140] This application is described with reference to flowchart illustrations and / or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of this application. It will be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, special-purpose computer, embedded processor, or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable data processing apparatus, generate instructions for implementing the flowchart... Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.

[0141] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing device to function in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means, which are implemented in a process Figure 1 One or more processes and / or boxes Figure 1The function specified in one or more boxes.

[0142] These computer program instructions may also be loaded onto a computer or other programmable data processing equipment to cause a series of operational steps to be performed on the computer or other programmable equipment to produce a computer-implemented process, thereby providing instructions that execute on the computer or other programmable equipment for implementing the process. Figure 1 One or more processes and / or boxes Figure 1 The steps of the function specified in one or more boxes.

[0143] In a typical configuration, a computing device includes one or more processors (CPU), input / output interfaces, network interfaces, and memory.

[0144] Memory may include non-persistent memory in computer-readable media, such as random access memory (RAM) and / or non-volatile memory, such as read-only memory (ROM) or flash RAM. Memory is an example of computer-readable media.

[0145] Computer-readable media include both permanent and non-permanent, removable and non-removable media, which can store information using any method or technology. Information can be computer-readable instructions, data structures, modules of programs, or other data. Examples of computer storage media include, but are not limited to, phase-change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technologies, CD-ROM, digital versatile optical disc (DVD) or other optical storage, magnetic tape, magnetic disk storage or other magnetic storage devices, or any other non-transferable medium that can be used to store information accessible by a computing device. As defined herein, computer-readable media does not include transient computer-readable media, such as modulated data signals and carrier waves.

[0146] It should also be noted that the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such process, method, article, or apparatus. Unless otherwise specified, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes that element.

[0147] The above are merely embodiments of this application and are not intended to limit the scope of this application. Various modifications and variations can be made to this application by those skilled in the art. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of this application should be included within the scope of the claims of this application.

Claims

1. A WebSocket connection callback method, characterized in that, The WebSocket connection callback method comprises: establishing a listening event and a WebSocket connection between a front end and a back end; when multiple front end pages call the WebSocket connection, triggering the listening event in a corresponding callback method of each front end page; writing a general method and a homepage use method corresponding to each front end page into the listening event respectively to obtain a callback event corresponding to each front end page, so that the back end realizes callback of each front end page by calling the callback event corresponding to each page in the listening event when performing callback, the general method being a general method in instant messaging, and the homepage use method being a method used only in the homepage in instant messaging.

2. The method of claim 1, wherein, The writing of the general method and the homepage use method corresponding to each front end page into the listening event respectively to obtain the callback event corresponding to each front end page comprises: when rendering a component or a page, using a lifecycle of Vue, after a DOM element is rendered, executing the operation of writing into the listening event through a mounted hook function to write the general method and the homepage use method corresponding to each front end page into the listening event respectively to obtain the callback event corresponding to each front end page.

3. The method of claim 1, wherein, The writing of the general method and the homepage use method corresponding to each front end page into the listening event respectively to obtain the callback event corresponding to each front end page comprises: after executing an opening or jumping operation of a target page in each front end page, writing the general method and the homepage use method corresponding to the target page into the listening event to obtain the callback event corresponding to each front end page.

4. The method of claim 3, wherein, After executing a jumping operation of a target page in each front end page, writing the general method and the homepage use method corresponding to the target page into the listening event comprises: before executing the jumping operation of the page, judging whether the callback event corresponding to a current page needs to be destroyed; in a case where it is determined that the callback event corresponding to the current page needs to be destroyed, destroying the callback event corresponding to the current page and executing the jumping operation of the target page; after the jumping operation of the target page is completed, writing the general method and the homepage use method corresponding to the target page into the listening event.

5. The method of claim 4, wherein, The destroying of the callback event corresponding to the current page comprises: destroying the homepage use method in the callback event corresponding to the current page and retaining the general method in the callback event corresponding to the current page; The writing of the general method and the homepage use method corresponding to the target page into the listening event comprises: taking the general method in the callback event corresponding to the current page as the general method corresponding to the target page and writing the homepage use method corresponding to the target page into the listening event.

6. The method of claim 1, wherein, Further comprising: when leaving each front end page or a preset node, disconnecting the WebSocket connection and destroying the listening event.

7. A WebSocket connection callback apparatus, characterized by The WebSocket connection callback device comprises: an establishing module configured to establish a listening event and a WebSocket connection between a front end and a back end; The triggering module is configured to trigger the listening event in a callback method corresponding to each front-end page when multiple front-end pages call the WebSocket connection. The writing module is configured to write a general method and a home page usage method corresponding to each front-end page into the listening event respectively to obtain a callback event corresponding to each front-end page, so that the back end realizes the callback of each front-end page by calling the callback event corresponding to each page in the listening event when performing the callback, the general method is a general method in instant messaging, and the home page usage method is a method used only in the home page in instant messaging.

8. A processor, comprising: The WebSocket connection callback method according to any one of claims 1 to 6 is configured to be executed.

9. A machine-readable storage medium having stored thereon instructions, the instructions being executable by a machine to cause the machine to perform operations comprising: The instruction, when executed by a processor, causes the processor to be configured to execute the WebSocket connection callback method according to any one of claims 1 to 6.

10. A computer program product comprising a computer program, characterized in that, The computer program, when executed by a processor, realizes the WebSocket connection callback method according to any one of claims 1 to 6.

Images