Method and system for printing PDF file on webpage, storage medium, and device

Abstract

A method and system for printing a PDF file on a webpage, a storage medium, and a device. The method comprises the steps of: S1, creating a browser Blob file-like object by utilizing data of a PDF file to be printed; S2, creating a URL of the browser Blob file-like object; S3, creating an iframe and concealing same; S4, setting a nested page address of the iframe as the URL created in step S2; S5, putting the iframe into a body of a webpage document for rendering; S6, acquiring a window object of the iframe; and S7, executing a print method of the window object, and invoking a print interface of a printer to print content of an iframe window. The method achieves the purpose of directly printing a PDF file on a webpage, without relying on third-party software.

Description

Method, system, storage medium, and device for printing PDF files on web pages Technical Field

[0001] The present invention belongs to the field of printing technology, and in particular relates to a method, system, storage medium, and device for printing a PDF file on a web page. Background Art

[0002] Some information systems involve the printing needs of PDF files such as electronic invoices and electronic contracts. Since most of these systems are developed based on the browser model, the browser's default supported operations for PDF files on web pages are only preview or download. The Browser Object Model (BOM) does not provide an interface for directly printing PDF files.

[0003] Therefore, existing solutions for printing PDF files on web pages usually require opening the PDF file in a new tab of the current browser and then printing it on a separate preview page; or downloading the PDF file locally and printing it through locally installed related software, such as WPS or Adobe Reader; or installing a set of dedicated printing system software locally or on a dedicated server. When clicking "Print" on the web page, the PDF information to be printed is sent to the system software via a network request, and then printed. In addition, PDF files in the existing technology are mostly stored on the server as static resources, and then obtained from the web page through a URL with the suffix ".pdf". This method has poor security and is prone to leaking sensitive source files. It can also be easily captured by web crawlers.

[0004] Existing patents, such as the Chinese invention patent with application number CN202110342100.2, disclose a method for implementing direct printing of PDF files on a page without a plug-in. Although it does not require a browser plug-in, it must rely on the locally installed third-party software Adobe Reader. The interface printWithDialog called in the patent is a private interface provided by the Internet Explorer browser for the Adobe Reader software; therefore, as stated in its abstract, it is only applicable to the Internet Explorer browser and cannot be applied to current mainstream browsers such as Chrome, Edge, FireFox, etc.; the Internet Explorer browser itself was officially announced to be retired by Microsoft in June 2022 and replaced by the Edge browser.

[0005] For example, the Chinese invention patent application number CN201710719188.9 discloses an online printing system for PDF electronic invoice format files. Although it can achieve the goal of eliminating the need to manually download PDF files to the local computer and then import the files through a PDF reader for printing, and eliminating the need to directly open the PDF file through a browser and print on the preview page, it requires the deployment of a dedicated browser-independent printing system, and the PDF data must be sent to the corresponding system through an http network request before printing.

[0006] It can be seen that when printing a PDF file on a web page, the existing technical solutions either need to download the PDF, which may pose a security risk to the local storage of sensitive files; or require the use of third-party tools to complete the printing, which is relatively cumbersome.

[0007] Summary of the Invention

[0008] In response to the above-mentioned problems existing in the prior art, the present invention provides a method, system, storage medium, and device for printing PDF files on a web page, which achieves the purpose of directly printing PDF files on a web page without relying on third-party software.

[0009] The present invention adopts the following technical solutions:

[0010] A first aspect of an embodiment of the present invention provides a method for printing a PDF file on a webpage, comprising the steps of:

[0011] S1. Create a browser Blob class file object using the PDF file data to be printed;

[0012] S2. Create a URL for a browser Blob file object.

[0013] S3. Create an iframe and hide it;

[0014] S4. Set the nested page address of the iframe to the URL created in step S2;

[0015] S5. Place the iframe in the body of the web page document for rendering;

[0016] S6. Get the window object of the iframe;

[0017] S7. Execute the print method of the window object, invoke the printer print interface, and print the contents of the iframe window.

[0018] As a preferred solution, before step S1, the following steps are further included:

[0019] Assign a unique ID to the PDF file data to be printed and encrypt the data of the PDF file to be printed;

