Method, device, electronic device and medium for synchronous display of pages between devices

Abstract

The present invention relates to artificial intelligence technology, and discloses a method for synchronous display of pages between devices, including: determining a preset pixel value of a relative display unit according to the screen size of a collaborative display device; parsing the display page in the collaborative display device to obtain a hierarchical structure diagram based on a DOM tree; obtaining elements of target types in different layers of the hierarchical structure diagram as to-be-displayed page elements of the display page; obtaining the pixel size of the to-be-displayed page element, determining the relative display size of the to-be-displayed page element according to the pixel size and the preset pixel value of the relative display unit, and displaying the to-be-displayed page element with the relative display size. In addition, the present invention also relates to blockchain technology, and the relative display size can be stored in a node of a blockchain. The present invention also proposes a method device for synchronous display of pages between devices, an electronic device, and a computer-readable storage medium. The present invention can improve the efficiency of accurately adapting display page elements in different devices.

Description

Technical Field

[0001] The present invention relates to the field of artificial intelligence technology, and in particular to a method, device, electronic device and computer-readable storage medium for synchronously displaying pages between devices. Background Art

[0002] Different devices may have different display sizes. In the process of synchronous shared display between devices, it is essential to allow the web page to have the ability to adapt. Otherwise, the fixed size will cause it to be too large to display completely on a smaller screen, and too small to be clearly seen on a larger screen. The page synchronization display solution between devices in the prior art has the following problems. First, it is necessary to prepare multiple sets of scripts for user interface size styles, and use corresponding scripts in different size ranges. This will result in multiple screen sizes in an interval using only one set of sizes, and the adaptation and display are not detailed enough. Second, since multiple sets of scripts need to be prepared, the research and development cost is high. Third, multiple sets of scripts need to be loaded during operation, and the performance is not good. Therefore, in the prior art, the display of web pages has the problem of not being able to display efficiently and accurately. Summary of the invention

[0003] The present invention provides a method and apparatus for synchronously displaying pages between devices, an electronic device and a readable storage medium, the main purpose of which is to improve the efficiency of accurately synchronously adapting and displaying page elements in different devices.

[0004] To achieve the above object, the present invention provides a method for synchronously displaying pages between devices, comprising:

[0005] Sending an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted permission identifier;

[0006] Receiving the screen size of the collaborative display device returned after the permission identifier is authenticated;

[0007] Determining a preset pixel value of a relative display unit according to the screen size;

[0008] Parsing the displayed page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree;

[0009] Acquire elements of target types in different layers of the hierarchical structure diagram as to-be-displayed page elements of a display page in the collaborative display device;

[0010] The pixel size of the page element to be displayed is obtained, the relative display size of the page element to be displayed is determined according to the pixel size and the pixel value of the preset relative display unit, and the page element to be displayed is displayed with the relative display size.

[0011] Optionally, the number of the to-be-displayed page elements is multiple, and displaying the to-be-displayed page elements in the relative display size includes:

[0012] Obtaining importance levels of a plurality of the to-be-displayed page elements and file sizes of the plurality of the to-be-displayed page elements;

[0013] Performing weighted calculation according to the importance level and the file size to obtain a display sequence of the plurality of page elements to be displayed;

[0014] According to the display sequence, a plurality of the page elements to be displayed are loaded and displayed in sequence with the relative display size of each of the page elements to be displayed.

[0015] Optionally, before sending an access request for obtaining device information of a collaborative display device, the method further includes:

[0016] Obtaining an authorization identifier, wherein the authorization identifier includes a sender ID and a sending timestamp;

[0017] Obtaining a private key stored in the blockchain, and encrypting the sender ID and the sending timestamp using the private key to obtain encrypted information;

[0018] The encrypted information is packaged with the request information to obtain the device information access request.

[0019] Optionally, determining a preset pixel value of a relative display unit according to the screen size includes:

[0020] The product of the screen size and the preset percentage is calculated to obtain a pixel value of a preset relative display unit.

[0021] Optionally, obtaining the pixel size of the page element to be displayed includes:

[0022] Obtaining the storage path and element name of the page element to be displayed;

[0023] Access the resource library according to the storage path, search the element name in the resource library, and obtain the page element to be displayed;

[0024] The attribute information of the to-be-displayed page element is read to obtain the pixel size of the to-be-displayed page element.

[0025] Optionally, searching for the element name in the resource library includes:

[0026] Convert the element name into a text vector;

[0027] Calculating the similarity between the text vector and the keyword vector in the keyword index of the resource library;

[0028] The text corresponding to the keyword vector with the highest similarity is determined to be the element name.

[0029] Optionally, converting the element name into a text vector includes:

[0030] The element name is converted into a text vector through a VSM vector space model.

[0031] In order to solve the above problem, the present invention further provides a device for synchronously displaying pages between devices, the device comprising:

[0032] A sending module, used to send an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted authority identifier;

[0033] A size acquisition module, used to receive the screen size of the collaborative display device returned after the permission identifier is authenticated;

[0034] A determination module, used to determine a preset pixel value of a relative display unit according to the screen size;

[0035] A parsing module, used to parse the displayed page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree;

[0036] A to-be-displayed page element acquisition module, used to acquire elements of target types in different layers of the hierarchical structure diagram as to-be-displayed page elements of the page displayed in the collaborative display device;

