CN113382083B

CN113382083B - Webpage screenshot method and device

Info

Publication number: CN113382083B
Application number: CN202110734538.5A
Authority: CN
Inventors: 孟繁贵; 梁锐
Original assignee: CCB Finetech Co Ltd
Current assignee: CCB Finetech Co Ltd
Priority date: 2021-06-30
Filing date: 2021-06-30
Publication date: 2022-12-23
Anticipated expiration: 2041-06-30
Also published as: CN113382083A

Abstract

The invention discloses a webpage screenshot method and a webpage screenshot device, and relates to the technical field of mobile internet. One embodiment of the method comprises: judging whether the client side has a screenshot condition currently or not according to the network environment information of the client side and the page style of the webpage to be screenshot, and screenshot the webpage to be screenshot through a screenshot plug-in unit under the condition that the client side has the screenshot condition; and under the condition that the screenshot condition is not met, sending a webpage screenshot request to the server, and receiving screenshot data of the webpage to be screenshot, which is returned by the server according to the webpage screenshot request. The embodiment can ensure that the screenshot is not distorted, improve the screenshot response speed and performance, reduce the server pressure, and realize the personalized screenshot functions of personalized configuration of the elements to be screenshot, the screenshot format, the personalized display information and the like.

Description

Webpage screenshot method and device

Technical Field

The invention relates to the technical field of mobile internet, in particular to a webpage screenshot method and a webpage screenshot device.

Background

In the mobile internet age, the webpage screenshot can be used for saving webpage data information or generating an H5 page to share to a friend circle.

The existing webpage screenshot scheme mainly comprises a client screenshot and a server screenshot, the client screenshot does not need to depend on a server, and the client browser is used for achieving webpage screenshot. The screenshot of the server side is that the client side browser sends a request to the server side, and the server side generates the screenshot.

In the process of implementing the invention, the inventor finds that at least the following problems exist in the prior art:

the method has the problems of screen capture distortion or slow screen capture response, low performance, high server pressure and the like, and cannot realize personalized screen capture functions of personalized configuration of elements to be captured, screen capture formats, personalized display information and the like.

Disclosure of Invention

In view of this, embodiments of the present invention provide a method and an apparatus for web page screenshot, which can ensure that the screenshot is not distorted, improve screenshot response speed and performance, reduce server pressure, and implement personalized screenshot functions such as personalized configuration of an element to be screenshot, a screenshot format, and personalized display information.

To achieve the above object, according to an aspect of an embodiment of the present invention, a method for screenshot in a web page is provided.

A method of web page screenshot comprising: after receiving a screenshot command, acquiring network environment information of a client and a page style of a webpage to be screenshot; judging whether the client side has a screenshot condition currently or not according to the network environment information of the client side and the page style of the webpage to be screenshot; under the condition that the client side currently has the screenshot condition, screenshot is carried out on the webpage to be screenshot through a screenshot plug-in; and under the condition that the client does not have the screenshot condition at present, sending a webpage screenshot request to a server, and receiving screenshot data of the webpage to be screenshot, which is returned by the server according to the webpage screenshot request.

Optionally, the determining, according to the network environment information of the client and the page style of the webpage to be screenshot, whether the client currently has a screenshot condition includes: judging whether the network environment information of the client indicates that the client is currently in a specific network environment, if so, determining that the client currently has the screenshot condition; if the network environment information of the client indicates that the client is not in the specific network environment currently, checking the attribute in the page style, wherein the checking is used for judging the compatibility of the page style and the screenshot plug-in; under the condition that the verification is passed, determining that the client side currently has the screenshot condition; and under the condition that the verification fails, determining that the client does not have the screenshot condition currently.

Optionally, the acquiring the network environment information of the client includes: acquiring a network connection state object of the client through a preset script, and extracting a network type from the network connection state object; judging whether the network environment information of the client indicates that the client is currently in a specific network environment or not, wherein the judging comprises the following steps: and judging whether the network is currently in the specific network environment or not according to the network type.

Optionally, obtaining a page style of the webpage to be captured includes: sending a style acquisition request to a preset interface of the server, wherein the style acquisition request comprises an address of the webpage to be captured; receiving an object returned by a preset interface of the server side in response to the style acquisition request; and obtaining one or more styles of an external style, an internal style and an embedded style in the webpage to be captured according to the attributes and the style attributes of the cascading style sheet in the returned object.

Optionally, the checking the attributes in the page style includes: judging whether the page style attribute which is not supported by the screenshot plug-in exists in the character string of the cascading style sheet attribute, and traversing each element in the array of the style attribute to judge whether the page style attribute which is not supported by the screenshot plug-in exists in the style attribute.

Optionally, the screenshot plug-in is an html2canvas (a library of web screenshots); the screenshot of the webpage to be screenshot is carried out through the screenshot plug-in, and the screenshot method comprises the following steps: selecting a to-be-screenshot element of the configured to-be-screenshot webpage to obtain a canvas object, and converting the canvas object into a base64 (one of encoding modes for transmitting 8-Bit byte codes) image; creating an a label, configuring the href attribute of the a label as a base64 image, and configuring the download attribute of the a label as the screenshot data name of the webpage to be screenshot; and downloading screenshot data of the webpage to be screenshot by triggering a click event of the label a, and then deleting the label a.

Optionally, the webpage screenshot request sent to the server includes a screenshot format of the webpage to be screenshot, and the screenshot format is a PDF format (portable document format); and the client adds the PDF page format to the webpage screenshot request before sending the webpage screenshot request to the server.

Optionally, the webpage screenshot request sent to the server includes a screenshot format of the webpage to be screenshot, and the screenshot format is an image format; and before sending the webpage screenshot request to the server side, the client side receives input personalized display configuration through a preset interface, the personalized display configuration comprises personalized display information and display positions of the personalized display information, and the personalized display configuration is added into the webpage screenshot request.

According to another aspect of the embodiments of the present invention, a method for screenshot in a web page is provided.

A webpage screenshot method comprises the following steps: receiving a webpage screenshot request of a webpage to be screenshot, which is sent by a client, wherein the webpage screenshot request comprises request parameters, and the request parameters comprise the address and screenshot configuration of the webpage to be screenshot; inquiring whether stored screenshot data of the webpage to be screenshot exists or not according to the request parameter; under the condition that the stored screenshot data of the webpage to be screenshot exists, returning the stored screenshot data of the webpage to be screenshot to the client; and under the condition that the stored screenshot data of the webpage to be screenshot does not exist, opening the address of the webpage to be screenshot in a specific browser, generating the screenshot data of the webpage to be screenshot according to the screenshot configuration, and returning the generated screenshot data to the client.