[0020] The server obtains the unique identification ID of the PDF file data to be printed through a preset interface, and returns the encrypted PDF file data to be printed based on the unique identification ID.

[0021] The browser requests a preset interface to preload and decrypt the encrypted PDF file data to be printed.

[0022] As a preferred solution, before step S1, the following steps are further included:

[0023] Determine whether the browser environment supports PDF file rendering. If not, prompt the user and end printing.

[0024] As a preferred solution, the step between step S5 and step S6 includes the step of obtaining the focus of the iframe.

[0025] As a preferred solution, in step S3, when creating an iframe, a predefined constant string is assigned to it as its frameId;

[0026] Before step S3, the method further includes a step of determining whether an iframe has been created based on a predefined constant string. If so, the created iframe is directly used and hidden before executing step S4.

[0027] A second aspect of an embodiment of the present invention provides a system for printing a PDF file on a web page, comprising a Blob file object creation module, a URL creation module, an attribute change module, a rendering module, a window object acquisition module, and a print execution module connected in sequence, and further comprising an iframe creation module connected to the attribute change module;

[0028] A Blob file object creation module is used to create a browser Blob file object using the PDF file data to be printed;

[0029] URL creation module, used to create the URL of the browser Blob class file object;

[0030] Iframe creation module, used to create an iframe and hide it;

[0031] The attribute replacement module is used to set the nested page address of the iframe to the URL created by the URL creation module;

[0032] The rendering module is used to put the iframe into the body of the web page document for rendering;

[0033] Window object acquisition module, used to obtain the window object of iframe;

[0034] The print execution module is used to execute the print method of the window object, call up the printer print interface, and print the contents of the iframe window.

[0035] As a preferred solution, it also includes a data encryption module, a data acquisition module, and a data decryption module connected in sequence, and the data decryption module is also connected to the Blob class file object creation module;

[0036] The data encryption module is used to assign a unique ID to the PDF file data to be printed and to encrypt the data of the PDF file to be printed;

[0037] The data acquisition module is used to obtain the unique identification ID of the PDF file data to be printed through a preset interface, and return the encrypted PDF file data to be printed based on the unique identification ID;

[0038] A data decryption module is used to request a preset interface to preload and decrypt the encrypted PDF file data to be printed. As a preferred solution, it also includes an iframe focus acquisition module connected to the rendering module and the window object acquisition module respectively;

[0039] The iframe focus acquisition module is used to obtain the focus of the iframe.

[0040] A third aspect of an embodiment of the present invention provides a computer-readable storage medium, wherein the computer-readable storage medium stores computer instructions, and the computer instructions are used to enable the computer to execute a method for printing a PDF file on a web page as described in the first aspect and any one of the first aspects of the embodiment of the present invention.

[0041] A fourth aspect of an embodiment of the present invention provides an electronic device, comprising: a memory and a processor, the memory and the processor being communicatively connected to each other, the memory storing computer instructions, and the processor executing the computer instructions to execute a method for printing a PDF file on a web page as described in the first aspect of the embodiment of the present invention and any one of the first aspects.

[0042] The beneficial effects of the present invention are:

[0043] Based on the PDF file preview and window printing functions commonly available in modern browsers, the browser's native Blob file object is used as a medium to pre-convert the PDF file to be printed into a Blob file object. Then, a temporarily created hidden iframe inline frame element is used to render it off-screen. Finally, the print method on the window object embedded in the iframe is used to call up the default printer printing interface, achieving the purpose of directly printing PDF files on the web page without relying on third-party software. BRIEF DESCRIPTION OF THE DRAWINGS

[0044] In order to more clearly illustrate the embodiments of the present invention or the technical solutions in the prior art, the following briefly introduces the drawings required for use in the embodiments or the description of the prior art. Obviously, the drawings described below are only some embodiments of the present invention. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative work.

[0045] FIG1 is a flow chart of a method for printing a PDF file on a webpage according to an embodiment of the present invention;

[0046] FIG2 is a structural block diagram of a system for printing a PDF file on a web page according to an embodiment of the present invention;