[0037] The display module is used to obtain the pixel size of the page element to be displayed, determine the relative display size of the page element to be displayed according to the pixel size and the pixel value of the preset relative display unit, and display the page element to be displayed with the relative display size.

[0038] In order to solve the above problem, the present invention further provides an electronic device, the electronic device comprising:

[0039] a memory storing at least one computer program; and

[0040] The processor executes the computer program stored in the memory to implement the above-mentioned method for synchronously displaying pages between devices.

[0041] In order to solve the above problem, the present invention also provides a computer-readable storage medium, in which at least one computer program is stored. The at least one computer program is executed by a processor in an electronic device to implement the above-mentioned method for synchronous display of pages between devices.

[0042] The present invention sends an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted permission identifier; receives the screen size of the collaborative display device returned after the permission identifier is verified; determines the pixel value of the preset relative display unit according to the screen size; parses the display page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree; obtains the target type elements in different layers of the hierarchical structure diagram as the to-be-displayed page elements of the display page in the collaborative display device; obtains the pixel size of the to-be-displayed page element, determines the relative display size of the to-be-displayed page element according to the pixel size and the preset pixel value of the relative display unit, and displays the to-be-displayed page element with the relative display size. Determine the relative display size of the to-be-displayed page element of the collaborative display device, and then display it on the current device with the relative display size instead of the absolute pixel size, so that it can be quickly adapted to different devices, maintain the consistency of the display ratio, and can accurately adapt and display without providing multiple sets of scripts in advance, thereby improving the efficiency of adaptation and display. Therefore, the embodiment of the present invention achieves the purpose of improving the efficiency of accurately and synchronously adapting and displaying page elements in different devices. BRIEF DESCRIPTION OF THE DRAWINGS

[0043] Figure 1 A schematic diagram of a flow chart of a method for synchronously displaying pages between devices provided in one embodiment of the present invention;

[0044] Figure 2 A functional module diagram of a device for synchronously displaying pages between devices provided by an embodiment of the present invention;

[0045] Figure 3 A schematic diagram of the structure of an electronic device for implementing the method for synchronously displaying pages between devices provided by an embodiment of the present invention.

[0046] The realization of the purpose, functional features and advantages of the present invention will be further explained in conjunction with embodiments and with reference to the accompanying drawings. DETAILED DESCRIPTION

[0047] It should be understood that the specific embodiments described herein are only used to explain the present invention, and are not used to limit the present invention.

[0048] The embodiment of the present application provides a method for synchronously displaying pages between devices. The execution subject of the method for synchronously displaying pages between devices includes but is not limited to at least one of the electronic devices such as a server, a terminal, etc. that can be configured to execute the method provided by the embodiment of the present application. In other words, the method for synchronously displaying pages between devices can be executed by software or hardware installed on a terminal device or a server device, and the software can be a blockchain platform. The server includes but is not limited to: a single server, a server cluster, a cloud server or a cloud server cluster, etc. The server can be an independent server, or it can be a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, content delivery networks (Content Delivery Network, CDN), and big data and artificial intelligence platforms.

[0049] Reference Figure 1 FIG. 1 is a flow chart of a method for synchronously displaying pages between devices provided in an embodiment of the present invention. In this embodiment, the method for synchronously displaying pages between devices includes:

[0050] S1. Send an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted authority identifier.

[0051] Specifically, the collaborative display device may be an electronic device such as a certain model of mobile phone, tablet, smart watch, etc., and the collaborative display device may include at least one display screen.

[0052] In this embodiment, the sending device and the cooperative display device may be different models of a certain type of electronic devices, and the screen sizes of different models of a certain type of electronic devices may be different. For example, the sending device is mobile phone A, and the screen width of mobile phone A is a pixel, and the cooperative display device is mobile phone B, and the screen width of mobile phone B is b pixels.

[0053] In this embodiment, a device access request may be sent to a device information storage module of the collaborative display device.

[0054] In this embodiment, the authority identifier may be identification information of the sender device, for example, an identification ID of the sender device.

[0055] S2. Receive the screen size of the collaborative display device returned after the permission identifier is verified.

[0056] In the embodiment of the present invention, the screen size is the screen width or the screen height.

[0057] Since the device information includes other device information besides the screen size, and may even include the user usage information of the collaborative display device, the security of information acquisition can be improved by performing permission authentication on the device information access request.

[0058] Optionally, before sending an access request for obtaining device information of a collaborative display device, the method further includes:

[0059] Obtaining an authorization identifier, wherein the authorization identifier includes a sender ID and a sending timestamp;

[0060] Obtaining a private key stored in the blockchain, and encrypting the sender ID and the sending timestamp using the private key to obtain encrypted information;

[0061] The encrypted information is packaged with the request information to obtain the device information access request.

[0062] In this embodiment, the sender ID can identify the identity information of the sender device, and the sending timestamp can be used by the collaborative display device to determine whether the access is made within the permitted time.

[0063] In this embodiment, the private key is a private key used for decryption, and correspondingly, the encryption party stores a public key for encryption corresponding to the private key.

[0064] In this embodiment, encryption is performed using the public key stored in the blockchain, and the receiving end decrypts using the private key. Therefore, the encrypted information is not easily cracked, which can improve the security of the encrypted information.

[0065] S3. Determine a preset pixel value of a relative display unit according to the screen size.

[0066] In this embodiment, the preset relative display unit is a preset display unit, and the pixel value of the preset relative display unit is how many pixels each relative display unit is equivalent to. The preset relative display unit is used to subsequently represent the size of the displayed page element.