Optionally, the querying whether stored screenshot data of the webpage to be screenshot exists according to the request parameter includes: performing MD5 (fifth version of message digest algorithm) operation on the request parameter, judging whether the obtained MD5 value is the same as a stored MD5 value, if so, storing screenshot data of the webpage to be screenshot, otherwise, storing the screenshot data of the webpage to be screenshot; after generating the screenshot data of the webpage to be screenshot, the method further comprises the following steps: and taking the MD5 value obtained by performing MD5 operation according to the request parameter as the file name of the screenshot data of the webpage to be screenshot, and storing the screenshot data of the webpage to be screenshot.

Optionally, the screenshot configuration includes a screenshot format, the screenshot format is a PDF format, and the screenshot configuration further includes a page format of the PDF; generating screenshot data of the webpage to be screenshot according to the screenshot configuration, and returning the generated screenshot data to the client, wherein the screenshot data comprises: and configuring the page format of the webpage to be captured into the page format of the PDF, calling a PDF application program interface, capturing the screenshot of the webpage to be captured to obtain a PDF file of the webpage to be captured, and returning the PDF file to the client.

Optionally, the screenshot configuration includes a screenshot format, the screenshot format is an image format, and the screenshot configuration further includes a personalized display configuration, and the personalized display configuration includes personalized display information and a display position of the personalized display information; generating screenshot data of the webpage to be screenshot according to the screenshot configuration, and returning the generated screenshot data to the client, wherein the screenshot data comprises: calling a screenshot application program interface to obtain a first screenshot image of the image format corresponding to the webpage to be screenshot; and acquiring the personalized display information and the display position of the personalized display information from the personalized display configuration, adding the personalized display information to the first screenshot image according to the display position to obtain a second screenshot image, and returning the second screenshot image to the client.

According to another aspect of the embodiment of the invention, a webpage screenshot device is provided.

A web page screenshot device comprising: the information acquisition module is used for acquiring the network environment information of the client and the page style of the webpage to be subjected to screenshot after receiving the screenshot command; the screenshot condition judging module is used for judging whether the client side has a screenshot condition currently according to the network environment information of the client side and the page style of the webpage to be screenshot; the screenshot executing module is used for carrying out screenshot on the webpage to be screenshot through the screenshot plug-in under the condition that the client side has the screenshot condition currently; and under the condition that the client does not have the screenshot condition at present, sending a webpage screenshot request to a server, and receiving screenshot data of the webpage to be screenshot, which is returned by the server according to the webpage screenshot request.

A web page screen capture apparatus comprising: the system comprises a request receiving module, a request receiving module and a display module, wherein the request receiving module is used for receiving a webpage screenshot request of a webpage to be screenshot, the webpage screenshot request comprises request parameters, and the request parameters comprise the address and screenshot configuration of the webpage to be screenshot; the data query module is used for querying whether stored screenshot data of the webpage to be screenshot exists or not according to the request parameter; the screenshot module is used for returning the stored screenshot data of the webpage to be screenshot to the client under the condition that the stored screenshot data of the webpage to be screenshot exists; and under the condition that the stored screenshot data of the webpage to be screenshot does not exist, opening the address of the webpage to be screenshot in a specific browser, generating the screenshot data of the webpage to be screenshot according to the screenshot configuration, and returning the generated screenshot data to the client.

According to yet another aspect of an embodiment of the present invention, an electronic device is provided.

An electronic device, comprising: one or more processors; the memory is used for storing one or more programs, and when the one or more programs are executed by the one or more processors, the one or more processors realize the webpage screenshot method provided by the embodiment of the invention.

According to yet another aspect of an embodiment of the present invention, a computer-readable medium is provided.

A computer readable medium, on which a computer program is stored, which when executed by a processor implements the method for web page screenshot provided by an embodiment of the present invention.

One embodiment of the above invention has the following advantages or benefits: judging whether the client side has a screenshot condition currently or not according to the network environment information of the client side and the page style of the webpage to be screenshot, and screenshot the webpage to be screenshot through a screenshot plug-in unit under the condition that the client side has the screenshot condition; and under the condition that the screenshot condition is not met, sending a webpage screenshot request to the server, and receiving screenshot data of the webpage to be screenshot, which is returned by the server according to the webpage screenshot request. The method and the device can ensure that the screenshot is not distorted, improve the screenshot response speed and performance, prevent screenshot failure, reduce the server pressure, realize personalized screenshot functions of personalized configuration of the elements to be screenshot, screenshot formats, personalized display information and the like, improve the webpage screenshot experience of users, facilitate sharing of webpage information and contribute to realizing rapid fission of operation and marketing.

Further effects of the above-mentioned non-conventional alternatives will be described below in connection with the embodiments.

Drawings

The drawings are included to provide a better understanding of the invention and are not to be construed as unduly limiting the invention. Wherein:

FIG. 1 is a schematic diagram of the main steps of a web page screenshot method according to an embodiment of the present invention;

FIG. 2 is a schematic diagram illustrating main steps of a web page screenshot method according to another embodiment of the present invention;

FIG. 3 is a schematic flow diagram of a web page screenshot according to an embodiment of the present invention;

fig. 4 is a flowchart illustrating detecting whether a canvas image supports the css style of a web page according to an embodiment of the present invention;

FIG. 5 is a schematic flow chart of a client-side web page screenshot according to an embodiment of the present invention;

FIG. 6 is a main flow diagram of a screenshot of a server according to an embodiment of the present invention;

FIG. 7 is a flowchart illustrating a process of adding personalized display information to a screenshot by a server according to an embodiment of the present invention;

FIG. 8 is a schematic diagram of the main modules of a web page screenshot device according to an embodiment of the present invention;

FIG. 9 is a schematic diagram of the main modules of a web page screenshot device according to another embodiment of the present invention;

FIG. 10 is an exemplary system architecture diagram in which embodiments of the present invention may be applied;

fig. 11 is a schematic block diagram of a computer system suitable for use in implementing a terminal device or server according to an embodiment of the present invention.

Detailed Description

Exemplary embodiments of the present invention are described below with reference to the accompanying drawings, in which various details of embodiments of the invention are included to assist understanding, and which are to be considered as merely exemplary. Accordingly, those of ordinary skill in the art will recognize that various changes and modifications of the embodiments described herein can be made without departing from the scope and spirit of the invention. Also, descriptions of well-known functions and constructions are omitted in the following description for clarity and conciseness.

Fig. 1 is a schematic diagram illustrating main steps of a web page screenshot method according to an embodiment of the present invention. As shown in fig. 1, the method for screenshot in a web page according to an embodiment of the present invention mainly includes the following steps S101 to S103. The webpage screenshot method of the embodiment is executed at the client.

Step S101: after receiving a screenshot command, acquiring network environment information of a client and a page style of a webpage to be screenshot;