[0047] 3 is a schematic diagram of the structure of a computer-readable storage medium provided according to an embodiment of the present invention;

[0048] FIG4 is a schematic structural diagram of an electronic device according to an embodiment of the present invention. DETAILED DESCRIPTION

[0049] The following describes the embodiments of the present invention through specific embodiments. Those skilled in the art can easily understand other advantages and effects of the present invention from the content disclosed in this specification. The present invention can also be implemented or applied through different specific embodiments. The details in this specification can also be modified or changed based on different viewpoints and applications without departing from the spirit of the present invention. It should be noted that the following embodiments and features in the embodiments can be combined with each other unless they conflict.

[0050] Example 1:

[0051] 1 , this embodiment provides a method for printing a PDF file on a webpage, including the following steps:

[0052] Step S1: Provide an interface for obtaining encrypted PDF file content on the server side. The interface provides services in HTTP mode, receives the unique identification ID of the PDF file to be printed, and returns the encrypted PDF data.

[0053] The interface request method is: GET, the required parameter is: ID, and the message transmission format is: TEXT.

[0054] Specifically, this interface retrieves the corresponding PDF file based on the received PDF file's unique identifier (ID). Those skilled in the art will appreciate that the unique identifier (UUID) is generated using a Universally Unique Identifier (UUID). A database stores the mapping between the identifier and the actual file path. The actual file path is then used to retrieve the specific PDF file as a byte stream. Using the UUID instead of the file name directly prevents sensitive file information from being leaked, enhancing system security.

[0055] Specifically, the encryption method is to use BASE64 encoding to convert the read PDF byte stream, achieve the encryption effect by converting the binary data into a string based on 64 printable characters, and then create a UTF8-encoded string for final output; using BASE64 for processing instead of directly returning the document byte stream further increases the security of the system.

[0056] Specifically, the TEXT format refers to the response body format of an HTTP request, and its MIME type is application / text. The MIME type (Multipurpose Internet Mail Extensions, media type) is a standard used to indicate the nature and format of a document, file, or byte stream.

[0057] Step S2: Get the print instruction and test whether the current browser environment supports PDF file rendering through the supportPrint method in the JS script. If not, prompt the user.

[0058] Specifically, obtaining the print instruction is achieved by creating a print button using HTML on the browser front-end page and using a JS script to bind a click event triggered when the button is clicked; when the user clicks the print button in the browser, the print operation is triggered and the next steps are entered.

[0059] Specifically, the supportPrint method is implemented by calling the navigator.pdfViewerEnabled interface provided by the browser object model. navigator.pdfViewerEnabled is an interface provided by the Navigator object common to modern browsers, which is used to detect whether the browser supports inline rendering of PDF files. As long as it is determined through this interface that the current browser supports inline rendering of PDF files, the method described in this embodiment can be used for subsequent processing; modern browsers, including the current mainstream browsers Chrome, Edge, FireFox, Safari, Opera, and domestic browsers such as Qihoo 360 Browser, QQ Browser, Sogou Browser, UC Browser, etc. all support inline rendering of PDF files by default, so this method has good universality for modern mainstream browsers.

[0060] Specifically, when the supportPrint method detects that the current browser environment is not applicable to the method described in this embodiment, the window.alert method is used to display a warning dialog box in the browser to inform the user of the problem encountered and the solution.

[0061] Step S3: Request the interface provided in step S1 through XMLHttpRequest to preload and decrypt the content of the PDF file to be printed using the atob method.

[0062] Specifically, the XMLHttpRequest request URL is the interface URL described in step S1, the URL parameter is the identification ID of the PDF file to be printed, the request method is GET, and the response type is TEXT; those skilled in the art will understand that XMLHttpRequest is an object provided by the browser for interactive requests with the server, and is used for http communication with the server.

[0063] Specifically, when decrypting the encrypted file content obtained by XMLHttpRequest, the atob method provided by the browser DOM object is used. This method is used to decode the string encoded using BASE64. This method is used to process the decoded binary PDF file content for the next step.

[0064] Step S4: Use the decrypted PDF file data loaded in step S3 to create a browser Blob class file object.