[0067] For example, the preset relative display unit is rs, the screen width is d, and the pixel value of the preset relative display unit is 1rs=F(d)px, where px is a pixel and F(d) is a function with width as a variable.

[0068] Furthermore, the step of determining a preset pixel value of a relative display unit according to the screen size includes:

[0069] The product of the screen width and the preset percentage is calculated to obtain a pixel value of a preset relative display unit.

[0070] In this embodiment, the preset percentage may be pre-set, for example, the preset percentage is 5%.

[0071] Preferably, the preset percentage is 1%.

[0072] For example, if the screen width of the development device is 200px, then the preset relative display unit pixel value is: 1rs = 200 * 1% px = 2px.

[0073] In this embodiment, the corresponding relationship between the relative display unit and the pixel can be reflected by the pixel value of the relative display unit.

[0074] S4. Parse the displayed page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree.

[0075] In this embodiment, the page tag is a type tag of an element constituting the displayed page. For example, if the displayed page is an HTML page, the page tag is an HTML tag.

[0076] For example, parse the HTML tags of the display page to obtain information such as the root element, title element, document title, link element, control element, control, etc., and organize the parsed information in the form of a hierarchical diagram.

[0077] In this embodiment, the parsed information is organized in a hierarchical structure diagram based on a DOM tree, which can quickly determine the content type of each layer, and further quickly determine whether there are elements of the target type in different layers.

[0078] S5. Obtaining target-type elements in different layers of the hierarchical structure diagram as to-be-displayed page elements of a page displayed in the collaborative display device.

[0079] In this embodiment, the target type may be pre-set, and the target type may be one type or multiple types. For example, the target type may be a Button control, or a drop-down box control, or an image.

[0080] S6. Obtain the pixel size of the page element to be displayed, determine the relative display size of the page element to be displayed according to the pixel size and the pixel value of the preset relative display unit, and display the page element to be displayed with the relative display size.

[0081] In the embodiment of the present invention, the page elements to be displayed may specifically be various elements obtained in the above operations, for example, text, interactive controls (such as a drop-down box), videos, and the like.

[0082] In this embodiment, the pixel size of the page element to be displayed includes the width or height of the page element to be displayed. When the screen width of the cooperative display device is obtained in the aforementioned step, the width of the page element to be displayed is also obtained at this time. When the screen height of the cooperative display device is obtained in the aforementioned step, the height of the page element to be displayed is also obtained at this time.

[0083] For example, the screen width of the collaborative display device is 375px, the page element to be displayed is an interactive control, and the acquired width of the interactive control is 75px, then determine how many rs 75px is equal to. Since 1rs = 3.75px at this time, the relative display size of the interactive control is 75 / 3.75px = 20rs, that is, when the picture is displayed, the relative display size of the picture is 20rs.

[0084] Optionally, obtain the pixel size of the page element to be displayed, including:

[0085] Obtaining the storage path and element name of the page element to be displayed;

[0086] Access the resource library according to the storage path, search the element name in the resource library, and obtain the page element to be displayed;

[0087] The attribute information of the to-be-displayed page element is read to obtain the pixel size of the to-be-displayed page element.

[0088] In this embodiment, the storage path and element name of the to-be-displayed page element may be obtained from the hierarchical structure diagram.

[0089] In this embodiment, the resource library may be a local resource library or a resource library deployed by a remote project, and the resource library may contain a large number of page elements to be displayed.

[0090] Further, searching the element name in the resource library includes:

[0091] Convert the element name into a text vector;

[0092] Calculating the similarity between the text vector and the keyword vector in the keyword index of the resource library;

[0093] The text corresponding to the keyword vector with the highest similarity is determined to be the element name.

[0094] Optionally, the element name can be converted into a text vector using a VSM vector space model.

[0095] In this embodiment, the similarity between the text vector and each keyword vector may be calculated by a pre-similarity algorithm (eg, a cosine algorithm).

[0096] In this embodiment, searching in the resource library by a keyword index method and further determining the element name by similarity calculation can improve the speed, efficiency and accuracy of the search, which is conducive to improving the efficiency and accuracy of the display.

[0097] For example, if the relative display size of the element to be displayed is 20rs, it means that it is displayed in a size of 20rs in the to-be-displayed page of the collaborative display device. When displayed in the current device (i.e., the executing subject of this embodiment), if the device width of the current device is 600px, it is still displayed in a size of 20rs. At this time, 20rs is equivalent to 120px, and the design ratio of the element to be displayed to the screen size is still maintained at one-fifth, which realizes rapid dynamic adaptation when displayed synchronously in different devices, and the adaptation results are consistent with the original design.

[0098] In a specific implementation, the size of the root element of the display container of the current device may be determined to be a value of the preset relative display unit, and then the element to be displayed is displayed in the root element of the display container of the current device with the relative display size.

[0099] Furthermore, when displaying, you can create a new element with a size equal to the root element and place it one level below the root element to inherit the original root element. This approach avoids the size change caused by the existence of text or other display content on the root element. Each element can reset its own font size. If it is not set, the font size of the parent element will be used. Here, the font size of the new element is set to the font size of the original root element. This ensures that the font size of the root element is used without affecting the original font size.

[0100] Further, in an embodiment of the present invention, the number of the to-be-displayed page elements is multiple, and the displaying of the to-be-displayed page elements in the relative display size includes:

[0101] Obtaining importance levels of a plurality of the to-be-displayed page elements and file sizes of the plurality of the to-be-displayed page elements;

[0102] Performing weighted calculation according to the importance level and the file size to obtain a display sequence of the plurality of page elements to be displayed;

[0103] According to the display sequence, a plurality of the page elements to be displayed are loaded and displayed in sequence with the relative display size of each of the page elements to be displayed.

[0104] In this embodiment, the types of the multiple page elements to be displayed may be the same or different.

[0105] During specific implementation, the importance level of the to-be-displayed page element may be preset, or may be determined according to the type of the to-be-displayed page element.

[0106] The weighted calculation based on the importance level and the file size includes: obtaining a first weighted ratio of the importance level and a second weighted ratio of the file size, calculating a first product of the importance level of each to-be-displayed page element and the first weighted ratio and a second product of the file size and the second weighted ratio, adding the results of the first product and the second product, sorting the added results of each to-be-displayed page element, and determining the sorting as a display sequence of multiple to-be-displayed page elements.

[0107] In this embodiment, the display is performed in sequence according to the display sequence, thereby improving the display efficiency.

[0108] The present invention sends an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted permission identifier; receives the screen size of the collaborative display device returned after the permission identifier is verified; determines the pixel value of the preset relative display unit according to the screen size; parses the display page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree; obtains the target type elements in different layers of the hierarchical structure diagram as the to-be-displayed page elements of the display page in the collaborative display device; obtains the pixel size of the to-be-displayed page element, determines the relative display size of the to-be-displayed page element according to the pixel size and the preset pixel value of the relative display unit, and displays the to-be-displayed page element with the relative display size. Determine the relative display size of the to-be-displayed page element of the collaborative display device, and then display it on the current device with the relative display size instead of the absolute pixel size, so that it can be quickly adapted to different devices, maintain the consistency of the display ratio, and can accurately adapt and display without providing multiple sets of scripts in advance, thereby improving the efficiency of adaptation and display. Therefore, the embodiment of the present invention achieves the purpose of improving the efficiency of accurately and synchronously adapting and displaying page elements in different devices.

[0109] like Figure 2 , which is a functional module diagram of a device for synchronously displaying pages between devices provided by an embodiment of the present invention.

[0110] The device 100 for synchronously displaying pages between devices of the present invention can be installed in an electronic device. According to the functions to be implemented, the device 100 for synchronously displaying pages between devices may include a sending module 101, a size acquisition module 102, a determination module 103, a parsing module 104, a module for acquiring elements of a page to be displayed 105, and a display module 106. The module of the present invention may also be referred to as a unit, which refers to a series of computer program segments that can be executed by a processor of an electronic device and can complete fixed functions, and is stored in a memory of the electronic device.

[0111] In this embodiment, the functions of each module / unit are as follows:

[0112] A sending module 101, configured to send an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted authority identifier;

[0113] A size acquisition module 102, configured to receive the screen size of the collaborative display device returned after the permission identifier is authenticated;

[0114] A determination module 103, configured to determine a preset pixel value of a relative display unit according to the screen size;

[0115] A parsing module 104, configured to parse the displayed page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on a DOM tree;

[0116] A to-be-displayed page element acquisition module 105, used to acquire elements of target types in different layers of the hierarchical structure diagram as to-be-displayed page elements of the page displayed in the collaborative display device;

[0117] The display module 106 is used to obtain the pixel size of the page element to be displayed, determine the relative display size of the page element to be displayed according to the pixel size and the pixel value of the preset relative display unit, and display the page element to be displayed with the relative display size.

[0118] In detail, the specific implementation of each module of the inter-device page synchronization display device 100 is as follows:

[0119] Step 1: Send an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted permission identifier.

[0120] Specifically, the collaborative display device may be an electronic device such as a certain model of mobile phone, tablet, smart watch, etc., and the collaborative display device may include at least one display screen.

[0121] In this embodiment, the sending device and the cooperative display device may be different models of a certain type of electronic devices, and the screen sizes of different models of a certain type of electronic devices may be different. For example, the sending device is mobile phone A, and the screen width of mobile phone A is a pixel, and the cooperative display device is mobile phone B, and the screen width of mobile phone B is b pixels.

[0122] In this embodiment, a device access request may be sent to a device information storage module of the collaborative display device.

[0123] In this embodiment, the authority identifier may be identification information of the sender device, for example, an identification ID of the sender device.

[0124] Step 2: receiving the screen size of the collaborative display device returned after the permission identifier is verified.

[0125] In the embodiment of the present invention, the screen size is the screen width or the screen height.

[0126] Since the device information includes other device information besides the screen size, and may even include the user usage information of the collaborative display device, the security of information acquisition can be improved by performing permission authentication on the device information access request.

[0127] Optionally, before sending the access request for obtaining the device information of the collaborative display device, the following operations are further performed:

[0128] Obtaining an authorization identifier, wherein the authorization identifier includes a sender ID and a sending timestamp;

[0129] Obtaining a private key stored in the blockchain, and encrypting the sender ID and the sending timestamp using the private key to obtain encrypted information;

[0130] The encrypted information is packaged with the request information to obtain the device information access request.

[0131] In this embodiment, the sender ID can identify the identity information of the sender device, and the sending timestamp can be used by the collaborative display device to determine whether the access is made within the permitted time.

[0132] In this embodiment, the private key is a private key used for decryption, and correspondingly, the encryption party stores a public key for encryption corresponding to the private key.