step S102: judging whether the client side has a screenshot condition currently or not according to the network environment information of the client side and the page style of the webpage to be screenshot;

step S103: under the condition that the client side currently has a screenshot condition, screenshot is conducted on a webpage to be screenshot through a screenshot plug-in; and under the condition that the client does not have the screenshot condition at present, sending a webpage screenshot request to the server, and receiving screenshot data of the webpage to be screenshot returned by the server according to the webpage screenshot request.

The client is a client displaying a webpage to be captured.

Judging whether the client side has a screenshot condition currently according to the network environment information of the client side and the page style of the webpage to be screenshot, which may specifically include: judging whether the network environment information of the client indicates that the client is currently in a specific network environment, if so, determining that the client currently has a screenshot condition; if the network environment information of the client indicates that the client is not in a specific network environment currently, checking attributes in the page style, wherein the checking is used for judging the compatibility of the page style and the screenshot plug-in, and specifically, checking whether the page style contains the page style attributes which are not supported by the screenshot plug-in or not; under the condition that the verification is passed, determining that the client currently has screenshot conditions; and under the condition that the verification fails, determining that the client does not have the screenshot condition currently.

The obtaining of the network environment information of the client may specifically include: and acquiring a network connection state object of the client through a preset script, and extracting the network type from the network connection state object. The preset script is, for example, a JavaScript script. The network connection state object is specifically a network connection state NetworkInformation object, and includes downlink (network downlink speed), effervescetype (network type), onchange (value representing network state change), rtt (estimated round trip time), and the like.

And judging whether the network environment information of the client indicates that the client is currently in a specific network environment or not, and specifically judging whether the client is currently in the specific network environment or not according to the network type. The effectiveType (network type) includes: "2g", "3g" and "4g". The specific network environment may specifically be a weak network environment, and the embodiment of the present invention may configure a value of the weak network environment, where the default effectiveType value is "2g", the weak network environment is the weak network environment, and if the effectiveType value is "2g", it is described that the network environment where the web page is located is poor, and at this time, a client screenshot is used. The effectiveType values of "2g" and "3g" can also be configured as a weak mesh environment, that is, the effectiveType values of "2g" and "3g" are both weak mesh environments.

Acquiring a page style of a webpage to be captured, which may specifically include: the method comprises the steps that a style obtaining request is sent to a preset interface of a server side, an API interface can be realized on the server side, the API interface of the server side calls a cssstats API interface, the API interface of the server side can obtain style attribute information of a webpage, the preset interface is the API interface of the server side, and cssstats is an online css code analysis tool. The style acquisition request comprises an address (URL) of a webpage to be captured; receiving an object returned by a preset interface response style acquisition request of a server; and obtaining one or more styles of an external style, an internal style and an embedded style in the webpage to be captured according to the attributes of the cascading style sheet (css) and the style (style) in the returned object. The css attribute in the object is a character string which comprises an external connection style and an internal connection style of the page; the style property in the object is an array that includes all embedded styles on the page.

Checking the attributes in the page style specifically comprises: judging whether a page style attribute which is not supported by the screenshot plug-in exists in the character string of the cascading style sheet attribute, and traversing each element in the array of the style attribute to judge whether the page style attribute which is not supported by the screenshot plug-in exists in the style attribute.

In one embodiment, the screenshot plug-in is an html2canvas, the html2canvas is a library of web screenshots written using JavaScript language, and the html and css style attributes on the web page are rendered on the canvas image, and then the client can save the canvas image, thereby implementing the web screenshots. The screenshot is carried out on the webpage to be screenshot through the screenshot plug-in, and the specific steps can include: selecting an element to be captured of the configured webpage to be captured to obtain a canvas object, and converting the canvas object into a base64 image; creating an a label, configuring the href attribute of the a label as a base64 image, and configuring the download attribute of the a label as the screenshot data name of a webpage to be screenshot; and downloading screenshot data of the webpage to be screenshot by triggering a click event of the label a, and then deleting the label a.

The webpage screenshot request sent to the server side comprises a screenshot format of a webpage to be screenshot, and the screenshot format can be a PDF format or an image format.

In one embodiment, the screenshot format is a PDF format. Before sending the webpage screenshot request to the server, the client may add the page format of the PDF (e.g., "A4", "A3", "A5", etc.) to the webpage screenshot request.

In another embodiment, the screenshot format is an image format. And before sending the webpage screenshot request to the server side, the client side can receive input personalized display configuration through a preset interface, the personalized display configuration comprises personalized display information and display positions of the personalized display information, and the personalized display configuration is added into the webpage screenshot request. The preset interface can be in a popup window form, and the client pops up a popup window when calling the screenshot of the server to prompt the user whether to add personalized display information (such as a user name). If the user selects yes (i.e., adds the personalized display information), the web page prompts the user to input the personalized display information and selects the display position (e.g., upper left, upper right, lower left, lower right, etc.) of the personalized display information on the screenshot. And after the user fills in the display information and the display position, the webpage sends the 2 pieces of information to the server side along with the webpage screenshot request.

And under the condition that the screenshot format is the PDF format, the screenshot data of the webpage to be screenshot is the PDF file generated by screenshot of the webpage to be screenshot, and under the condition that the screenshot format is the image format, the screenshot data of the webpage to be screenshot is the screenshot image generated by screenshot of the webpage to be screenshot.

Fig. 2 is a schematic diagram of main steps of a web page screenshot method according to another embodiment of the present invention. As shown in fig. 2, the method for screenshot in a web page of this embodiment mainly includes the following steps S201 to S203. The webpage screenshot method of the embodiment is executed at the server side.

Step S201: receiving a webpage screenshot request of a webpage to be screenshot, which is sent by a client, wherein the webpage screenshot request comprises request parameters, and the request parameters comprise the address and screenshot configuration of the webpage to be screenshot;

step S202: inquiring whether stored screenshot data of the webpage to be screenshot exists or not according to the request parameters;

the stored screenshot data of the webpage to be screenshot means that the screenshot data is stored at the server.

Step S203: under the condition that the stored screenshot data of the webpage to be screenshot exists, returning the stored screenshot data of the webpage to be screenshot to the client; and under the condition that the stored screenshot data of the webpage to be screenshot does not exist, opening the address of the webpage to be screenshot in the specific browser, generating the screenshot data of the webpage to be screenshot according to screenshot configuration, and returning the generated screenshot data to the client. A particular browser, such as a headless browser.

Inquiring whether stored screenshot data of the webpage to be screenshot exists or not according to the request parameters, wherein the method specifically comprises the following steps: and performing MD5 operation on the request parameter, judging whether the obtained MD5 value is the same as a stored MD5 value, if so, storing screenshot data of the webpage to be screenshot, otherwise, not storing the screenshot data of the webpage to be screenshot.