[0065] Specifically, the window.Blob method is called with the decrypted PDF binary data as a parameter, and the Blob type is set to application / pdf to create a corresponding Blob object. The Blob object represents an immutable, raw file-like object, and the window.Blob method is a native method provided by the browser. Note that the Blob object's MIME media type must be set to application / pdf to ensure proper off-screen rendering in the following steps.

[0066] Step S5: Use the createObjectURL method of the URL interface to create the URL of the Blob object in S4.

[0067] Specifically, the corresponding URL object is generated by calling the window.URL.createObjectURL method and passing in the Blob object generated in step S4. The window.URL.createObjectURL method is a native method provided by the browser. Calling this method with the Blob object creates a DOMString containing a URL representing the object given in the parameter.

[0068] Step S6: Create an iframe with a unique frameId and hide it.

[0069] Specifically, an iframe is created by calling the let printFrame=document.createElement('iframe') method and the iframe is stored as the variable printFrame. An iframe is an HTML inline frame element that represents a nested browser context and can embed another HTML page into the current page. An id is set for the frame by calling printFrame.setAttribute('id',frameId), where frameId is a unique identifier for the iframe. The purpose is to use the id to determine whether an iframe has already been created before creation. If so, the created iframe is directly used to avoid creating it multiple times and causing performance consumption.

[0070] Specifically: Hiding the iframe is achieved by calling printFrame.setAttribute('style','visibility:hidden;position:absolute;height:0;width:0;border:0'). The setting method is to set the visibility in the CSS style to hidden, the position to absolute, the height to 0, the width to 0, and the border to 0.

[0071] Step S7: The iframe object created in S6 is set to the URL object created in S5 via the setAttribute('src', pdfBlob) method so that the nested page address src is set.

[0072] Specifically, it is achieved by calling printFrame.setAttribute('src',pdfURL), where printFrame is the iframe created in step S6, the setAttribute method is used to create or change the attributes of a DOM element, and pdfBlob is the URL object created in step S5.

[0073] Step S8: Get the body child element of the web page through getElementsByTagName('body'), and then use the appendChild method to put the iframe in S7 into the body of the web page document for loading.

[0074] Specifically, the operations of getting child elements and adding printFrame are achieved by calling document.getElementsByTagName('body').appendChild(printFrame).

[0075] Step S9: In the onload event of the iframe loaded in S8, the focus of the iframe is obtained by using the focus method.

[0076] Specifically, printFrame is bound to the onload event through printFrame.onload=()=>{printFrame.focus()}. The onload event will be triggered after the iframe is loaded. After triggering, the focus method is called to obtain the focus of printFrame. It should be noted that the focus must be obtained to ensure that the final printed content only contains the PDF file to be printed, avoiding the wrong page range from being printed.

[0077] Step S10: Get the current window object contentWindow of the iframe in S9.

[0078] Specifically, in the onload event response method bound in step S9, let printWindow=printFrame.contentWindow is called to obtain the window object and save it to the variable printWindow.

[0079] Step S11: Execute the print method of the contentWindow object in step S10.

[0080] Specifically, by calling the printWindow.print() method in the onload event response method bound in step S9, the content of the hidden iframe window is printed, the default printer is called to print the page, and the printing process is ended.

[0081] Compared with the existing web page PDF file printing method, this embodiment has the following advantages and effects:

[0082] (1) Based on the above content, it can be seen that the PDF printing method described in this embodiment can realize direct printing of PDF in a web page based on the native functions of the browser such as XMLHttpRequest object, Blob class file object, URL interface, iframe inline frame element, etc., without the support of browser plug-ins or third-party software, and has stronger independence.

[0083] (2) Users do not need to install plug-ins or software, download PDF files locally, or jump to a separate preview page for printing. The operation is simple and fast.

[0084] (3) By providing an interface on the server side to obtain the content of the encrypted PDF file and then decrypting it in the browser, the static resource address of the PDF file is not exposed, thus ensuring the security of the entire printing process.

[0085] (4) This embodiment has good universality for modern mainstream browsers.

[0086] Example 2:

[0087] 2 , this embodiment provides a system for printing a PDF file on a web page, including a Blob file object creation module, a URL creation module, an attribute change module, a rendering module, a window object acquisition module, and a print execution module, which are connected in sequence. The system also includes an iframe creation module connected to the attribute change module.

