Information calling method and device, electronic equipment and storage medium
By encapsulating front-end components outside of the main components, information mounting and retrieval are achieved, solving the problem of adding new functions to components affecting existing business operations and improving business reliability and security.
Patent Information
- Application Number
- CN202110528333.1
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2021-05-14
- Publication Date
- 2026-02-03
- Estimated Expiration
- 2041-08-02
AI Technical Summary
In existing technologies, adding new features to components can easily affect existing external business operations, leading to reduced business reliability.
By encapsulating a front-end component outside the first component, the second component can mount the corresponding information of the properties and/or methods of the first component, and reference the first component through the front-end component. The second component can obtain this information from the front-end component, thus avoiding direct intrusion into the internal logic of the first component.
Adding new functionality to components without impacting existing business operations improves the reliability and security of those operations.
Smart Images

Figure CN115344296B_ABST
Abstract
Description
Technical Field
[0001] This disclosure relates to the field of computer technology, and in particular to an information retrieval method, apparatus, electronic device, and storage medium. Background Technology
[0002] With the development of computer technology, developers often embed components into web pages to enrich their content and functionality. For example, embedding a player component into a web page can meet the needs of playing audio and video.
[0003] When components are first developed, they often lack certain features, such as error reporting. Adding new features to a component through secondary development can often impact existing external business operations. For example, it might prevent other components from accessing the component's information correctly, leading to reduced business reliability. Summary of the Invention
[0004] This disclosure provides an information retrieval method, apparatus, electronic device, and storage medium to at least solve the problem that adding new functions to components affects existing external services and reduces service reliability. The technical solution of this disclosure is as follows:
[0005] According to a first aspect of the present disclosure, an information retrieval method is provided, applied to a terminal. The terminal includes a front-end component, a first component, and a second component. The front-end component is a higher-order component that encapsulates the first component. The front-end component references the first component, and the second component references the front-end component. The method may include:
[0006] Mount the information corresponding to the properties and / or methods of the first component to the front-end component;
[0007] When the second component calls the properties and / or methods of the first component, the second component obtains the information corresponding to the properties and / or methods of the first component from the front-end component.
[0008] In one embodiment, the front-end component is configured with target parameters, and the aforementioned step of attaching information corresponding to the attributes and / or methods of the first component to the front-end component may specifically include:
[0009] Assign the information corresponding to the properties and / or methods of the first component to the target parameter;
[0010] Accordingly, the step of the second component obtaining information corresponding to the attributes and / or methods of the first component from the front-end component may specifically include:
[0011] The second component obtains the assignment information corresponding to the target parameter from the front-end component.
[0012] In some embodiments of the first aspect, the information retrieval method described above may further include:
[0013] Mount the properties of the second component and their corresponding information to the front-end component;
[0014] When the first component calls the property of the second component, the first component obtains the information corresponding to the property of the second component from the front-end component.
[0015] In one embodiment, the front-end component further includes a first object, and the step of attaching the attributes of the second component and its corresponding information to the front-end component as described above may specifically include:
[0016] The front-end component assigns the properties of the second component and their corresponding information to the first object;
[0017] Accordingly, the step described above, in which the first component obtains information corresponding to the attributes of the second component from the front-end component, may specifically include:
[0018] The first component obtains the information corresponding to the attributes of the second component based on the assignment information of the first object.
[0019] In one embodiment, the front-end component further includes a second object, which is used to bind at least one event in the first component to its corresponding processing function. The information retrieval method mentioned above may also include:
[0020] The front-end component listens for events triggered in the first component;
[0021] If it is determined that the target event in the first component has been triggered, the front-end component determines the target handler function bound to the target event based on the second object;
[0022] If the second component includes a target handling function, the second component obtains the target event from the front-end component and handles the target event according to the target handling function.
[0023] Based on this, in one embodiment, when the target event is an error event, the target handling function is an error event handling function. After the front-end component determines the target handling function bound to the target event based on the second object, the aforementioned information retrieval method may further include:
[0024] The front-end component uploads information corresponding to the error event based on the error event handling function.
[0025] In one embodiment, the step of uploading information corresponding to the above-mentioned error event may specifically include:
[0026] Send the information corresponding to the error event to the target terminal; and / or,
[0027] Based on the interface of the first component corresponding to the error event, the system performs analysis and statistics on the two dimensions of error count and time, generates an error event analysis graph, and sends the error event analysis graph to the target terminal.
[0028] The target terminal is the terminal that handles error events.
[0029] According to a second aspect of the present disclosure, an information retrieval device is provided, applied to a terminal. The terminal includes a front-end component, a first component, and a second component. The front-end component is a higher-order component that encapsulates the first component. The front-end component references the first component, and the second component references the front-end component. The device may include:
[0030] The information mounting module is configured to mount the information corresponding to the properties and / or methods of the first component to the front-end component;
[0031] The information retrieval module is configured to, when the second component calls the properties and / or methods of the first component, retrieve the information corresponding to the properties and / or methods of the first component from the front-end component.
[0032] In one embodiment, the front-end component is configured with target parameters, and the aforementioned information mounting module may specifically include:
[0033] The first assignment submodule is configured to assign information corresponding to the properties and / or methods of the first component to the target parameter;
[0034] Accordingly, the information acquisition module mentioned above may specifically include:
[0035] The first submodule is configured to execute the second component to retrieve the assignment information corresponding to the target parameter from the front-end component.
[0036] In one embodiment, the aforementioned information retrieval device may further include:
[0037] The property mounting module is configured to mount the properties of the second component and their corresponding information to the front-end component;
[0038] The attribute retrieval module is configured to retrieve the information corresponding to the attribute of the second component from the front-end component when the first component calls the attribute of the second component.
[0039] In one embodiment, the front-end component further includes a first object, and the aforementioned attribute mounting module may specifically include:
[0040] The second assignment submodule is configured to execute the front-end component to assign the properties of the second component and their corresponding information to the first object;
[0041] Accordingly, the attribute acquisition module mentioned above may specifically include:
[0042] The second acquisition submodule is configured to execute the first component to obtain the information corresponding to the attributes of the second component based on the assignment information of the first object.
[0043] In one embodiment, the front-end component further includes a second object, which is used to bind at least one event in the first component to its corresponding processing function. The aforementioned information retrieval device may also include:
[0044] The event listener module is configured to execute front-end components to listen for events triggered in the first component;
[0045] The function determination module is configured to execute, in the event that the target event in the first component is triggered, the front-end component determines the target handling function bound to the target event based on the second object;
[0046] The event handling module is configured to execute when the second component includes a target handling function, wherein the second component obtains the target event from the front-end component and processes the target event according to the target handling function.
[0047] Based on this, in one embodiment, when the target event is an error event, the target handling function is an error event handling function, and the aforementioned information retrieval device may further include:
[0048] The error upload module is configured to execute after the front-end component determines the target event handler function based on the second object, and then uploads the information corresponding to the error event based on the error event handler function.
[0049] In one embodiment, the aforementioned error upload module may specifically include:
[0050] The event sending submodule is configured to send information corresponding to error events to the target terminal; and / or,
[0051] The analysis graph sending submodule is configured to execute the interface of the first component corresponding to the error event, perform analysis and statistics on the two dimensions of error count and time, generate an error event analysis graph, and send the error event analysis graph to the target terminal;
[0052] The target terminal is the terminal that handles error events.
[0053] According to a third aspect of the present disclosure, an electronic device is provided, the electronic device comprising:
[0054] processor;
[0055] Memory used to store processor-executable instructions;
[0056] The processor is configured to execute execution instructions to implement the information retrieval method as shown in any embodiment of the first aspect.
[0057] According to a fourth aspect of the present disclosure, a computer-readable storage medium is provided that, when instructions in the computer-readable storage medium are executed by a processor of an information retrieval device, causes the information retrieval device to implement the information retrieval method as shown in any embodiment of the first aspect.
[0058] According to a fifth aspect of the present disclosure, a computer program product is provided, the computer program product including a computer program stored in a computer-readable storage medium, wherein at least one processor of the device reads from the computer-readable storage medium and executes the computer program, causing the device to perform the information retrieval method shown in any embodiment of the first aspect.
[0059] The technical solutions provided by the embodiments of this disclosure have at least the following beneficial effects:
[0060] This embodiment of the disclosure sets up a front-end component to encapsulate a first component, and by referencing the first component in the front-end component, the information corresponding to the attributes and / or methods of the first component is mounted to the front-end component. This allows the second component to obtain the information corresponding to the attributes and / or methods of the first component simply by referencing the front-end component, thereby enabling the invocation of the attributes and / or methods of the first component. In this way, without intruding on the processing logic of the first component itself, when adding new functions to the first component, the second component can still call the information of the first component normally, thus not affecting the existing external business of the component and improving business reliability.
[0061] It should be understood that the above general description and the following detailed description are exemplary and explanatory only, and are not intended to limit this disclosure. Attached Figure Description
[0062] The accompanying drawings, which are incorporated in and form part of this specification, illustrate embodiments consistent with this disclosure and, together with the description, serve to explain the principles of this disclosure, and are not intended to unduly limit this disclosure.
[0063] Figure 1 This is an architecture diagram illustrating an information retrieval method according to an exemplary embodiment;
[0064] Figure 2 This is a flowchart illustrating an information retrieval method according to an exemplary embodiment;
[0065] Figure 3This is a flowchart illustrating another information retrieval method according to an exemplary embodiment;
[0066] Figure 4 This is a schematic diagram illustrating an information retrieval method according to an exemplary embodiment;
[0067] Figure 5 This is a structural block diagram of an information retrieval device according to an exemplary embodiment;
[0068] Figure 6 This is a structural block diagram of an electronic device according to an exemplary embodiment. Detailed Implementation
[0069] To enable those skilled in the art to better understand the technical solutions of this disclosure, the technical solutions in the embodiments of this disclosure will be clearly and completely described below with reference to the accompanying drawings.
[0070] It should be noted that the terms "first," "second," etc., used in the specification, claims, and accompanying drawings of this disclosure are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments of this disclosure described herein can be implemented in orders other than those illustrated or described herein. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with this disclosure. Rather, they are merely examples of apparatuses and methods consistent with some aspects of this disclosure as detailed in the appended claims.
[0071] The information retrieval method provided in this disclosure can be applied to, for example... Figure 1 In the architecture, specifically combined Figure 1 Please provide a detailed explanation.
[0072] The information retrieval method in this embodiment can be specifically applied to a web page with a first component, which can be a player. In the prior art, when a player in a web page plays audio or video, the player may report errors due to network issues. Existing error-reporting mechanisms need to be implemented internally within the player, thus requiring modification of the internal component logic to implement the error-reporting function. To address the low security of existing services caused by intrusive modifications to the internal logic of components in the prior art, this disclosure provides an information retrieval method.
[0073] Figure 1 This is an architecture diagram illustrating an information retrieval method according to an exemplary embodiment.
[0074] like Figure 1As shown in the diagram, the architecture may include a first component 11, a front-end component 12, and a second component 13. The first component 11 and the second component 13 can exchange information through the front-end component 12. The first component 11 can be any component in the web page, such as a player; the front-end component 12 can be a higher-order component that encapsulates the first component, such as a code package; and the second component 13 can be a related component in the web page that has business interactions with the first component 11, such as a data source component corresponding to the player.
[0075] Based on the above architecture, when adding new functions to the first component, that is, during the secondary development process, in order to avoid directly intrusive modifications to the first component, a front-end component can be encapsulated outside the first component, and the corresponding new functions can be implemented in the front-end component. However, the encapsulated first component cannot transmit business information with the external second component, which may affect the existing external business of the first component and reduce business reliability.
[0076] Therefore, to avoid impacting the existing external business of the first component and to improve business reliability, this disclosure embodiment implements information retrieval between components in the following manner. For example... Figure 1 As shown, given that front-end component 12 references first component 11 and second component 13 references front-end component 12, when a user opens a web page with first component 11 configured, the information corresponding to the properties and / or methods of first component 11 can be mounted to front-end component 12. Then, when second component 13 calls the properties and / or methods of first component 11, second component 13 obtains the information corresponding to the properties and / or methods of first component 11 from front-end component 12. In other words, for second component 13, front-end component 12 is equivalent to first component 11, making it seamless for the business logic.
[0077] In this way, even when adding new functionality to the first component by encapsulating it with a front-end component, the second component can still call the information of the first component normally, thus not affecting the existing external business of the first component and improving the reliability of the business.
[0078] Based on this, taking the player as an example, the information retrieval method provided in this embodiment can specifically include: when a user opens a browser to browse a specific webpage with a player component, the player can obtain data from an external data source and play it. During playback, when other components with business relationships with the player need to call the attributes and / or methods of the first component during operation, they can directly obtain the information corresponding to the attributes and / or methods mounted on the first component from the front-end component. This ensures that the player's external business is not affected.
[0079] Based on the above architecture and application scenarios, the following will combine... Figures 2-6 The information retrieval method provided in this disclosure embodiment will be described in detail. This information retrieval method can be configured by the user by browsing settings. Figure 1 The first component 11 shown is executed by the device used when creating the web page.
[0080] Figure 2 This is a flowchart illustrating an information retrieval method according to an exemplary embodiment.
[0081] like Figure 2 As shown, the information retrieval method may specifically include the following steps:
[0082] First, in step 210, the information corresponding to the properties and / or methods of the first component is mounted to the front-end component.
[0083] Next, in step 220, if the second component calls the properties and / or methods of the first component, the second component obtains the information corresponding to the properties and / or methods of the first component from the front-end component.
[0084] Therefore, by setting up a front-end component to encapsulate the first component, and by referencing the first component in the front-end component, the information corresponding to the properties and / or methods of the first component can be mounted to the front-end component. This allows the second component to simply reference the front-end component to obtain the information corresponding to the properties and / or methods of the first component, thus enabling the calling of the properties and / or methods of the first component. In this way, without intruding on the processing logic of the first component itself, when adding new functions to the first component, the second component can still call the information of the first component normally, thereby not affecting the existing external business of the component and improving business reliability.
[0085] The above steps are explained in detail below:
[0086] First, regarding step 210, in this embodiment of the disclosure, the front-end component is a higher-order component encapsulated outside the first component. The first component can be a component in a web page, such as a player component. Furthermore, mounting can involve adding information from the first component to the front-end component for retrieval by the second component when it is invoked.
[0087] Specifically, the prerequisite for mounting the information corresponding to the properties and / or methods of the first component to the front-end component is that the front-end component references the first component. Here, the reference method can be to declare the first component in the front-end component. In this way, the front-end component can call the information in the first component, including but not limited to the information corresponding to the properties and methods, as well as the parameter information.
[0088] For example, the information corresponding to the properties and / or methods of the first component can be mounted to the front-end component by redefining them. That is, the information corresponding to the properties and / or methods of the first component is redefined and assigned to an intermediate parameter, and the second component obtains this information by calling the intermediate parameter. In this way, the information corresponding to the properties and / or methods of the first component can be passed.
[0089] Next, in step 220, since the information corresponding to the properties and / or methods of the first component has been mounted to the front-end component, the second component can directly obtain the corresponding information from the front-end component when calling the properties and / or methods of the first component.
[0090] For example, a second component may call a property and / or method of the first component, including but not limited to referencing the name of the property and / or the name of the method in the second component.
[0091] In one alternative implementation, a target parameter may be set in the front-end component, and step 210 above may specifically include:
[0092] Assign the information corresponding to the properties and / or methods of the first component to the target parameter;
[0093] Accordingly, step 220 above may specifically include:
[0094] The second component obtains the assignment information corresponding to the target parameter from the front-end component.
[0095] Here, the intermediate parameter used by the front-end component when redefining the information corresponding to the properties and / or methods of the first component can be the target parameter. The target parameter can be any defined parameter, such as the parameter `key`. For example, a property definition function can be used to assign the information corresponding to the properties and / or methods of the first component to the target parameter; this property definition function could be, for example, the `Object.defineProperty` function.
[0096] In a specific example, the `Object.defineProperty` function can be used in the front-end component to assign information corresponding to the properties and / or methods included in the player component to the target parameter `key`. Properties can include, for example, `currentTime`, and methods can include, for example, `play()`. When an external component calls a property or / or method included in the player component—for example, if the external component contains a statement assigning a value to `currentTime` (`this.player.currentTime = 1`), adding 1 to the current value of the `currentTime` property, or calling the `play()` method (`this.player.play()`), the assigned value of the parameter `key` can be directly read, thus obtaining the information corresponding to that property and / or method.
[0097] Therefore, by assigning the information corresponding to the attributes and / or methods of the first component to the target parameters in the front-end component, the second component can invoke the attributes and / or methods in the first component by obtaining the assignment information corresponding to the target parameters. This ensures the smooth transmission of external business logic by the first component, thus achieving seamless integration with external business processes.
[0098] In addition to mounting the attributes and / or methods of the first component to the front-end component to enable external business transmission of the first component, the attributes of the second component can also be mounted to the front-end component to enable internal business transmission from the second component to the first component. That is, in one optional implementation, the information retrieval method provided in this disclosure embodiment may further include:
[0099] Mount the properties of the second component and their corresponding information to the front-end component;
[0100] When the first component calls the property of the second component, the first component obtains the information corresponding to the property of the second component from the front-end component.
[0101] Here, the properties of the second component and their corresponding property values can be mounted to the front-end component. In this way, similar to the process described above, when the first component calls the properties of the second component, the first component can directly obtain the corresponding property information of the second component from the front-end component.
[0102] For example, information corresponding to the properties and / or methods of the first component can be mounted to the front-end component through methods such as attribute binding. That is, the information corresponding to the properties and / or methods of the first component is bound to an intermediate object in the front-end component. The second component can obtain the bound properties and their corresponding property values from the intermediate object of the front-end component. In this way, it is possible to pass properties and their corresponding information from the second component to the first component.
[0103] In this way, by attaching the attributes of the second component and its corresponding information to the front-end component, the internal business transmission from the second component to the first component can be guaranteed, further improving business reliability and security.
[0104] Based on this, the aforementioned front-end components can also include a first object. Correspondingly, the step of attaching the attributes of the second component and its corresponding information to the front-end component can specifically include:
[0105] The front-end component assigns the properties of the second component and their corresponding information to the first object;
[0106] Accordingly, the step of the first component obtaining the information corresponding to the attribute of the second component from the front-end component may specifically include:
[0107] The first component obtains the information corresponding to the attributes of the second component based on the assignment information of the first object.
[0108] Here, the intermediate object used by the front-end component to bind the attributes and corresponding information of the second component can be the first object. The first object can be, for example, the `$attrs` object in the Vue framework. For instance, the `$attrs` object can be used with the `v-bind` directive to assign the attributes and corresponding information of the second component to the `$attrs` object. Here, the `$attrs` object can contain multiple configuration information passed in from the external component, that is, multiple attributes of the second component and their corresponding information, such as the `width` object and its corresponding value 100, and the `height` object and its corresponding value 50.
[0109] In a specific example, the `v-bind` directive, such as `v-bind="$attrs"`, can be used in the front-end component to assign attributes and their corresponding information from an external component to the `$attrs` object. These attributes and their corresponding information could include, for example, the width attribute with its value of 100, and the height attribute with its value of 50. When the player component calls these attributes from the external component—for example, when the player component contains control statements that require adjusting the player's height and width—it can directly read the assigned values from the `$attrs` object in the front-end component to obtain the height and width attributes and their corresponding information.
[0110] Therefore, the first component can receive the attributes and corresponding information passed by the second component through the first object in the front-end component, thus ensuring the information transmission from the second component to the first component and achieving seamless internal business operations.
[0111] In addition, the aforementioned front-end component may also include a second object, which can be used to bind at least one event in the first component to its corresponding processing function. The information retrieval method provided in this embodiment may further include:
[0112] The front-end component listens for events triggered in the first component;
[0113] If the target event in the first component is determined to be triggered, the front-end component determines the target handler function bound to the target event based on the second object;
[0114] If the second component includes a target handling function, the second component obtains the target event from the front-end component and handles the target event according to the target handling function.
[0115] Here, the events triggered in the first component can include error events and normal business events. The first component can re-emit the triggered events through a second object in the front-end component. This second object can be, for example, the `$listeners` object in the Vue framework. The `$listeners` object can be assigned multiple sets of event binding information. Each set of event binding information can include the name of an event and the name of its bound event handler, such as `@play="handlePlay"`, `@error="handleError"`, etc., where `play` and `error` are the event names, and `handlePlay` and `handleError` are the names of the event handlers.
[0116] In a specific example, the `v-on` directive, such as `v-on="$listeners"`, can be used in the front-end component to listen for relevant events in the player component. These events can include, for example, the `play` event and the `error` event. When an event in the player component is triggered, such as when a user clicks play and triggers the `play` event, the front-end component can listen for this event and then pass it to the corresponding bound event handler function `handlePlay` via the `$listeners` object. This allows an external component with the `handlePlay` event handler to retrieve the `play` event from the front-end component and process it using the `handlePlay` function.
[0117] In this way, by using a second object in the front-end component to bind the events in the first component to the corresponding event handling functions, when an event is heard from the first component, the corresponding handling function can be determined according to the binding information, so that the second component containing the handling function can obtain and process the event. This ensures that the existing business is not affected by the secondary development of the component and that the internal and external business can still proceed in an orderly manner.
[0118] Based on this, in an optional implementation, when the target event mentioned above is an error event, the target handling function can be an error event handling function. Accordingly, after the step of the front-end component determining the target handling function bound to the target event based on the second object, the information retrieval method provided in this disclosure embodiment may further include:
[0119] The front-end component uploads information corresponding to the error event based on the error event handling function.
[0120] Here, after the front-end component listens to the event triggered in the first component, if the triggered event is an error event, that is, an error has occurred in the first component, it can directly use the error event handling function defined in the front-end component to report the error event.
[0121] It should be noted that the error reporting function can be a new feature added to the first component. To avoid intrusive modifications to the first component, the error event handling function, such as `handleError`, can be defined directly in the front-end component. In this way, when the front-end component detects an error event (`error`) thrown from the first component, it can use the `handleError` function to report the error event. Specifically, the error event can be uploaded to a server or to other relevant terminals; this is not limited to these options.
[0122] In this way, by utilizing the information corresponding to error events uploaded by the front-end component, error reporting functionality can be added to the first component without intruding on its internal code, thereby avoiding impact on existing business logic and further improving business reliability.
[0123] Based on this, in one optional implementation, the step of uploading information corresponding to the error event may specifically include:
[0124] Send the information corresponding to the error event to the target terminal; and / or, based on the interface of the first component corresponding to the error event, perform analysis and statistics according to the two dimensions of error count and time, generate an error event analysis graph, and send the error event analysis graph to the target terminal; wherein, the target terminal is the terminal that handles the error event.
[0125] Here, the target terminal may be, for example, the terminal used by the developers or maintainers of the first component, and the methods of sending information and / or analysis graphs include, but are not limited to, email, SMS, system messages, etc.
[0126] In one specific embodiment, when the event thrown by the player is an error event, the relevant error information of the error event can be reported through the front-end component encapsulating the player. One approach is to directly upload the information corresponding to the error event to the email address of the developer associated with the error event via the front-end component. Another approach is to generate an error event analysis graph on a per-page basis using the front-end component. That is, for a page corresponding to an error event, the analysis and statistics are performed according to two dimensions: the number of errors and the time, generating an error event analysis graph. This graph is then sent to the email address of the developer associated with the error event, allowing the developer to review the graph and determine the cause of the player error.
[0127] Therefore, the front-end component can directly send the information corresponding to the error event to the target terminal handling the error event, or it can send an error event analysis graph generated by the front-end component based on the number of errors and the time to the target terminal handling the error event. This allows developers to promptly obtain the error information from the first component and find the root cause of the error based on the obtained information or the error event analysis graph, quickly locate the problem, and then handle the error event in a timely manner. In addition, combined with the error event analysis graph, the stability of the data source can be analyzed and fed back to upstream business, forming a virtuous cycle of business stability.
[0128] To explain the event listening and handling process more clearly, an example is given below. For example... Figure 3 As shown, the information retrieval method provided in this embodiment may include steps 310 to 340, as detailed below:
[0129] Step 310: The front-end component listens for events triggered in the first component.
[0130] Step 320: Determine whether the triggered target event is an error event. If yes, proceed to step 330; otherwise, proceed to step 340.
[0131] Step 330: The front-end component uploads the information corresponding to the error event based on the error event handling function.
[0132] Step 340: If the second component includes a target handling function bound to the target event, the second component obtains the target event from the front-end component and processes the target event according to the target handling function.
[0133] For example, when an event emitted by the first component is determined to be a normal business event, the second component is expected to listen to and handle it correctly. Therefore, the event handler function corresponding to the emitted event needs to be passed from the second component to this front-end component. This can be done by using the `$listeners` object in the front-end component to bind the event handler function of the second component to the current component. In this way, when the second component listens for an event, the parameter value corresponding to that event can be associated with the appropriate event handler function, thus completing the event handling within the corresponding second component.
[0134] Therefore, by determining whether the event thrown by the first component is an error event, if the event is an error event, the front-end component will upload the information corresponding to the error event. If the event is not an error event, the front-end component will associate the event with the corresponding event handler function through the listener property, so that the second component corresponding to the event handler function can obtain and continue to process the event, ensuring that the existing business is not affected and proceeds in an orderly manner.
[0135] In a specific embodiment, such as Figure 4 As shown, the properties and methods of the first component 41 can be redefined using the `Object.defineProperty` function in the front-end component 42 for use by the second component. The `$attrs` object in the front-end component 42 can also receive properties passed from the second component for use by the first component 41. Furthermore, when an error event is intercepted through the `$listeners` object in the front-end component 42, error information is reported. This can be done by directly uploading the information corresponding to the error event to the developer's email address, or by generating an error event analysis graph based on the page that triggered the error event (i.e., generating an error event analysis graph according to time and the number of errors) and uploading it to the developer's email address. When a normal event is intercepted through the `$listeners` object in the front-end component 42, the event can be associated with the corresponding event handler function so that the second component corresponding to the event handler function can obtain and process the event. Since the second component is associated with the first component 41, therefore... Figure 4The second component is not illustrated in the text. Furthermore, since the front-end component 42 encapsulates the first component 41, and to avoid affecting the business operations using the first component 41 on the web page, this embodiment sets corresponding attributes in the front-end component 42. This allows the front-end component 42 to transmit information between the first component 41 and the second component through these parameters or objects, acting as a bridge for information transmission between them. Thus, for the first component 41, the front-end component 42 is equivalent to the second component; and for the second component, the front-end component 42 is equivalent to the first component 41. This achieves seamless business operation and has no impact on existing businesses using the first component 41, thereby further improving the security of component usage.
[0136] It should be noted that the application scenarios described in the above embodiments of this disclosure are for the purpose of more clearly illustrating the technical solutions of the embodiments of this disclosure, and do not constitute a limitation on the technical solutions provided by the embodiments of this disclosure. As those skilled in the art will know, with the emergence of new application scenarios, the technical solutions provided by the embodiments of this disclosure are also applicable to similar technical problems.
[0137] Based on the same inventive concept, this disclosure also provides an information retrieval device, which can be applied to a terminal. The terminal may include a front-end component, a first component, and a second component. The front-end component may be a higher-order component that encapsulates the first component, and the front-end component references the first component. The second component references the front-end component. (Specifically combined...) Figure 5 Please provide a detailed explanation.
[0138] Figure 5 This is a schematic diagram of the structure of an information retrieval device according to an example embodiment.
[0139] like Figure 5 As shown, the information retrieval device 50 may specifically include:
[0140] The information mounting module 501 is configured to mount the information corresponding to the properties and / or methods of the first component to the front-end component;
[0141] The information acquisition module 502 is configured to, when the second component calls the properties and / or methods of the first component, the second component acquires the information corresponding to the properties and / or methods of the first component from the front-end component.
[0142] The information retrieval device 50 mentioned above will be described in detail below:
[0143] In one embodiment, the front-end component is configured with target parameters, and the aforementioned information mounting module 501 may specifically include:
[0144] The first assignment submodule is configured to assign information corresponding to the properties and / or methods of the first component to the target parameter;
[0145] Accordingly, the information acquisition module 502 mentioned above may specifically include:
[0146] The first submodule is configured to execute the second component to retrieve the assignment information corresponding to the target parameter from the front-end component.
[0147] In one embodiment, the information retrieval device 50 described above may further include:
[0148] The property mounting module 503 is configured to mount the properties of the second component and their corresponding information to the front-end component;
[0149] The attribute retrieval module 504 is configured to, when the first component calls the attribute of the second component, retrieve the information corresponding to the attribute of the second component from the front-end component.
[0150] In one embodiment, the front-end component further includes a first object, and the aforementioned attribute mounting module 503 may specifically include:
[0151] The second assignment submodule is configured to execute the front-end component to assign the properties of the second component and their corresponding information to the first object;
[0152] Accordingly, the attribute acquisition module 504 mentioned above may specifically include:
[0153] The second acquisition submodule is configured to execute the first component to obtain the information corresponding to the attributes of the second component based on the assignment information of the first object.
[0154] In one embodiment, the front-end component further includes a second object, which is used to bind at least one event in the first component to its corresponding processing function. The aforementioned information retrieval device may also include:
[0155] Event listener module 505 is configured to execute front-end component listeners for events triggered in the first component;
[0156] The function determination module 506 is configured to execute, in the event that the target event in the first component is triggered, the front-end component determines the target handling function bound to the target event based on the second object;
[0157] Event handling module 507 is configured to, when the second component includes a target handling function, retrieve the target event from the front-end component and handle the target event according to the target handling function.
[0158] Based on this, in one embodiment, when the target event is an error event, the target processing function is an error event processing function, and the aforementioned information retrieval device 50 may further include:
[0159] Error upload module 508 is configured to execute after the front-end component determines the target event binding function based on the second object, and then uploads the information corresponding to the error event based on the error event handling function.
[0160] In one embodiment, the error upload module 508 mentioned above may specifically include:
[0161] The event sending submodule is configured to send information corresponding to error events to the target terminal; and / or,
[0162] The analysis graph sending submodule is configured to execute the interface of the first component corresponding to the error event, perform analysis and statistics on two dimensions: the number of errors and time, generate an error event analysis graph, and send the error event analysis graph to the target terminal;
[0163] The target terminal is the terminal that handles error events.
[0164] Therefore, by setting up a front-end component to encapsulate the first component, and by referencing the first component in the front-end component, the information corresponding to the properties and / or methods of the first component can be mounted to the front-end component. This allows the second component to simply reference the front-end component to obtain the information corresponding to the properties and / or methods of the first component, thus enabling the calling of the properties and / or methods of the first component. In this way, without intruding on the processing logic of the first component itself, when adding new functions to the first component, the second component can still call the information of the first component normally, thereby not affecting the existing external business of the component and improving business reliability.
[0165] Based on the same inventive concept, this disclosure also provides an electronic device, specifically combined with... Figure 6 Please provide a detailed explanation.
[0166] Figure 6 This is a structural block diagram of an electronic device according to an exemplary embodiment.
[0167] like Figure 6 The diagram shown is a structural diagram of an exemplary hardware architecture of an electronic device 60 capable of implementing the information retrieval method and information retrieval device in the embodiments of this disclosure.
[0168] The electronic device 60 may include a processor 601 and a memory 602 storing computer program instructions.
[0169] Specifically, the processor 601 may include a central processing unit (CPU), an application-specific integrated circuit (ASIC), or one or more integrated circuits that can be configured to implement the embodiments of this application.
[0170] Memory 602 may include a large-capacity storage for information or instructions. For example, and not limitingly, memory 602 may include a hard disk drive (HDD), a floppy disk drive, flash memory, optical disk, magneto-optical disk, magnetic tape, or a universal serial bus (USB) drive, or a combination of two or more of these. Where appropriate, memory 602 may include removable or non-removable (or fixed) media. Where appropriate, memory 602 may be internal or external to the integrated gateway device. In a particular embodiment, memory 602 is a non-volatile solid-state memory. In a particular embodiment, memory 602 includes read-only memory (ROM). Where appropriate, the ROM may be a mask-programmed ROM, a programmable ROM (PROM), an erasable PROM (EPROM), an electrically erasable PROM (EEPROM), an electrically rewritable ROM (EAROM), or flash memory, or a combination of two or more of these.
[0171] Processor 601 performs the following steps by reading and executing computer program instructions stored in memory 602:
[0172] Processor 601 executes the process of mounting information corresponding to the properties and / or methods of the first component to the front-end component; when the second component calls the properties and / or methods of the first component, the second component obtains the information corresponding to the properties and / or methods of the first component from the front-end component.
[0173] In one embodiment, the processor 601 further performs the task of assigning information corresponding to the attributes and / or methods of the first component to the target parameter; the second component obtains the assignment information corresponding to the target parameter from the front-end component.
[0174] In one embodiment, the processor 601 further performs the action of mounting the attributes of the second component and their corresponding information to the front-end component; when the first component calls the attributes of the second component, the first component obtains the information corresponding to the attributes of the second component from the front-end component.
[0175] In one embodiment, the processor 601 further executes the front-end component to assign the attributes of the second component and their corresponding information to the first object; the first component obtains the information corresponding to the attributes of the second component based on the assignment information of the first object.
[0176] In one embodiment, the processor 601 further executes a front-end component to listen for events triggered in the first component; if it is determined that a target event in the first component has been triggered, the front-end component determines a target handling function bound to the target event based on a second object; if the second component includes a target handling function, the second component obtains the target event from the front-end component and processes the target event according to the target handling function.
[0177] In one embodiment, the processor 601 also executes the front-end component to upload information corresponding to the error event based on the error event handling function.
[0178] In one embodiment, the processor 601 further performs the following actions: sending information corresponding to the error event to the target terminal; and / or, based on the interface of the first component corresponding to the error event, performing analysis and statistics on two dimensions, namely the number of errors and time, generating an error event analysis graph, and sending the error event analysis graph to the target terminal; wherein, the target terminal is the terminal that processes the error event.
[0179] In one example, the electronic device 60 may further include a transceiver 603 and a bus 604. Wherein, as... Figure 6 As shown, the processor 601, memory 602 and transceiver 603 are connected via bus 604 and communicate with each other.
[0180] Bus 604 includes hardware, software, or both. For example, and not limitingly, the bus may include an Accelerated Graphics Port (AGP) or other graphics bus, an Enhanced Industry Standard Architecture (EISA) bus, a Front Side Bus (FSB), HyperTransport (HT) interconnect, an Industry Standard Architecture (ISA) bus, an Infinite Bandwidth Interconnect, a Low Pin Count (LPC) bus, a memory bus, a Microchannel Architecture (MCA) bus, a Peripheral Control Interconnect (PCI) bus, a PCI-Express (PCI-X) bus, a Serial Advanced Technology Attachment (SATA) bus, a Video Electronics Standards Association Local (VLB) bus, or other suitable buses, or combinations of two or more of these. Where appropriate, bus 604 may include one or more buses. Although specific buses are described and illustrated in embodiments of this application, this application contemplates any suitable bus or interconnect.
[0181] This disclosure also provides a computer-readable storage medium storing computer-executable instructions for implementing the information retrieval method described in this disclosure.
[0182] In some possible implementations, various aspects of the methods provided in this disclosure may also be implemented as a program product comprising program code that, when run on a computer device, causes the computer device to perform the steps of the methods according to various exemplary embodiments of this disclosure as described above, for example, the computer device may perform the information retrieval method described in embodiments of this disclosure.
[0183] The program product may employ any combination of one or more readable media. A readable medium may be a readable signal medium or a readable storage medium. A readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination thereof. More specific examples of readable storage media (a non-exhaustive list) include: an electrical connection having one or more wires, a portable disk, a hard disk, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination thereof.
[0184] This disclosure is described with reference to flowchart illustrations and / or block diagrams of methods, apparatus, and computer program products according to this disclosure. 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 information processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable information processing apparatus, generate instructions for implementing the flowchart illustrations. Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.
[0185] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable information 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 1 The function specified in one or more boxes.
[0186] These computer program instructions may also be loaded onto a computer or other programmable information 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 1One or more processes and / or boxes Figure 1 The steps of the function specified in one or more boxes.
[0187] Other embodiments of this disclosure will readily occur to those skilled in the art upon consideration of the specification and practice of the invention disclosed herein. This application is intended to cover any variations, uses, or adaptations of this disclosure that follow the general principles of this disclosure and include common knowledge or customary techniques in the art not disclosed herein. The specification and examples are to be considered exemplary only, and the true scope and spirit of this disclosure are indicated by the following claims.
[0188] It should be understood that this disclosure is not limited to the precise structures described above and shown in the accompanying drawings, and various modifications and changes can be made without departing from its scope. The scope of this disclosure is limited only by the appended claims.
Claims
1. An information retrieval method, characterized in that, Applied to a terminal, the terminal includes a front-end component, a first component, and a second component, wherein the front-end component is a higher-order component that encapsulates the first component, the front-end component references the first component, and the second component references the front-end component; the method includes: Mount the information corresponding to the attributes and / or methods of the first component to the front-end component; When the second component calls the properties and / or methods of the first component, the second component obtains the information corresponding to the properties and / or methods of the first component from the front-end component; The front-end component also includes a second object, which is used to bind at least one event in the first component to its corresponding processing function. The method further includes: The front-end component listens to events triggered in the first component; If it is determined that a target event in the first component is triggered, the front-end component determines the target handling function bound to the target event based on the second object; If the target event is not an error event, and the second component includes the target processing function, the second component obtains the target event from the front-end component and processes the target event according to the target processing function. When the target event is an error event, the target processing function is an error event processing function, and the front-end component uploads the information corresponding to the error event based on the error event processing function; The front-end component is configured with target parameters, and the step of attaching information corresponding to the attributes and / or methods of the first component to the front-end component includes: Assign the information corresponding to the attributes and / or methods of the first component to the target parameter; The second component obtains information corresponding to the attributes and / or methods of the first component from the front-end component, including: The second component obtains the assignment information corresponding to the target parameter from the front-end component; The method further includes: Mount the attributes of the second component and their corresponding information to the front-end component; When the first component calls the attribute of the second component, the first component obtains the information corresponding to the attribute of the second component from the front-end component.
2. The method according to claim 1, characterized in that, The front-end component also includes a first object, and the step of attaching the attributes of the second component and its corresponding information to the front-end component includes: The front-end component assigns the attributes of the second component and their corresponding information to the first object; The first component obtains information corresponding to the attributes of the second component from the front-end component, including: The first component obtains the information corresponding to the attributes of the second component based on the assignment information of the first object.
3. The method according to claim 1, characterized in that, The uploaded information corresponding to the error event includes: Send the information corresponding to the error event to the target terminal; and / or, Based on the interface of the first component corresponding to the error event, the system performs analysis and statistics on the number of errors and the time, generates an error event analysis graph, and sends the error event analysis graph to the target terminal. The target terminal is the terminal that processes the error event.
4. An information retrieval device, characterized in that, Applied to a terminal, the terminal includes a front-end component, a first component, and a second component, wherein the front-end component is a higher-order component that encapsulates the first component, the front-end component references the first component, and the second component references the front-end component; the device includes: The information mounting module is configured to mount the information corresponding to the attributes and / or methods of the first component to the front-end component; The information acquisition module is configured to, when the second component calls the attribute and / or method of the first component, the second component acquires the information corresponding to the attribute and / or method of the first component from the front-end component; The front-end component further includes a second object, which is used to bind at least one event in the first component to its corresponding processing function. The device also includes: The event listener module is configured to execute the front-end component to listen for events triggered in the first component; The function determination module is configured to, when it is determined that a target event in the first component is triggered, determine, based on the second object, the target handling function bound to the target event; An event handling module is configured to, when the target event is not an error event and the second component includes the target handling function, obtain the target event from the front-end component and process the target event according to the target handling function; The error upload module is configured to, when the target event is an error event, the target processing function is an error event processing function, and the front-end component uploads the information corresponding to the error event based on the error event processing function; The front-end component is configured with target parameters, and the information mounting module includes: The first assignment submodule is configured to assign information corresponding to the properties and / or methods of the first component to the target parameter; The information acquisition module includes: The first acquisition submodule is configured to execute the second component to obtain the assignment information corresponding to the target parameter from the front-end component; The device further includes: The attribute mounting module is configured to mount the attributes of the second component and their corresponding information to the front-end component; The attribute retrieval module is configured to, when the first component calls the attribute of the second component, retrieve the information corresponding to the attribute of the second component from the front-end component.
5. The apparatus according to claim 4, characterized in that, The front-end component also includes a first object, and the attribute mounting module includes: The second assignment submodule is configured to execute the front-end component to assign the attributes of the second component and their corresponding information to the first object; The attribute acquisition module includes: The second acquisition submodule is configured to execute the first component to acquire the information corresponding to the attributes of the second component based on the assignment information of the first object.
6. The apparatus according to claim 4, characterized in that, The error upload module includes: The event sending submodule is configured to send the information corresponding to the error event to the target terminal; and / or, The analysis graph sending submodule is configured to execute the interface of the first component corresponding to the error event, perform analysis and statistics on the two dimensions of error count and time, generate an error event analysis graph, and send the error event analysis graph to the target terminal; The target terminal is the terminal that processes the error event.
7. An electronic device, characterized in that, include: processor; Memory used to store the processor's executable instructions; The processor is configured to execute the instructions to implement the information retrieval method as described in any one of claims 1 to 3.
8. A computer-readable storage medium, characterized in that, When the instructions in the computer-readable storage medium are executed by the processor of the information retrieval device, the information retrieval device is made to implement the information retrieval method as described in any one of claims 1 to 3.
9. A computer program product, comprising a computer program, characterized in that, When the computer program is executed by the processor, it implements the information retrieval method according to any one of claims 1 to 3.