And after generating the screenshot data of the webpage to be screenshot, saving the screenshot data of the webpage to be screenshot by taking an MD5 value obtained by performing MD5 operation according to the request parameter as the file name of the screenshot data of the webpage to be screenshot.

And each stored MD5 value of the server is the file name of each screenshot data.

The screenshot configuration includes a screenshot format, which may be a PDF format or an image format.

In one embodiment, the screenshot format is a PDF format, and the screenshot configuration also includes a page format of the PDF. Generating screenshot data of a webpage to be screenshot according to screenshot configuration, and returning the generated screenshot data to a client, which may specifically include: configuring the page format of the webpage to be captured into the page format of PDF, calling a PDF application program interface (PDF API), capturing the screenshot of the webpage to be captured to obtain a PDF file of the webpage to be captured, and returning the PDF file to the client.

In another embodiment, the screenshot format is an image format, such as "png", "jpg", etc., and the screenshot configuration further includes a personalized display configuration, which includes personalized display information and a display location of the personalized display information. Generating screenshot data of a webpage to be screenshot according to screenshot configuration, and returning the generated screenshot data to a client, which may specifically include: calling a screenshot application program interface (screenshot API) to obtain a first screenshot image in an image format corresponding to the webpage to be screenshot; and acquiring personalized display information and the display position of the personalized display information from the personalized display configuration, adding the personalized display information to the first screenshot image according to the display position to obtain a second screenshot image, and returning the second screenshot image to the client.

FIG. 3 is a schematic diagram of a webpage screenshot flow according to an embodiment of the present invention. As shown in fig. 3, when screenshot interaction on a web page starts (for example, a sharing button on the web page is clicked) (S301), a client acquires a device network environment (that is, network environment information of the client) (S302), determines whether the client device is in a weak network environment (S303), and if the device network is in the weak network environment, uses a client screenshot (S304); if the device network environment is better (i.e. not in the weak network environment), then the css style attribute of the screenshot page is obtained (S305), and then the client detects whether the obtained style attribute contains a style that is not supported by the canvas image (S306), that is, whether a page style attribute that is not supported by the screenshot plug-in exists in the style attribute of the webpage to be screenshot is judged. If the style on the webpage to be captured is supported by the canvas image and indicates that the attribute in the page style of the webpage to be captured passes the verification, capturing the webpage by using a client browser (S308); otherwise, the screenshot of the webpage of the server is executed (i.e. the screenshot is executed by the server) (S307), specifically, the webpage is screenshot by using the headless browser of the server, and the screenshot data (PDF or screenshot image) generated by the screenshot is returned to the browser of the client.

When the client side obtains the network environment of the equipment, the JavaScript script is used for obtaining the network environment information of the webpage to be captured, and the network environment information is obtained from the connection of the navigator attribute of the webpage browser, wherein the network environment information comprises the following steps: the return network connection state NetworkInformation object comprises downlink (network downlink speed), effectiveType (network type), change (value representing network state change) and rtt (estimated round trip time), etc.

The effectvetype (network type) includes: "2g", "3g" and "4g". If the value of the effectiveType is '2 g', the network environment where the webpage is located is poor, and at the moment, the client-side screenshot is used.

The embodiment of the invention can configure the value of the weak network environment, for example, the weak network environment is determined when the default effectiveType value is '2 g'. The effectiveType values of "2g" and "3g" can also be configured as a weak mesh environment, that is, the effectiveType values of "2g" and "3g" are both weak mesh environments.

The web page styles (i.e., page styles) can be classified into three types, i.e., an external style, an embedded style, and an internal style. The external connection style is introduced by using link or @ import, and the style file of the external connection style can be used as a plurality of pages, so that the reusability and the maintainability are improved. As follows:

the inline style is a style tag which is generally placed in a page, a style is defined in the style tag, and the scope of action is the style of the page. As follows:

the embedded style is directly introduced into the label, and the style of the label can be directly modified. As follows:

< div style = "width:70px; height:70px; "> Embedded type style >

The cs styles on the web page may include one or more of the above three styles.

The embodiment of the invention can realize an API interface at the server side, the API interface of the server side calls the cssstats API interface, and the API interface of the server side can acquire the style attribute information of the webpage.

The client-side web browser to be captured sends a request (namely a style acquisition request) to the server-side API interface to acquire the style of the page. The request parameter of the style acquisition request is a URL (address) of the present page. The request return information is an object, the css attribute in the object is a character string, and the character string comprises an external connection style and an internal connection style of the page; the style property in the object is an array that includes all embedded styles on the page.

The client uses html2canvas (namely the screenshot plug-in of the embodiment of the invention) to screenshot the webpage, the html2canvas is a database of webpage screenshots written by JavaScript language, and the html and css style attributes on the webpage are rendered on the canvas image, and then the client can store the canvas image, so that the webpage screenshot is realized, and the screenshot is quicker and simpler to operate by using the html2canvas.

However, html2canvas does not support all css styles, where the css style attributes that html2canvas does not support are:

(1) Mixed mode of background layer: background-blend-mode

(2) Frame background: border-image

(3) Element style when crossing rows, columns, or pages: box-decoding-break

(4) Element shading: box-shadow

(5) A filter lens: filter

(6) Font variant ligature: font-variant-ligatures

(7) Parent content of elements and background mix of elements: mix-blend-mode

(8) How the content of an element should fit into the height and width of a given container: object-fit

(9) Creating a repetitive linear-gradient "image")

(10) How the text is arranged in the horizontal or vertical direction writing-mode

(11) Element scaling: zoom

(12) Element change: transform

The css attribute is an attribute that is not supported by the html2canvas, and the 12 characters are traversed in the acquired page style attribute (namely, the css style attribute) of the webpage to be captured, so as to check whether the acquired css style includes the style attribute that is not supported by the html2canvas.

Fig. 4 is a flowchart illustrating a process of detecting whether a canvas image supports a cs style of a web page according to an embodiment of the present invention. As shown in fig. 4, a page style of a web page to be screenshot is obtained, that is, a css style of the web page is obtained (S401), a request return message returned by a preset interface of a server in response to the style obtaining request is an object, a css attribute in the object is a character string, whether any one of the 12 unsupported styles exists in the character string is queried (S402), if so, the server performs screenshot of the web page (S405), and if not, S403 is performed.

The style attribute in the object is an array, and each element of the array is traversed in a loop to determine whether any one of the 12 unsupported styles is included (S403), if so, the server performs screenshot (S405), and if not, the client performs screenshot (S404).

Fig. 5 is a schematic diagram of a main flow of a screenshot of a client webpage according to an embodiment of the present invention, and as shown in fig. 5, the main flow of the screenshot of the client webpage (i.e. the screenshot operation performed by the client) is as follows:

s501: introduce the html2canvas library file.

S502: the element to be screenshot is selected (body element, i.e. the whole page of the screenshot is selected), the element to be screenshot is configurable, and a canvas object is returned.

S503: the canvas object is converted to a base64 image using the toDataURL.

S504: and creating an a label, configuring an href attribute as a base64 image, and configuring a download attribute as the name of the screenshot image.

S505: and triggering a click event of the label a to realize downloading of the screenshot image.

S506: and deleting the created a label.

Fig. 6 is a schematic diagram of a main flow of a server screenshot according to an embodiment of the present invention, and as shown in fig. 6, the server screenshot (where a server executes screenshot operation) uses a puppeteer library (a nodjs library) to implement screenshot of a web page, and the puppeteer may create a headless browser on the server, so as to re-render the web page to be screenshot, thereby implementing the screenshot of the web page. The main flow of screenshot of the server side is as follows:

s601: the client sends a screenshot request (namely a webpage screenshot request), and request parameters of the webpage screenshot request comprise:

(1) url: a web page address URL.

(2) And (2) width: the width of the web page.

(3) height: web page height.

(4) imgType: screenshot image types, e.g. "png", "jpg", etc

(5) pdf: and if the output is pdf, if the output is true, the screenshot output is pdf file.

(6) And (3) format: the page format of pdf can be set to "A4", "A3", "A5", etc.

S602: performing MD5 operation on the request parameters (namely MD5 in figure 6), and judging whether a picture (screenshot image) or pdf file with the file name same as the generated MD5 value (namely MD5 value in figure 6) exists on the server; if yes, executing S603, otherwise, executing S604;

s603: the picture or pdf is returned directly.

S604: the server creates a headless browser using the launch API.

S605: a page is opened using newPage at the headless browser.

This web address is opened in the headless browser according to the URL in the request.

S606: judging whether the pdf is true; if the pdf is configured as fasle, S612 to S616 are sequentially performed, and if the pdf is configured as true, S607 to S611 are sequentially performed.

Specifically, if the pdf is configured as a fable, the page size of the headless browser is configured by using the width and height in the request (S612), a page requiring screenshot is opened (S613), the type of the screenshot image is configured according to imgType (indicating the type of the screenshot image) in the request parameters, and the encoding format of the screenshot image is configured as base64 (S614); calling a screenshot API to perform screenshot on the webpage, performing MD5 operation on the request parameter, saving the picture on the server by taking the MD5 value as a file name, closing the headless browser (S615), and returning a base64 image, namely the screenshot image to the client (S616). The screenshot image may be a first screenshot image, that is, a screenshot image without adding personalized display information, or a second screenshot image, that is, a screenshot image with personalized display information added, and for a case of the second screenshot image, a process of adding the personalized display information will be described below and is omitted in this embodiment.

If the pdf is configured as true, configuring the format of the screenshot page according to the format in the request (S607), opening the page needing screenshot (S608), calling the pdf API to capture the webpage to generate a pdf file (S609), performing MD5 operation on the request parameter according to the request parameter, storing the pdf on the server by taking the MD5 value as the file name, closing the headless browser (S610), and returning the pdf file to the client (S611).

Fig. 7 is a schematic flowchart of adding personalized display information to the screenshot by the server according to an embodiment of the present invention. When the client calls the screenshot of the server, a popup window pops up to prompt the user whether to add personalized display information (such as the user name). If the user selects yes (i.e. selects to add the personalized display information), the webpage prompts the user to input the personalized display information, and selects the display position (upper left, upper right, lower left, lower right, etc.) of the personalized display information on the screenshot. After the user fills in the display information and the information display position, the webpage sends the 2 pieces of information to the server along with the webpage screenshot request. The personalized display information of the embodiment of the invention is not limited to the user name, and can be other information customized by the user. Fig. 7 illustrates the main steps of adding personalized display information to a screenshot (non-PDF) of an image format.

The server obtains personalized display information (such as a user name) from the webpage screenshot request, obtains a picture (which refers to a first screenshot image) in a base64 format generated by the screenshot of the server, and adds information to the picture by using a gm picture processing library (a library for processing pictures). The main flow of adding information to the picture is as follows:

s701: the picture is read to the gm function. The parameter of the gm function is the path of the picture.

S702: and acquiring information to be added, namely acquiring personalized display information.

S703: an information text font library (font) is set.

S704: the font size (fontSize) of the information text is set.

S705: the color (fill) of the information text is set.

S706: drawing a text, drawText (x, y, content), wherein x and y represent an abscissa and an ordinate, and content represents text content, in particular content of personalized display information. The values of x and y are configured according to the display position (upper left, upper right, lower left, lower right, etc.) of the selected personalized display information on the screenshot.

S707: and storing the pictures added with the personalized display information in the server.

S708: and returning the pictures added with the personalized display information to the browser.

Fig. 8 is a schematic diagram of main modules of a web page screenshot device according to an embodiment of the present invention. As shown in fig. 8, a web page screenshot apparatus 800 according to an embodiment of the present invention is located at a client, and mainly includes: an information acquisition module 801, a screenshot condition judgment module 802, and a screenshot execution module 803.

The information acquisition module 801 is configured to, after receiving the screenshot instruction, acquire network environment information of the client and a page style of a webpage to be screenshot; a screenshot condition judging module 802, configured to judge whether the client currently has a screenshot condition according to the network environment information of the client and the page style of the webpage to be screenshot; a screenshot executing module 803, configured to perform screenshot on a webpage to be screenshot through a screenshot plug-in when the client currently has a screenshot condition; and under the condition that the client does not have the screenshot condition at present, sending a webpage screenshot request to the server, and receiving screenshot data of the webpage to be screenshot returned by the server according to the webpage screenshot request.

The screenshot condition determining module 802 may be specifically configured to: judging whether the network environment information of the client indicates that the client is currently in a specific network environment, if so, determining that the client currently has a screenshot condition; if the network environment information of the client indicates that the client is not in the specific network environment currently, checking the attribute in the page style, wherein the check is used for judging the compatibility of the page style and the screenshot plug-in; under the condition that the verification is passed, determining that the client currently has screenshot conditions; and under the condition that the verification is not passed, determining that the client does not have the screenshot condition currently.

The information obtaining module 801 may specifically obtain the network connection status object of the client through a preset script, and extract the network type from the network connection status object.

The screenshot condition determining module 802 may determine whether it is currently in a specific network environment according to the network type.

The information acquisition module 801 may be specifically configured to send a style acquisition request to a preset interface of a server, where the style acquisition request includes an address of a web page to be screenshot; receiving an object returned by a preset interface response style acquisition request of a server; and obtaining one or more styles of an external style, an internal style and an embedded style in the webpage to be captured according to the attributes and the style attributes of the cascading style sheet in the returned object.