[0133] In this embodiment, encryption is performed using the public key stored in the blockchain, and the receiving end decrypts using the private key. Therefore, the encrypted information is not easily cracked, which can improve the security of the encrypted information.

[0134] Step three: determining a preset pixel value of a relative display unit according to the screen size.

[0135] In this embodiment, the preset relative display unit is a preset display unit, and the pixel value of the preset relative display unit is how many pixels each relative display unit is equivalent to. The preset relative display unit is used to subsequently represent the size of the displayed page element.

[0136] For example, the preset relative display unit is rs, the screen width is d, and the pixel value of the preset relative display unit is 1rs=F(d)px, where px is a pixel and F(d) is a function with width as a variable.

[0137] Furthermore, the step of determining a preset pixel value of a relative display unit according to the screen size includes:

[0138] The product of the screen width and the preset percentage is calculated to obtain a pixel value of a preset relative display unit.

[0139] In this embodiment, the preset percentage may be pre-set, for example, the preset percentage is 5%.

[0140] Preferably, the preset percentage is 1%.

[0141] For example, if the screen width of the development device is 200px, then the preset relative display unit pixel value is: 1rs = 200 * 1% px = 2px.

[0142] In this embodiment, the corresponding relationship between the relative display unit and the pixel can be reflected by the pixel value of the relative display unit.

[0143] Step 4: Parse the displayed page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree.

[0144] In this embodiment, the page tag is a type tag of an element constituting the displayed page. For example, if the displayed page is an HTML page, the page tag is an HTML tag.

[0145] For example, parse the HTML tags of the display page to obtain information such as the root element, title element, document title, link element, control element, control, etc., and organize the parsed information in the form of a hierarchical diagram.

[0146] In this embodiment, the parsed information is organized in a hierarchical structure diagram based on a DOM tree, which can quickly determine the content type of each layer, and further quickly determine whether there are elements of the target type in different layers.

[0147] Step 5: obtaining target-type elements in different layers of the hierarchical structure diagram as to-be-displayed page elements of the display page in the collaborative display device.

[0148] In this embodiment, the target type may be pre-set, and the target type may be one type or multiple types. For example, the target type may be a Button control, or a drop-down box control, or an image.

[0149] Step 6: Obtain the pixel size of the page element to be displayed, determine the relative display size of the page element to be displayed according to the pixel size and the pixel value of the preset relative display unit, and display the page element to be displayed with the relative display size.

[0150] In the embodiment of the present invention, the page elements to be displayed may specifically be various elements obtained in the above operations, for example, text, interactive controls (such as a drop-down box), videos, and the like.

[0151] In this embodiment, the pixel size of the page element to be displayed includes the width or height of the page element to be displayed. When the screen width of the cooperative display device is obtained in the aforementioned step, the width of the page element to be displayed is also obtained at this time. When the screen height of the cooperative display device is obtained in the aforementioned step, the height of the page element to be displayed is also obtained at this time.

[0152] For example, the screen width of the collaborative display device is 375px, the page element to be displayed is an interactive control, and the acquired width of the interactive control is 75px, then determine how many rs 75px is equal to. Since 1rs = 3.75px at this time, the relative display size of the interactive control is 75 / 3.75px = 20rs, that is, when the picture is displayed, the relative display size of the picture is 20rs.

[0153] Optionally, obtain the pixel size of the page element to be displayed, including:

[0154] Obtaining the storage path and element name of the page element to be displayed;

[0155] Access the resource library according to the storage path, search the element name in the resource library, and obtain the page element to be displayed;

[0156] The attribute information of the to-be-displayed page element is read to obtain the pixel size of the to-be-displayed page element.

[0157] In this embodiment, the storage path and element name of the to-be-displayed page element may be obtained from the hierarchical structure diagram.

[0158] In this embodiment, the resource library may be a local resource library or a resource library deployed by a remote project, and the resource library may contain a large number of page elements to be displayed.

[0159] Further, searching the element name in the resource library includes:

[0160] Convert the element name into a text vector;

[0161] Calculating the similarity between the text vector and the keyword vector in the keyword index of the resource library;

[0162] The text corresponding to the keyword vector with the highest similarity is determined to be the element name.

[0163] Optionally, the element name can be converted into a text vector using a VSM vector space model.

[0164] In this embodiment, the similarity between the text vector and each keyword vector may be calculated by a pre-similarity algorithm (eg, a cosine algorithm).

[0165] In this embodiment, searching in the resource library by a keyword index method and further determining the element name by similarity calculation can improve the speed, efficiency and accuracy of the search, which is conducive to improving the efficiency and accuracy of the display.

[0166] For example, if the relative display size of the element to be displayed is 20rs, it means that it is displayed in a size of 20rs in the to-be-displayed page of the collaborative display device. When displayed in the current device (i.e., the executing subject of this embodiment), if the device width of the current device is 600px, it is still displayed in a size of 20rs. At this time, 20rs is equivalent to 120px, and the design ratio of the element to be displayed to the screen size is still maintained at one-fifth, which realizes rapid dynamic adaptation when displayed synchronously in different devices, and the adaptation results are consistent with the original design.

[0167] In a specific implementation, the size of the root element of the display container of the current device may be determined to be a value of the preset relative display unit, and then the element to be displayed is displayed in the root element of the display container of the current device with the relative display size.