[0088] A Blob file object creation module is used to create a browser Blob file object using the PDF file data to be printed;

[0089] URL creation module, used to create the URL of the browser Blob class file object;

[0090] Iframe creation module, used to create an iframe and hide it;

[0091] The attribute replacement module is used to set the nested page address of the iframe to the URL created by the URL creation module;

[0092] The rendering module is used to put the iframe into the body of the web page document for rendering;

[0093] Window object acquisition module, used to obtain the window object of iframe;

[0094] The print execution module is used to execute the print method of the window object, call up the printer print interface, and print the contents of the iframe window.

[0095] Furthermore, the system also includes a data encryption module, a data acquisition module, and a data decryption module connected in sequence, and the data decryption module is also connected to the Blob class file object creation module;

[0096] The data encryption module is used to assign a unique ID to the PDF file data to be printed and to encrypt the data of the PDF file to be printed;

[0097] The data acquisition module is used to obtain the unique identification ID of the PDF file data to be printed through a preset interface, and return the encrypted PDF file data to be printed based on the unique identification ID;

[0098] The data decryption module is used to request a preset interface to preload and decrypt the encrypted PDF file data to be printed. The system also includes an iframe focus acquisition module connected to the rendering module and the window object acquisition module respectively;

[0099] The iframe focus acquisition module is used to obtain the focus of the iframe.

[0100] Among them, the data decryption module, Blob file object creation module, URL creation module, iframe creation module, attribute replacement module, rendering module, window object acquisition module, and print execution module are all set on the web page side, and the data acquisition module is set on the server side.

[0101] It should be noted that the system for printing a PDF file on a web page provided in this embodiment is similar to that in the first embodiment and will not be described in detail here.

[0102] Example 3:

[0103] As shown in FIG3 , an embodiment of the present invention further provides a storage medium having a computer program 601 stored thereon. When executed by a processor, the computer program 601 implements the steps of a method for printing a PDF file from a webpage in the above-described embodiment. Those skilled in the art will appreciate that all or part of the processes in the above-described embodiment can be implemented by instructing the relevant hardware through a computer program. The program can be stored in a computer-readable storage medium, and when executed, the program can include the processes in the above-described embodiment 1.

[0104] The storage medium may be a magnetic disk, an optical disk, a read-only memory (ROM), a random access memory (RAM), a flash memory, a hard disk drive (HDD) or a solid-state drive (SSD), etc.; the storage medium may also include a combination of the above types of memory.

[0105] Example 4:

[0106] 4 , an embodiment of the present invention further provides an electronic device, which may include a processor 51 and a memory 52 , wherein the processor 51 and the memory 52 may be connected via a bus or other means, with FIG4 taking the bus connection as an example.

[0107] The processor 51 may be a central processing unit (CPU). The processor 51 may also be other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), field-programmable gate arrays (FPGA), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, or a combination of the above chips.

[0108] Memory 52, as a non-transitory computer-readable storage medium, can be used to store non-transitory software programs, non-transitory computer executable programs, and modules, such as the corresponding program instructions / modules in the embodiments of the present invention. Processor 51 executes the non-transitory software programs, instructions, and modules stored in memory 52 to perform various processor functions and data processing, thereby implementing the method for printing a PDF file on a webpage in the first embodiment described above.

[0109] The memory 52 may include a program storage area and a data storage area, wherein the program storage area may store applications required for operating the device and at least one function; the data storage area may store data created by the processor 51, etc. In addition, the memory 52 may include a high-speed random access memory, and may also include a non-volatile memory, such as at least one disk storage device, a flash memory device, or other non-volatile solid-state storage device. In some embodiments, the memory 52 may optionally include a memory remotely located relative to the processor 51, and these remote memories may be connected to the processor 51 via a network. Examples of the above-mentioned network include, but are not limited to, the Internet, an intranet, a local area network, a mobile communication network, and combinations thereof.

[0110] The one or more modules are stored in the memory 52 and, when executed by the processor 51 , perform the method for printing a PDF file on a web page described in the first embodiment.