The screenshot condition determining module 802 is specifically configured to: judging whether a page style attribute which is not supported by the screenshot plug-in exists in the character string of the cascading style sheet attribute, and traversing each element in the array of the style attribute to judge whether the page style attribute which is not supported by the screenshot plug-in exists in the style attribute.

The screenshot plug-in is an html2canvas. The screenshot executing module 803 may be specifically configured to: selecting an element to be captured of the configured webpage to be captured to obtain a canvas object, and converting the canvas object into a base64 image; creating an a label, configuring the href attribute of the a label as a base64 image, and configuring the download attribute of the a label as the screenshot data name of a webpage to be screenshot; and downloading screenshot data of the webpage to be screenshot by triggering a click event of the label a, and then deleting the label a.

The webpage screenshot request sent to the server side comprises the screenshot format of the webpage to be screenshot.

In one embodiment, the screenshot format is a PDF format. The screenshot executing module 803 is further specifically configured to: the page format of the PDF is added to the web screenshot request.

In another embodiment, the screenshot format is an image format. Moreover, the screenshot executing module 803 is specifically further configured to: and receiving input personalized display configuration through a preset interface, wherein the personalized display configuration comprises personalized display information and a display position of the personalized display information, and adding the personalized display configuration into the webpage screenshot request.

Fig. 9 is a schematic diagram of main modules of a web page screenshot device according to another embodiment of the present invention. The screenshot device 900 of the web page is located at the server, and the screenshot device 900 of the web page includes: a request receiving module 901, configured to receive a web page screenshot request of a web page to be screenshot, where the web page screenshot request includes request parameters, and the request parameters include an address and screenshot configuration of the web page to be screenshot; a data query module 902, configured to query whether stored screenshot data of the webpage to be screenshot exists according to the request parameter; the screenshot module 903 is used for returning the stored screenshot data of the webpage to be screenshot to the client under the condition that the stored screenshot data of the webpage to be screenshot exists; and under the condition that the stored screenshot data of the webpage to be screenshot does not exist, opening the address of the webpage to be screenshot in the specific browser, generating the screenshot data of the webpage to be screenshot according to screenshot configuration, and returning the generated screenshot data to the client.

The data query module 902 is specifically configured to: and performing MD5 operation on the request parameter, judging whether the obtained MD5 value is the same as an already stored MD5 value, if so, storing screenshot data of the webpage to be screenshot, otherwise, not storing the screenshot data of the webpage to be screenshot.

The screenshot module 903 is specifically further configured to: and taking the MD5 value obtained by performing MD5 operation according to the request parameter as the file name of the screenshot data of the webpage to be screenshot, and storing the screenshot data of the webpage to be screenshot.

The screenshot configuration comprises a screenshot format, and the screenshot format is a PDF format or an image format.

In one embodiment, the screenshot configuration also includes the page format of the PDF; the screenshot module 903 is specifically further configured to: and configuring the page format of the webpage to be captured into the page format of PDF, calling a PDF application program interface, capturing the image of the webpage to be captured to obtain a PDF file of the webpage to be captured, and returning the PDF file to the client.

In another embodiment, the screenshot format is an image format, and the screenshot configuration further includes a personalized display configuration, the personalized display configuration including personalized display information and a display location of the personalized display information. The screenshot module 903 is further specifically configured to: calling a screen capture application program interface to obtain a first capture image in an image format corresponding to a web page to be captured; and acquiring personalized display information and the display position of the personalized display information from the personalized display configuration, adding the personalized display information to the first screenshot image according to the display position to obtain a second screenshot image, and returning the second screenshot image to the client.

Fig. 10 illustrates an exemplary system architecture 1000 to which a web page screenshot method or web page screenshot apparatus of an embodiment of the present invention may be applied.

As shown in fig. 10, the system architecture 1000 may include

terminal devices

1001, 1002, 1003, a network 1004, and a server 1005. The network 1004 is used to provide a medium for communication links between the

terminal devices

1001, 1002, 1003 and the server 1005. Network 1004 may include various types of connections, such as wire, wireless communication links, or fiber optic cables, to name a few. A user may use the

terminal devices

1001, 1002, 1003 to interact with a server 1005 via a network 1004 to receive or transmit messages or the like. The

terminal devices

1001, 1002, 1003 may have installed thereon various messenger client applications such as shopping applications, web browser applications, search applications, instant messenger, mailbox clients, social platform software, etc. (by way of example only).

The

terminal devices

1001, 1002, 1003 may be various electronic devices having a display screen and supporting web browsing, including but not limited to smart phones, tablet computers, laptop portable computers, desktop computers, and the like. The server 1005 may be a server that provides various services, such as a backend management server (for example only) that supports shopping websites browsed by users using the

terminal devices

1001, 1002, 1003. The backend management server may analyze and perform other processing on the received data such as the product information query request, and feed back a processing result (for example, target push information, product information — just an example) to the terminal device.

It should be noted that the method for screenshot in a web page provided by the embodiment of the present invention is generally executed by the server 1005 or the

terminal devices

1001, 1002, and 1003, and accordingly, the apparatus for screenshot in a web page is generally disposed in the server 1005 or the

terminal devices

1001, 1002, and 1003.

It should be understood that the number of terminal devices, networks, and servers in fig. 10 is merely illustrative. There may be any number of terminal devices, networks, and servers, as desired for implementation.

Referring now to FIG. 11, shown is a block diagram of a computer system 1100 suitable for use in implementing a terminal device or server of an embodiment of the present application. The terminal device or the server shown in fig. 11 is only an example, and should not bring any limitation to the functions and the use range of the embodiment of the present application.

As shown in fig. 11, the computer system 1100 includes a Central Processing Unit (CPU) 1101 that can perform various appropriate actions and processes in accordance with a program stored in a Read Only Memory (ROM) 1102 or a program loaded from a storage section 1108 into a Random Access Memory (RAM) 1103. Also stored in the RAM 1103 are various programs and data required for the operation of the system 1100. The CPU 1101, ROM 1102, and RAM 1103 are connected to each other by a bus 1104. An input/output (I/O) interface 1105 is also connected to bus 1104. The following components are connected to the I/O interface 1105: an input portion 1106 including a keyboard, mouse, and the like; an output portion 1107 including a signal such as a Cathode Ray Tube (CRT), a Liquid Crystal Display (LCD), and a speaker; a storage section 1108 including a hard disk and the like; and a communication section 1109 including a network interface card such as a LAN card, a modem, or the like. The communication section 1109 performs communication processing via a network such as the internet. A driver 1110 is also connected to the I/O interface 1105 as necessary. A removable medium 1111 such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, or the like is mounted on the drive 1110 as necessary, so that a computer program read out therefrom is mounted into the storage section 1108 as necessary.