[0168] Furthermore, when displaying, you can create a new element with a size equal to the root element and place it one level below the root element to inherit the original root element. This approach avoids the size change caused by the existence of text or other display content on the root element. Each element can reset its own font size. If it is not set, the font size of the parent element will be used. Here, the font size of the new element is set to the font size of the original root element. This ensures that the font size of the root element is used without affecting the original font size.

[0169] Further, in an embodiment of the present invention, the number of the to-be-displayed page elements is multiple, and the displaying of the to-be-displayed page elements in the relative display size includes:

[0170] Obtaining importance levels of a plurality of the to-be-displayed page elements and file sizes of the plurality of the to-be-displayed page elements;

[0171] Performing weighted calculation according to the importance level and the file size to obtain a display sequence of the plurality of page elements to be displayed;

[0172] According to the display sequence, a plurality of the page elements to be displayed are loaded and displayed in sequence with the relative display size of each of the page elements to be displayed.

[0173] In this embodiment, the types of the multiple page elements to be displayed may be the same or different.

[0174] During specific implementation, the importance level of the to-be-displayed page element may be preset, or may be determined according to the type of the to-be-displayed page element.

[0175] The weighted calculation based on the importance level and the file size includes: obtaining a first weighted ratio of the importance level and a second weighted ratio of the file size, calculating a first product of the importance level of each to-be-displayed page element and the first weighted ratio and a second product of the file size and the second weighted ratio, adding the results of the first product and the second product, sorting the added results of each to-be-displayed page element, and determining the sorting as a display sequence of multiple to-be-displayed page elements.

[0176] In this embodiment, the display is performed in sequence according to the display sequence, thereby improving the display efficiency.

[0177] The present invention sends an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted permission identifier; receives the screen size of the collaborative display device returned after the permission identifier is verified; determines the pixel value of the preset relative display unit according to the screen size; parses the display page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree; obtains the target type elements in different layers of the hierarchical structure diagram as the to-be-displayed page elements of the display page in the collaborative display device; obtains the pixel size of the to-be-displayed page element, determines the relative display size of the to-be-displayed page element according to the pixel size and the preset pixel value of the relative display unit, and displays the to-be-displayed page element with the relative display size. Determine the relative display size of the to-be-displayed page element of the collaborative display device, and then display it on the current device with the relative display size instead of the absolute pixel size, so that it can be quickly adapted to different devices, maintain the consistency of the display ratio, and can accurately adapt and display without providing multiple sets of scripts in advance, thereby improving the efficiency of adaptation and display. Therefore, the embodiment of the present invention achieves the purpose of improving the efficiency of accurately and synchronously adapting and displaying page elements in different devices.

[0178] like Figure 3 FIG. 1 is a schematic diagram of the structure of an electronic device for implementing a method for synchronously displaying pages between devices provided by an embodiment of the present invention.

[0179] The electronic device may include a processor 10, a memory 11, a communication interface 12 and a bus 13, and may also include a computer program stored in the memory 11 and executable on the processor 10, such as a page synchronization display program between devices.

[0180] Wherein, the memory 11 includes at least one type of readable storage medium, and the readable storage medium includes flash memory, mobile hard disk, multimedia card, card-type memory (for example: SD or DX memory, etc.), magnetic memory, disk, optical disk, etc. The memory 11 may be an internal storage unit of an electronic device in some embodiments, such as a mobile hard disk of the electronic device. The memory 11 may also be an external storage device of an electronic device in other embodiments, such as a plug-in mobile hard disk, a smart memory card (Smart Media Card, SMC), a secure digital (SecureDigital, SD) card, a flash card (Flash Card), etc. equipped on the electronic device. Further, the memory 11 may also include both an internal storage unit of the electronic device and an external storage device. The memory 11 may not only be used to store application software and various types of data installed in the electronic device, such as the code of the page synchronization display program between devices, but also be used to temporarily store data that has been output or is to be output.

[0181] The processor 10 may be composed of an integrated circuit in some embodiments, for example, a single packaged integrated circuit, or a plurality of packaged integrated circuits with the same or different functions, including one or more central processing units (CPUs), microprocessors, digital processing chips, graphics processors, and combinations of various control chips, etc. The processor 10 is the control core (Control Unit) of the electronic device, and uses various interfaces and lines to connect various components of the entire electronic device, and executes or executes programs or modules stored in the memory 11 (such as page synchronization display programs between devices, etc.), and calls data stored in the memory 11 to execute various functions of the electronic device and process data.

[0182] The communication interface 12 is used for communication between the above-mentioned electronic device and other devices, including a network interface and a user interface. Optionally, the network interface may include a wired interface and / or a wireless interface (such as a WI-FI interface, a Bluetooth interface, etc.), which is generally used to establish a communication connection between the electronic device and other electronic devices. The user interface may be a display (Display), an input unit (such as a keyboard (Keyboard)), and optionally, the user interface may also be a standard wired interface, a wireless interface. Optionally, in some embodiments, the display may be an LED display, a liquid crystal display, a touch-sensitive liquid crystal display, and an OLED (Organic Light-Emitting Diode, organic light-emitting diode) touch device, etc. Among them, the display may also be appropriately referred to as a display screen or a display unit, which is used to display information processed in the electronic device and to display a visual user interface.

[0183] The bus 13 may be a peripheral component interconnect (PCI) bus or an extended industry standard architecture (EISA) bus, etc. The bus 13 may be divided into an address bus, a data bus, a control bus, etc. The bus 13 is configured to realize connection and communication between the memory 11 and at least one processor 10, etc.