[0111] The specific details of the above electronic device can be understood by referring to the corresponding descriptions and effects in Example 1, and will not be repeated here.

[0112] The embodiments described above are merely descriptions of preferred implementations of the present invention and are not intended to limit the scope of the present invention. Without departing from the design spirit of the present invention, various modifications and improvements made to the technical solutions of the present invention by ordinary technicians in this field should fall within the scope of protection of the present invention.

Claims

1. A method for printing a PDF file on a web page. It is characterized in that Includes steps: S1. Create a browser Blob class file object using the PDF file data to be printed; S2. Create a URL for a browser Blob class file object; S3, create an iframe and hide it; S4, setting the nested page address of the iframe to the URL created in step S2; S5. Put the iframe into the body of the webpage document for rendering; S6. Get the window object of the iframe; S7. Execute the print method of the window object, invoke the printer print interface, and print the content of the iframe window.

2. A method for printing a PDF file on a web page according to claim 1, It is characterized in that Before step S1, the method further includes the following steps: Assign a unique ID to the PDF file data to be printed, and encrypt the data of the PDF file to be printed; The server obtains the unique identification ID of the PDF file data to be printed through a preset interface, and returns the encrypted PDF file data to be printed based on the unique identification ID; The browser requests a preset interface to preload and decrypt the encrypted PDF file data to be printed.

3. A method for printing a PDF file on a web page according to claim 1, It is characterized in that Before step S1, the method further includes the following steps: Determine whether the browser environment supports PDF file rendering. If not, prompt the user and end printing.

4. A method for printing a PDF file on a web page according to claim 1, It is characterized in that The step between step S5 and step S6 includes the step of obtaining the focus of the iframe.

5. A method for printing a PDF file on a web page according to claim 1, It is characterized in that In step S3, when creating an iframe, a predefined constant string is assigned to it as its frameId; Before step S3, the method further includes a step of determining whether there is an iframe that has been created based on a predefined constant string. If there is an iframe that has been created, the iframe that has been created is directly used and hidden before executing step S4.

6. A system for printing PDF files on a web page, It is characterized in that It includes a Blob file object creation module, a URL creation module, an attribute change module, a rendering module, a window object acquisition module, and a print execution module, which are connected in sequence, and also includes an iframe creation module connected to the attribute change module; A Blob class file object creation module, used to create a browser Blob class file object using the PDF file data to be printed; URL creation module, used to create the URL of the browser Blob class file object; Iframe creation module, used to create an iframe and hide it; The attribute replacement module is used to set the nested page address of the iframe to the URL created by the URL creation module; The rendering module is used to put the iframe into the body of the web page document for rendering; The window object acquisition module is used to obtain the window object of the iframe; The print execution module is used to execute the print method of the window object, invoke the printer print interface, and print the contents of the iframe window.

7. A system for printing a PDF file on a web page according to claim 6, It is characterized in that It also includes a data encryption module, a data acquisition module, and a data decryption module that are connected in sequence, and the data decryption module is also connected to the Blob class file object creation module; The data encryption module is used to give a unique ID to the PDF file data to be printed and to encrypt the data of the PDF file to be printed; A data acquisition module, used to acquire a unique identification ID of the PDF file data to be printed through a preset interface, and return the encrypted PDF file data to be printed based on the unique identification ID; The data decryption module is used to request a preset interface, pre-load and decrypt the encrypted PDF file data to be printed.

8. A system for printing a PDF file on a web page according to claim 6, It is characterized in that It also includes an iframe focus acquisition module connected to the rendering module and the window object acquisition module respectively; The iframe focus acquisition module is used to obtain the focus of the iframe.

9. A computer-readable storage medium, It is characterized in that The computer-readable storage medium stores computer instructions, and the computer instructions are used to enable the computer to execute the method for printing a PDF file on a web page as described in any one of claims 1 to 5.

10. An electronic device, It is characterized in that include: A memory and a processor, wherein the memory and the processor are communicatively connected to each other, the memory stores computer instructions, and the processor executes the method for printing a PDF file on a web page as described in any one of claims 1 to 5 by executing the computer instructions.

Images