CN110647695A - Method and device for converting webpage data into picture attachment - Google Patents
Method and device for converting webpage data into picture attachment Download PDFInfo
- Publication number
- CN110647695A CN110647695A CN201910739135.2A CN201910739135A CN110647695A CN 110647695 A CN110647695 A CN 110647695A CN 201910739135 A CN201910739135 A CN 201910739135A CN 110647695 A CN110647695 A CN 110647695A
- Authority
- CN
- China
- Prior art keywords
- canvas
- converting
- webpage
- attachment
- picture attachment
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/953—Querying, e.g. by the use of web search engines
- G06F16/9538—Presentation of query results
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/951—Indexing; Web crawling techniques
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
- G06F16/972—Access to data in other repository systems, e.g. legacy data or dynamic Web page generation
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T11/00—2D [Two Dimensional] image generation
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Data Mining & Analysis (AREA)
- General Engineering & Computer Science (AREA)
- Information Transfer Between Computers (AREA)
Abstract
The invention discloses a method and a device for converting webpage data into picture attachments, wherein the method for converting the webpage data into the picture attachments comprises the following steps: judging whether a signal that a user triggers a conversion button is received, and entering an operation program for converting webpage data into an image attachment after the conversion button is triggered; if so, generating a Canvas on the webpage, and drawing the webpage data into the Canvas to form a first Canvas; and converting the first Canvas into a target picture attachment, and exporting and saving the target picture attachment. The invention solves the problem that in the prior art, students can only use a browser to access teaching resources, and the operations such as local storage, labeling and the like of the teaching resources are inconvenient.
Description
Technical Field
The present invention relates to the field of web page processing application technologies, and in particular, to a method and an apparatus for converting web page data into an image attachment.
Background
At present, most of teaching resources in many education and training companies are displayed to students in a webpage form. However, the form of the web page has certain limitation, namely, under the condition of network disconnection, students are very inconvenient to access teaching resources. In addition, as the students can only use the browser to access the teaching resources (no matter at a computer end or a mobile phone end), the students are inconvenient to locally store the teaching resources and do operations similar to labeling and the like. In many educational systems, only the form of picture attachments are supported for distributing or reading material.
Disclosure of Invention
The embodiment of the invention provides a method and a device for converting webpage data into a picture attachment, which aim to solve the problems that in the prior art, students can only use a browser to access teaching resources, and operations such as local storage and labeling of the teaching resources are inconvenient.
In order to solve the above technical problem, a first technical solution adopted in the embodiments of the present invention is as follows:
a method for converting web page data into a picture attachment, comprising: judging whether a signal that a user triggers a conversion button is received, and entering an operation program for converting webpage data into an image attachment after the conversion button is triggered; if so, generating a Canvas on the webpage, and drawing the webpage data into the Canvas to form a first Canvas; and converting the first Canvas into a target picture attachment, and exporting and saving the target picture attachment.
Optionally, the generating a Canvas on a webpage page includes: the Canvas is generated on the Html webpage page using JavaScript code.
Optionally, the converting the first Canvas into a target picture attachment includes: cutting the first Canvas into a plurality of second Canvas with the same block size; converting all of the second Canvas into the target picture attachment using a JavaScript language.
Optionally, the cutting the first Canvas into a plurality of second Canvas with the same block size includes: and cutting the first Canvas into a plurality of second Canvas with the same block size according to the size of the specified paper, wherein each second Canvas has the same size as each specified paper.
Optionally, after the cutting the first Canvas into a plurality of second Canvas with the same block size, the method further includes: inserting page numbers on all of the second Canvas.
Optionally, the inserting page numbers on all of the second Canvas comprises: sequencing all the second Canvas according to the content sequence of the webpage data; and inserting page numbers corresponding to the ranking numbers of the second Canvas on each block according to the ranking of all the second Canvas canvases.
Optionally, the exporting and saving the target picture attachment includes: and storing the target picture attachment to a local database, and sending the storage address of the target picture attachment to a designated administrator.
In order to solve the above technical problem, a second technical solution adopted in the embodiments of the present invention is as follows:
an apparatus for converting web page data into a picture attachment, comprising: the system comprises a trigger judging module, a conversion module and a display module, wherein the trigger judging module is used for judging whether a signal that a user triggers a conversion button is received, and the conversion button enters an operation program for converting webpage page data into an image attachment after being triggered; the generation drawing module is used for generating Canvas on a webpage when a signal that a user triggers a conversion button is received, and drawing webpage data into the Canvas to form a first Canvas; and the conversion and storage module is used for converting the first Canvas into the target picture attachment and exporting and storing the target picture attachment.
In order to solve the above technical problem, a third technical solution adopted in the embodiments of the present invention is as follows:
a computer-readable storage medium, on which a computer program is stored, which, when executed, implements a method of converting webpage page data into a picture attachment as described above.
In order to solve the above technical problem, a fourth technical solution adopted in the embodiments of the present invention is as follows:
a computer apparatus comprising a processor, a memory and a computer program stored on the memory and executable on the processor, the processor implementing the method of converting web page data into a picture attachment as described above when executing the computer program.
The embodiment of the invention has the beneficial effects that: different from the situation of the prior art, the embodiment of the invention generates the Canvas on the webpage, draws the webpage data into the Canvas to form the first Canvas, converts the first Canvas into the target picture attachment, and finally exports and stores the target picture attachment, thereby solving the problems that in the prior art, students can only use a browser to access teaching resources, and the operations such as local storage, labeling and the like of the teaching resources are inconvenient.
Drawings
FIG. 1 is a flowchart illustrating an embodiment of a method for converting webpage data into a picture attachment according to a first embodiment of the present invention;
FIG. 2 is a partial structural frame diagram of an embodiment of a device for converting webpage data into a picture attachment according to a second embodiment of the present invention;
FIG. 3 is a partial structural framework diagram of an embodiment of a computer-readable storage medium according to a third embodiment of the present invention;
fig. 4 is a partial structural framework diagram of an embodiment of a computer device according to a fourth embodiment of the present invention.
Detailed Description
Example one
Referring to fig. 1, fig. 1 is a flowchart of an implementation of a method for converting webpage data into an image attachment according to an embodiment of the present invention, which can be obtained by combining fig. 1, and the method for converting webpage data into an image attachment according to the present invention includes:
step S101: and judging whether a signal that a user triggers a conversion button is received, wherein the conversion button enters an operation program for converting webpage page data into an image attachment after being triggered. In this step, before receiving a signal that the user triggers the conversion button, the programmer has written a processing code corresponding to a conversion event for converting the webpage data into the picture attachment, forming a corresponding conversion button, and the user can click the conversion button on the corresponding webpage to trigger a subsequent program for converting the Html webpage data into the picture attachment.
Step S102: and if a signal that a user triggers a conversion button is received, generating a Canvas on a webpage, and drawing webpage data into the Canvas to form a first Canvas. In this step, if a signal that the user triggers the conversion button is not received, the Canvas is not generated on the webpage.
Step S103: and converting the first Canvas into a target picture attachment, and exporting and saving the target picture attachment.
In this embodiment, optionally, the generating a Canvas on a webpage includes: the Canvas is generated on the Html webpage page using JavaScript code. Html, i.e. hypertext markup language, an application under the standard universal markup language. "hypertext" means that a page may contain pictures, links, and even non-textual elements such as music, programs, etc. The structure of the hypertext markup language includes a "Head" part (english: Head) that provides information about a web page, and a "Body" part (english: Body) that provides specific contents of the web page. The Canvas Chinese name is a "Canvas," which is a "container" of all UI components (user interface components) in the game. In one scenario, the existence of multiple Canvas objects may be allowed, and "nested" usage between the Canvas may also be allowed. Any UI object in the scene must be a "child level" of a Canvas object. The Canvas tag is used to render images (via script, usually JavaScript). However, the Canvas element itself has no drawing capability (it is merely a container for graphics) and must use scripts to accomplish the actual drawing task.
In this embodiment, optionally, the converting the first Canvas into the target picture attachment includes: cutting the first Canvas into a plurality of second Canvas with the same block size; converting all of the second Canvas into the target picture attachment using a JavaScript language. The Canvas element itself has no drawing capability and all drawing work must be done inside JavaScript. JavaScript is an transliterated script language, which is a dynamic type, weak type, prototype-based language and a built-in support type. Its interpreter, called JavaScript engine, is a part of the browser, a scripting language widely used on clients, and was originally used on Html (an application under the standard universal markup language) web pages to add dynamic functionality to the Html web pages.
In this embodiment, optionally, the cutting the first Canvas into a plurality of second Canvas with the same block size includes: and cutting the first Canvas into a plurality of second Canvas with the same block size according to the size of the specified paper, wherein each second Canvas has the same size as each specified paper.
In this embodiment, optionally, after the cutting the first Canvas into a plurality of second Canvas with the same block size, the method further includes: inserting page numbers on all of the second Canvas.
In this embodiment, optionally, the inserting page numbers on all of the second Canvas includes: sequencing all the second Canvas according to the content sequence of the webpage data; and inserting page numbers corresponding to the ranking numbers of the second Canvas on each block according to the ranking of all the second Canvas canvases.
In this embodiment, optionally, the exporting and saving the target picture attachment includes: and storing the target picture attachment to a local database, and sending the storage address of the target picture attachment to a designated administrator.
According to the embodiment of the invention, the Canvas is generated on the webpage, the webpage data is drawn into the Canvas to form the first Canvas, the first Canvas is converted into the target picture attachment, and finally the target picture attachment is exported and stored, so that the problem that in the prior art, students can only use a browser to access teaching resources, and the operations such as local storage, labeling and the like of the teaching resources are inconvenient is solved. The scheme of the invention realizes the conversion from the webpage data to the picture data, and can convert some templated webpages into pictures for distribution under the condition of network disconnection. If the contents are the same, the picture is exported and distributed by using the scheme of the invention, so that the user does not need to repeatedly visit the please-teach webpage, and the server load and the expense of the company are reduced. Compared with a network link form, the content distribution is carried out by using the pictures, and the safety degree is relatively high.
Example two
Referring to fig. 2, fig. 2 is a partial structural frame diagram of an embodiment of an apparatus for converting webpage data into image attachments according to the present invention, which can be obtained by referring to fig. 2, and the apparatus 100 for converting webpage data into image attachments according to the present invention includes:
the triggering judgment module 110 is configured to judge whether a signal that a user triggers a conversion button is received, where the conversion button enters an operation procedure of converting webpage data into an image attachment after being triggered.
The generating and drawing module 120 is configured to generate a Canvas on a webpage when a signal that a user triggers a conversion button is received, and draw the webpage data into the Canvas to form a first Canvas.
A conversion saving module 130, configured to convert the first Canvas into a target picture attachment, and export and save the target picture attachment.
According to the embodiment of the invention, the Canvas is generated on the webpage, the webpage data is drawn into the Canvas to form the first Canvas, the first Canvas is converted into the target picture attachment, and finally the target picture attachment is exported and stored, so that the problem that in the prior art, students can only use a browser to access teaching resources, and the operations such as local storage, labeling and the like of the teaching resources are inconvenient is solved.
EXAMPLE III
Referring to fig. 3, a computer-readable storage medium 10 according to an embodiment of the present invention is shown, for example: ROM/RAM, magnetic disk, optical disk, etc., on which a computer program 11 is stored, the computer program 11 when executed implementing the method for converting web page data into picture attachments according to an embodiment. Since the method for converting the webpage data into the image attachment has been described in detail in the first embodiment, the description is not repeated here.
According to the method for converting the webpage data into the picture attachment, which is realized by the embodiment of the invention, the Canvas is generated on the webpage, the webpage data is drawn into the Canvas to form the first Canvas, the first Canvas is converted into the target picture attachment, and finally the target picture attachment is exported and stored, so that the problems that in the prior art, students can only use a browser to access teaching resources, and operations such as local storage, labeling and the like of the teaching resources are inconvenient are solved.
Example four
Referring to fig. 4, a computer device 20 according to an embodiment of the present invention includes a processor 21, a memory 22, and a computer program 221 stored in the memory 22 and running on the processor 21, wherein the processor 21 executes the computer program 221 to implement the method for converting webpage data into an image attachment according to an embodiment. Since the method for converting the webpage data into the image attachment has been described in detail in the first embodiment, the description is not repeated here.
According to the method for converting the webpage data into the picture attachment, which is realized by the embodiment of the invention, the Canvas is generated on the webpage, the webpage data is drawn into the Canvas to form the first Canvas, the first Canvas is converted into the target picture attachment, and finally the target picture attachment is exported and stored, so that the problems that in the prior art, students can only use a browser to access teaching resources, and operations such as local storage, labeling and the like of the teaching resources are inconvenient are solved.
The above description is only an embodiment of the present invention, and not intended to limit the scope of the present invention, and all modifications of equivalent structures and equivalent processes performed by the present specification and drawings, or directly or indirectly applied to other related technical fields, are included in the scope of the present invention.
Claims (10)
1. A method for converting webpage data into picture attachments is characterized by comprising the following steps:
judging whether a signal that a user triggers a conversion button is received, and entering an operation program for converting webpage data into an image attachment after the conversion button is triggered;
if so, generating a Canvas on the webpage, and drawing the webpage data into the Canvas to form a first Canvas;
and converting the first Canvas into a target picture attachment, and exporting and saving the target picture attachment.
2. The method for converting webpage data into a picture attachment according to claim 1, wherein the generating a Canvas on the webpage comprises:
the Canvas is generated on the Html webpage page using JavaScript code.
3. The method for converting webpage page data into a picture attachment according to claim 1, wherein the converting the first Canvas into the target picture attachment comprises:
cutting the first Canvas into a plurality of second Canvas with the same block size;
converting all of the second Canvas into the target picture attachment using a JavaScript language.
4. The method for converting webpage data into a picture attachment according to claim 3, wherein the cropping the first Canvas into a plurality of second Canvas with the same block size comprises:
and cutting the first Canvas into a plurality of second Canvas with the same block size according to the size of the specified paper, wherein each second Canvas has the same size as each specified paper.
5. The method for converting webpage data into a picture attachment according to claim 3, wherein after the cropping the first Canvas into a plurality of second Canvas with the same block size, the method further comprises:
inserting page numbers on all of the second Canvas.
6. The method for converting webpage data into a picture attachment according to claim 5, wherein the inserting page numbers on all of the second Canvas comprises:
sequencing all the second Canvas according to the content sequence of the webpage data;
and inserting page numbers corresponding to the ranking numbers of the second Canvas on each block according to the ranking of all the second Canvas canvases.
7. The method for converting webpage data into image attachments according to claim 1, wherein the exporting and saving the target image attachments comprises:
and storing the target picture attachment to a local database, and sending the storage address of the target picture attachment to a designated administrator.
8. An apparatus for converting web page data into a picture attachment, comprising:
the system comprises a trigger judging module, a conversion module and a display module, wherein the trigger judging module is used for judging whether a signal that a user triggers a conversion button is received, and the conversion button enters an operation program for converting webpage page data into an image attachment after being triggered;
the generation drawing module is used for generating Canvas on a webpage when a signal that a user triggers a conversion button is received, and drawing webpage data into the Canvas to form a first Canvas;
and the conversion and storage module is used for converting the first Canvas into the target picture attachment and exporting and storing the target picture attachment.
9. A computer-readable storage medium, having stored thereon a computer program which, when executed, implements the method of converting webpage page data into a picture attachment according to any one of claims 1 to 7.
10. A computer device comprising a processor, a memory and a computer program stored on the memory and executable on the processor, wherein the processor implements the method for converting webpage data into a picture attachment according to any one of claims 1 to 7 when executing the computer program.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910739135.2A CN110647695A (en) | 2019-08-12 | 2019-08-12 | Method and device for converting webpage data into picture attachment |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910739135.2A CN110647695A (en) | 2019-08-12 | 2019-08-12 | Method and device for converting webpage data into picture attachment |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN110647695A true CN110647695A (en) | 2020-01-03 |
Family
ID=69009460
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201910739135.2A Pending CN110647695A (en) | 2019-08-12 | 2019-08-12 | Method and device for converting webpage data into picture attachment |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN110647695A (en) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114880611A (en) * | 2022-04-12 | 2022-08-09 | 上海哔哩哔哩科技有限公司 | Screenshot processing method and system |
Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103942199A (en) * | 2013-01-18 | 2014-07-23 | 腾讯科技（北京）有限公司 | Method and device for obtaining picture information on webpages and terminal |
| CN105868201A (en) * | 2015-01-20 | 2016-08-17 | 阿里巴巴集团控股有限公司 | Page generation method and apparatus |
| US20180033064A1 (en) * | 2016-07-29 | 2018-02-01 | Customer Focus Software Limited | Methods, systems, and devices for integrated product and electronic image fulfillment from database |
| CN107766359A (en) * | 2016-08-17 | 2018-03-06 | 广州市动景计算机科技有限公司 | A kind of method, apparatus and computing device that content of pages is converted to picture |
| CN109145242A (en) * | 2018-10-11 | 2019-01-04 | 北京神州泰岳软件股份有限公司 | The online sharing method of office documents, system and computer readable storage medium |
| CN109165357A (en) * | 2018-09-07 | 2019-01-08 | 北京三快在线科技有限公司 | Picture Generation Method, server, electronic equipment and readable storage medium storing program for executing |
| CN109670132A (en) * | 2018-12-18 | 2019-04-23 | 北京城市网邻信息技术有限公司 | A kind of page method for drafting, device, terminal device and storage medium |
| CN109740087A (en) * | 2018-11-23 | 2019-05-10 | 量子云未来（北京）信息科技有限公司 | A kind of picture rendering method, apparatus and system |
| CN110020320A (en) * | 2017-12-29 | 2019-07-16 | 北京京东尚科信息技术有限公司 | The method and apparatus for caching page pictures |
-
2019
- 2019-08-12 CN CN201910739135.2A patent/CN110647695A/en active Pending
Patent Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103942199A (en) * | 2013-01-18 | 2014-07-23 | 腾讯科技（北京）有限公司 | Method and device for obtaining picture information on webpages and terminal |
| CN105868201A (en) * | 2015-01-20 | 2016-08-17 | 阿里巴巴集团控股有限公司 | Page generation method and apparatus |
| US20180033064A1 (en) * | 2016-07-29 | 2018-02-01 | Customer Focus Software Limited | Methods, systems, and devices for integrated product and electronic image fulfillment from database |
| CN107766359A (en) * | 2016-08-17 | 2018-03-06 | 广州市动景计算机科技有限公司 | A kind of method, apparatus and computing device that content of pages is converted to picture |
| CN110020320A (en) * | 2017-12-29 | 2019-07-16 | 北京京东尚科信息技术有限公司 | The method and apparatus for caching page pictures |
| CN109165357A (en) * | 2018-09-07 | 2019-01-08 | 北京三快在线科技有限公司 | Picture Generation Method, server, electronic equipment and readable storage medium storing program for executing |
| CN109145242A (en) * | 2018-10-11 | 2019-01-04 | 北京神州泰岳软件股份有限公司 | The online sharing method of office documents, system and computer readable storage medium |
| CN109740087A (en) * | 2018-11-23 | 2019-05-10 | 量子云未来（北京）信息科技有限公司 | A kind of picture rendering method, apparatus and system |
| CN109670132A (en) * | 2018-12-18 | 2019-04-23 | 北京城市网邻信息技术有限公司 | A kind of page method for drafting, device, terminal device and storage medium |
Non-Patent Citations (1)
| Title |
|---|
| 朱文: "基于HTML5Canvas技术的在线图像处理方法的研究", 《中国优秀博硕士学位论文全文数据库(硕士)信息科技辑》 * |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114880611A (en) * | 2022-04-12 | 2022-08-09 | 上海哔哩哔哩科技有限公司 | Screenshot processing method and system |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN106991154B (en) | Webpage rendering method and device, terminal and server | |
| CN107885848B (en) | Webpage screen capturing method based on web technology | |
| CN103412928B (en) | Method and device for realizing browser page intelligent response-type layout on mobile terminal | |
| US9348929B2 (en) | Mobile mapping of quick response (QR) codes to web resources | |
| US10282410B2 (en) | Assistive technology for the impaired | |
| CN106484408A (en) | A kind of node relationships figure display methods based on HTML5 and system | |
| CN108040278A (en) | Active page processing method, server, system and the storage medium of smart television | |
| US20090085921A1 (en) | Populate Web-Based Content Based on Space Availability | |
| CN111144078B (en) | Method, device, server and storage medium for determining positions to be marked in PDF (portable document format) file | |
| CN110674437A (en) | Method and device for converting webpage data into PDF (Portable document Format) attachment | |
| CN109815451B (en) | PDF (Portable document Format) generation method, device and equipment | |
| CN107301046B (en) | Icon processing method and device, computer equipment and storage medium | |
| CN104050185A (en) | Zoom-display processing method and device for page contents | |
| CN110941950B (en) | Interface document generation method, device, server and storage medium | |
| CN104317570B (en) | The apparatus and method of dynamic analysis Web applications | |
| CN112800372B (en) | Page loading method and device and electronic equipment | |
| CN111915705A (en) | Picture visual editing method, device, equipment and medium | |
| CN104156421B (en) | The page shows method, apparatus and system | |
| CN112417338A (en) | Page adaptation method, system and equipment | |
| CN108984070B (en) | Method, apparatus, electronic device and readable medium for thermodynamic diagram imaging | |
| CN114791988A (en) | Browser-based PDF file analysis method, system and storage medium | |
| CN110162301B (en) | Form rendering method, form rendering device and storage medium | |
| CN111913566A (en) | Data processing method and device, electronic equipment and computer storage medium | |
| CN111523065A (en) | Rich text data processing method and device, electronic equipment and computer storage medium | |
| CN110647695A (en) | Method and device for converting webpage data into picture attachment |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20200103 |