[0184] Figure 3 Only an electronic device with components is shown, and those skilled in the art will understand that Figure 3 The structure shown does not constitute a limitation on the electronic device, and may include fewer or more components than shown in the figure, or combine certain components, or arrange the components differently.

[0185] For example, although not shown, the electronic device may also include a power source (such as a battery) for supplying power to each component. Preferably, the power source may be logically connected to the at least one processor 10 through a power management device, so that the power management device can realize functions such as charging management, discharging management, and power consumption management. The power source may also include one or more DC or AC power sources, recharging devices, power failure detection circuits, power converters or inverters, power status indicators, and other arbitrary components. The electronic device may also include a variety of sensors, Bluetooth modules, Wi-Fi modules, etc., which will not be repeated here.

[0186] Furthermore, the electronic device may also include a network interface. Optionally, the network interface may include a wired interface and / or a wireless interface (such as a WI-FI interface, a Bluetooth interface, etc.), which is generally used to establish a communication connection between the electronic device and other electronic devices.

[0187] Optionally, the electronic device may further include a user interface, which may be a display, an input unit (such as a keyboard), or a standard wired interface or a wireless interface. Optionally, in some embodiments, the display may be an LED display, a liquid crystal display, a touch-sensitive liquid crystal display, and an OLED (Organic Light-Emitting Diode) touch device. The display may also be appropriately referred to as a display screen or a display unit, which is used to display information processed in the electronic device and to display a visual user interface.

[0188] It should be understood that the embodiment is for illustration only and the scope of the patent application is not limited to this structure.

[0189] The page synchronization display program between devices stored in the memory 11 of the electronic device is a combination of multiple instructions. When running in the processor 10, it can achieve:

[0190] Sending an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted permission identifier;

[0191] Receiving the screen size of the collaborative display device returned after the permission identifier is authenticated;

[0192] Determining a preset pixel value of a relative display unit according to the screen size;

[0193] Parsing the displayed page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree;

[0194] Acquire elements of target types in different layers of the hierarchical structure diagram as to-be-displayed page elements of a display page in the collaborative display device;

[0195] The pixel size of the page element to be displayed is obtained, the relative display size of the page element to be displayed is determined according to the pixel size and the pixel value of the preset relative display unit, and the page element to be displayed is displayed with the relative display size.

[0196] Specifically, the specific implementation method of the processor 10 for the above instructions can refer to the description of the relevant steps in the corresponding embodiment of the accompanying drawings, which will not be repeated here.

[0197] Furthermore, if the module / unit integrated in the electronic device is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. The computer-readable storage medium can be volatile or non-volatile. For example, the computer-readable medium may include: any entity or device capable of carrying the computer program code, a recording medium, a USB flash drive, a mobile hard disk, a magnetic disk, an optical disk, a computer memory, and a read-only memory (ROM).

[0198] The present invention further provides a computer-readable storage medium, wherein the computer-readable storage medium stores a computer program, and when the computer program is executed by a processor of an electronic device, the computer program can implement:

[0199] Sending an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted permission identifier;

[0200] Receiving the screen size of the collaborative display device returned after the permission identifier is authenticated;

[0201] Determining a preset pixel value of a relative display unit according to the screen size;

[0202] Parsing the displayed page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree;

[0203] Acquire elements of target types in different layers of the hierarchical structure diagram as to-be-displayed page elements of a display page in the collaborative display device;

[0204] The pixel size of the page element to be displayed is obtained, the relative display size of the page element to be displayed is determined according to the pixel size and the pixel value of the preset relative display unit, and the page element to be displayed is displayed with the relative display size.

[0205] In the several embodiments provided by the present invention, it should be understood that the disclosed devices, apparatuses and methods can be implemented in other ways. For example, the device embodiments described above are only illustrative, for example, the division of the modules is only a logical function division, and there may be other division methods in actual implementation.

[0206] The modules described as separate components may or may not be physically separated, and the components shown as modules may or may not be physical units, that is, they may be located in one place or distributed on multiple network units. Some or all of the modules may be selected according to actual needs to achieve the purpose of the solution of this embodiment.

[0207] In addition, each functional module in each embodiment of the present invention may be integrated into one processing unit, each unit may exist physically separately, or two or more units may be integrated into one unit. The above-mentioned integrated unit may be implemented in the form of hardware or in the form of hardware plus software functional modules.

[0208] It is obvious to those skilled in the art that the present invention is not limited to the details of the above exemplary embodiments, and that the present invention can be implemented in other specific forms without departing from the spirit or essential characteristics of the present invention.

[0209] Therefore, no matter from which point of view, the embodiments should be regarded as illustrative and non-restrictive, and the scope of the present invention is limited by the appended claims rather than the above description, so it is intended that all changes falling within the meaning and scope of the equivalent elements of the claims are included in the present invention. Any attached figure mark in the claims should not be regarded as limiting the claims involved.

[0210] The embodiments of the present application can acquire and process relevant data based on artificial intelligence technology. Among them, artificial intelligence (AI) is the theory, method, technology and application system that uses digital computers or machines controlled by digital computers to simulate, extend and expand human intelligence, perceive the environment, acquire knowledge and use knowledge to obtain the best results.