In particular, according to embodiments of the present disclosure, the processes described above with reference to the flow diagrams may be implemented as computer software programs. For example, embodiments of the present disclosure include a computer program product comprising a computer program embodied on a computer readable medium, the computer program comprising program code for performing the method illustrated in the flow chart. In such an embodiment, the computer program may be downloaded and installed from a network through the communication portion 1109 and/or installed from the removable medium 1111. The computer program, when executed by the Central Processing Unit (CPU) 1101, performs the above-described functions defined in the system of the present application.

It should be noted that the computer readable medium shown in the present invention can be a computer readable signal medium or a computer readable storage medium or any combination of the two. A computer readable storage medium may be, for example, but not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination of the foregoing. More specific examples of the computer readable storage medium may include, but are not limited to: an electrical connection having one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing. In the present application, a computer readable storage medium may be any tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device. In this application, however, a computer readable signal medium may include a propagated data signal with computer readable program code embodied therein, for example, in baseband or as part of a carrier wave. Such a propagated data signal may take any of a variety of forms, including, but not limited to, electro-magnetic, optical, or any suitable combination thereof. A computer readable signal medium may also be any computer readable medium that is not a computer readable storage medium and that can communicate, propagate, or transport a program for use by or in connection with an instruction execution system, apparatus, or device. Program code embodied on a computer readable medium may be transmitted using any appropriate medium, including but not limited to: wireless, wire, fiber optic cable, RF, etc., or any suitable combination of the foregoing.

The flowchart and block diagrams in the figures illustrate the architecture, functionality, and operation of possible implementations of systems, methods and computer program products according to various embodiments of the present application. In this regard, each block in the flowchart or block diagrams may represent a module, segment, or portion of code, which comprises one or more executable instructions for implementing the specified logical function(s). It should also be noted that, in some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams or flowchart illustration, and combinations of blocks in the block diagrams or flowchart illustration, can be implemented by special purpose hardware-based systems which perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.

The modules described in the embodiments of the present invention may be implemented by software or hardware. The described modules may also be provided in a processor, which may be described as: a processor comprises an information acquisition module, a screenshot condition judgment module and a screenshot execution module. The names of these modules do not form a limitation on the module itself in some cases, for example, the information obtaining module may also be described as a "module for obtaining the network environment information of the client and the page style of the web page to be screenshot after receiving the screenshot instruction".

As another aspect, the present invention also provides a computer-readable medium that may be contained in the apparatus described in the above embodiments; or may be separate and not incorporated into the device. The computer readable medium carries one or more programs which, when executed by a device, cause the device to comprise: after receiving a screenshot command, acquiring network environment information of a client and a page style of a webpage to be screenshot; judging whether the client side has a screenshot condition currently or not according to the network environment information of the client side and the page style of the webpage to be screenshot; under the condition that the client side currently has the screenshot condition, screenshot is carried out on the webpage to be screenshot through a screenshot plug-in; and under the condition that the client does not have the screenshot condition at present, sending a webpage screenshot request to a server, and receiving screenshot data of the webpage to be screenshot, which is returned by the server according to the webpage screenshot request.

According to the technical scheme of the embodiment of the invention, whether the client side has the screenshot condition at present is judged according to the network environment information of the client side and the page style of the webpage to be screenshot, and the screenshot of the webpage to be screenshot is carried out through the screenshot plug-in unit under the condition that the client side has the screenshot condition; and under the condition that the screenshot condition is not met, sending a webpage screenshot request to the server, and receiving screenshot data of the webpage to be screenshot, which is returned by the server according to the webpage screenshot request. The method and the device can ensure that the screenshot is not distorted, improve the screenshot response speed and performance, and realize personalized screenshot functions of personalized configuration of the element to be screenshot, the screenshot format, personalized display information and the like.

The above-described embodiments should not be construed as limiting the scope of the invention. Those skilled in the art will appreciate that various modifications, combinations, sub-combinations, and substitutions can occur, depending on design requirements and other factors. Any modification, equivalent replacement, and improvement made within the spirit and principle of the present invention should be included in the protection scope of the present invention.

Claims

1. A method for screenshot of a web page, comprising:

after receiving a screenshot command, acquiring network environment information of a client and a page style of a webpage to be screenshot;

judging whether the client side has a screenshot condition at present according to the network environment information of the client side and the page style of the webpage to be screenshot;

under the condition that the client currently has the screenshot condition, screenshot is carried out on the webpage to be screenshot through a screenshot plug-in;

under the condition that the client does not have the screenshot condition at present, sending a webpage screenshot request to a server, and receiving screenshot data of the webpage to be screenshot, which is returned by the server according to the webpage screenshot request;

the judging whether the client side has the screenshot condition currently or not according to the network environment information of the client side and the page style of the webpage to be screenshot comprises the following steps: judging whether the network environment information of the client indicates that the client is currently in a specific network environment or not, and if so, determining that the client currently has the screenshot condition; if the network environment information of the client indicates that the client is not in the specific network environment currently, checking the attribute in the page style, wherein the checking is used for judging the compatibility of the page style and the screenshot plug-in; determining that the client side has the screenshot condition currently under the condition that the verification is passed; and under the condition that the verification is not passed, determining that the client does not have the screenshot condition currently.

2. The method of claim 1, wherein the obtaining network environment information of the client comprises: acquiring a network connection state object of the client through a preset script, and extracting a network type from the network connection state object;

judging whether the network environment information of the client indicates that the client is currently in a specific network environment or not, wherein the judging comprises the following steps: and judging whether the network is currently in the specific network environment or not according to the network type.

3. The method of claim 1, wherein obtaining the page style of the webpage to be captured comprises:

sending a style acquisition request to a preset interface of the server, wherein the style acquisition request comprises an address of the webpage to be captured;

receiving an object returned by a preset interface of the server side in response to the style acquisition request;

and obtaining one or more styles of an external style, an internal style and an embedded style in the webpage to be captured according to the attributes and the style attributes of the cascading style sheet in the returned object.

4. The method of claim 3, wherein the checking the attributes in the page style comprises:

judging whether the page style attribute which is not supported by the screenshot plug-in exists in the character string of the cascading style sheet attribute, and traversing each element in the array of the style attribute to judge whether the page style attribute which is not supported by the screenshot plug-in exists in the style attribute.

5. The method of claim 1, wherein the screenshot plug-in is an html2canvas.

6. The method of claim 1, wherein the web page screenshot request sent to the server includes a screenshot format of the web page to be screenshot, and the screenshot format is a PDF format;

and the client adds the PDF page format to the webpage screenshot request before sending the webpage screenshot request to the server.

7. The method according to claim 1, wherein the web page screenshot request sent to the server includes a screenshot format of the web page to be screenshot, and the screenshot format is an image format; and also,

the client receives input personalized display configuration through a preset interface before sending the webpage screenshot request to the server, wherein the personalized display configuration comprises personalized display information and display positions of the personalized display information, and the personalized display configuration is added to the webpage screenshot request.

8. A method for screenshot of a web page, comprising:

receiving a webpage screenshot request of a webpage to be screenshot, which is sent by a client, wherein the webpage screenshot request comprises request parameters, and the request parameters comprise the address and screenshot configuration of the webpage to be screenshot;

inquiring whether stored screenshot data of the webpage to be screenshot exists or not according to the request parameter;

under the condition that the stored screenshot data of the webpage to be screenshot exists, returning the stored screenshot data of the webpage to be screenshot to the client;

under the condition that stored screenshot data of the webpage to be screenshot does not exist, opening the address of the webpage to be screenshot in a specific browser, generating the screenshot data of the webpage to be screenshot according to the screenshot configuration, and returning the generated screenshot data to the client;

the webpage screenshot request is sent by the client under the condition that the client does not have screenshot conditions according to the network environment information of the client and the page style of the webpage to be screenshot acquired after the client receives the screenshot command and the judgment result is that the client does not have screenshot conditions; judging whether the client side has a screenshot condition currently according to the network environment information of the client side and the page style of the webpage to be screenshot, wherein the judging comprises the following steps: judging whether the network environment information of the client indicates that the client is currently in a specific network environment, if so, determining that the client currently has the screenshot condition; if the network environment information of the client indicates that the client is not in the specific network environment currently, checking the attribute in the page style, wherein the checking is used for judging the compatibility of the page style and the screenshot plug-in; determining that the client side has the screenshot condition currently under the condition that the verification is passed; and under the condition that the verification fails, determining that the client does not have the screenshot condition currently.

9. The method of claim 8,

the inquiring whether stored screenshot data of the webpage to be screenshot exists or not according to the request parameter comprises the following steps:

performing MD5 operation on the request parameter, judging whether the obtained MD5 value is the same as an already stored MD5 value, if so, storing screenshot data of the webpage to be screenshot, otherwise, not storing the screenshot data of the webpage to be screenshot;

after generating the screenshot data of the webpage to be screenshot, the method further comprises the following steps:

and taking the MD5 value obtained by performing MD5 operation according to the request parameter as the file name of the screenshot data of the webpage to be screenshot, and storing the screenshot data of the webpage to be screenshot.

10. The method of claim 8, wherein the screenshot configuration comprises a screenshot format, wherein the screenshot format is a PDF format, and wherein the screenshot configuration further comprises a page format of the PDF;

generating screenshot data of the webpage to be screenshot according to the screenshot configuration, and returning the generated screenshot data to the client, wherein the screenshot data comprises:

and configuring the page format of the webpage to be captured into the page format of the PDF, calling a PDF application program interface, capturing the screenshot of the webpage to be captured to obtain a PDF file of the webpage to be captured, and returning the PDF file to the client.

11. The method of claim 8, wherein the screenshot configuration comprises a screenshot format, wherein the screenshot format is an image format, and further comprising a personalized display configuration comprising personalized display information and a display location of the personalized display information;

calling a screenshot application program interface to obtain a first screenshot image of the image format corresponding to the webpage to be screenshot;

and acquiring the personalized display information and the display position of the personalized display information from the personalized display configuration, adding the personalized display information to the first screenshot image according to the display position to obtain a second screenshot image, and returning the second screenshot image to the client.

12. A web page screen capture apparatus, comprising:

the information acquisition module is used for acquiring the network environment information of the client and the page style of the webpage to be subjected to screenshot after receiving the screenshot command;

the screenshot condition judging module is used for judging whether the client side has a screenshot condition currently according to the network environment information of the client side and the page style of the webpage to be screenshot;

the screenshot executing module is used for carrying out screenshot on the webpage to be screenshot through the screenshot plug-in under the condition that the client side has the screenshot condition currently; under the condition that the client does not have the screenshot condition at present, sending a webpage screenshot request to a server, and receiving screenshot data of the webpage to be screenshot, which is returned by the server according to the webpage screenshot request;

the judging whether the client side has the screenshot condition currently or not according to the network environment information of the client side and the page style of the webpage to be screenshot comprises the following steps: judging whether the network environment information of the client indicates that the client is currently in a specific network environment, if so, determining that the client currently has the screenshot condition; if the network environment information of the client indicates that the client is not in the specific network environment currently, checking the attribute in the page style, wherein the checking is used for judging the compatibility of the page style and the screenshot plug-in; under the condition that the verification is passed, determining that the client side currently has the screenshot condition; and under the condition that the verification is not passed, determining that the client does not have the screenshot condition currently.

13. A web page screenshot device, comprising:

the system comprises a request receiving module, a request receiving module and a display module, wherein the request receiving module is used for receiving a webpage screenshot request of a webpage to be screenshot, the webpage screenshot request comprises request parameters, and the request parameters comprise the address and screenshot configuration of the webpage to be screenshot;

the data query module is used for querying whether stored screenshot data of the webpage to be screenshot exists or not according to the request parameter;

the screenshot module is used for returning the stored screenshot data of the webpage to be screenshot to the client under the condition that the stored screenshot data of the webpage to be screenshot exists; under the condition that stored screenshot data of the webpage to be screenshot does not exist, opening the address of the webpage to be screenshot in a specific browser, generating the screenshot data of the webpage to be screenshot according to the screenshot configuration, and returning the generated screenshot data to the client;

the webpage screenshot request is sent by the client under the condition that the client does not have screenshot conditions according to the network environment information of the client and the page style of the webpage to be screenshot acquired after the client receives the screenshot command; judging whether the client side has a screenshot condition currently according to the network environment information of the client side and the page style of the webpage to be screenshot, wherein the judging comprises the following steps: judging whether the network environment information of the client indicates that the client is currently in a specific network environment, if so, determining that the client currently has the screenshot condition; if the network environment information of the client indicates that the client is not in the specific network environment currently, checking the attribute in the page style, wherein the checking is used for judging the compatibility of the page style and the screenshot plug-in; under the condition that the verification is passed, determining that the client side currently has the screenshot condition; and under the condition that the verification fails, determining that the client does not have the screenshot condition currently.

14. An electronic device, comprising:

one or more processors;

a memory for storing one or more programs,

the one or more programs, when executed by the one or more processors, cause the one or more processors to implement the method recited in any of claims 1-11.

15. A computer-readable medium, on which a computer program is stored which, when being executed by a processor, carries out the method according to any one of claims 1-11.