[0211] AI basic technologies generally include sensors, dedicated AI chips, cloud computing, distributed storage, big data processing technology, operation / interaction systems, mechatronics, etc. AI software technologies mainly include computer vision technology, robotics technology, biometrics technology, speech processing technology, natural language processing technology, and machine learning / deep learning.

[0212] The blockchain referred to in this invention is a new application mode of computer technologies such as distributed data storage, peer-to-peer transmission, consensus mechanism, encryption algorithm, etc. Blockchain is essentially a decentralized database, a string of data blocks generated by cryptographic methods. Each data block contains a batch of network transaction information, which is used to verify the validity of its information (anti-counterfeiting) and generate the next block. Blockchain can include the underlying blockchain platform, platform product service layer, and application service layer.

[0213] In addition, it is clear that the word "comprising" does not exclude other units or steps, and the singular does not exclude the plural. Multiple units or devices stated in the system claim can also be implemented by one unit or device through software or hardware. The second and other words are used to indicate names, but not to indicate any particular order.

[0214] Finally, it should be noted that the above embodiments are only used to illustrate the technical solution of the present invention rather than to limit it. Although the present invention has been described in detail with reference to the preferred embodiments, those skilled in the art should understand that the technical solution of the present invention can be modified or replaced by equivalents without departing from the spirit and scope of the technical solution of the present invention.

Claims

1. A method for synchronously displaying pages between devices, characterized in that: The method comprises: Sending an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted permission identifier; Receiving the screen size of the collaborative display device returned after the permission identifier is authenticated; Determine the pixel value of the preset relative display unit according to the screen size; Parsing the displayed page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree; Acquire elements of target types in different layers of the hierarchical structure diagram as to-be-displayed page elements of a display page in the collaborative display device; Obtaining the pixel size of the page element to be displayed, determining the relative display size of the page element to be displayed according to the pixel size and the pixel value of the preset relative display unit, and displaying the page element to be displayed with the relative display size according to the preset pixel value of the relative display unit corresponding to the current device screen size; The step of determining the pixel value of the preset relative display unit according to the screen size includes: calculating the product of the screen size and a preset percentage to obtain the pixel value of the preset relative display unit.

2. The method for synchronously displaying pages between devices according to claim 1, characterized in that: The number of the page elements to be displayed is multiple, and the displaying of the page elements to be displayed in the relative display size includes: Obtaining importance levels of a plurality of the to-be-displayed page elements and file sizes of the plurality of the to-be-displayed page elements; Performing weighted calculation according to the importance level and the file size to obtain a display sequence of the plurality of page elements to be displayed; According to the display sequence, a plurality of the page elements to be displayed are loaded and displayed in sequence with the relative display size of each of the page elements to be displayed.

3. The method for synchronously displaying pages between devices according to claim 1, characterized in that: Before sending the access request for acquiring device information of the collaborative display device, the method further includes: Obtaining an authorization identifier, wherein the authorization identifier includes a sender ID and a sending timestamp; Obtaining a private key stored in the blockchain, and encrypting the sender ID and the sending timestamp using the private key to obtain encrypted information; The encrypted information is packaged with the request information to obtain the access request.

4. The method for synchronously displaying pages between devices according to any one of claims 1 to 3, characterized in that: The step of obtaining the pixel size of the page element to be displayed includes: Obtaining the storage path and element name of the page element to be displayed; Access the resource library according to the storage path, search the element name in the resource library, and obtain the page element to be displayed; The attribute information of the to-be-displayed page element is read to obtain the pixel size of the to-be-displayed page element.

5. The method for synchronously displaying pages between devices according to claim 4, characterized in that: The searching the element name in the resource library includes: Convert the element name into a text vector; Calculating the similarity between the text vector and the keyword vector in the keyword index of the resource library; The text corresponding to the keyword vector with the highest similarity is determined to be the element name.

6. The method for synchronously displaying pages between devices according to claim 5, characterized in that: The step of converting the element name into a text vector comprises: The element name is converted into a text vector through a VSM vector space model.

7. A device for synchronously displaying pages between devices, characterized in that: The device comprises: A sending module, used to send an access request for obtaining device information of a collaborative display device, wherein the access request includes an encrypted authority identifier; A size acquisition module, used to receive the screen size of the collaborative display device returned after the permission identifier is authenticated; A determination module, configured to determine a preset pixel value of a relative display unit according to a screen size, wherein the step of determining the preset pixel value of a relative display unit according to the screen size comprises: calculating the product of the screen size and a preset percentage to obtain the preset pixel value of the relative display unit; A parsing module, used to parse the displayed page in the collaborative display device according to the page tag to obtain a hierarchical structure diagram based on the DOM tree; A to-be-displayed page element acquisition module, used to acquire elements of target types in different layers of the hierarchical structure diagram as to-be-displayed page elements of the page displayed in the collaborative display device; The display module is used to obtain the pixel size of the page element to be displayed, determine the relative display size of the page element to be displayed according to the pixel size and the pixel value of the preset relative display unit, and display the page element to be displayed with the relative display size according to the pixel value of the preset relative display unit corresponding to the current device screen size.

8. An electronic device, characterized in that: The electronic device comprises: at least one processor; and, a memory communicatively connected to the at least one processor; wherein, The memory stores a computer program executable by the at least one processor, and the computer program is executed by the at least one processor so that the at least one processor can execute the page synchronization display method between devices as described in any one of claims 1 to 6.

9. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a processor, the method for synchronously displaying pages between devices as described in any one of claims 1 to 6 is implemented.

Images