A browser-based multi-source PDF merging and generating method, system, terminal and storage medium

By using a multi-source PDF merging and generation method on the browser side, the problems of PDF page font and layout requirements in existing technologies are solved, and unified headers and numbering are achieved, reducing resource consumption and ensuring document consistency and controllability.

CN122432428APending Publication Date: 2026-07-21GUANGDONG CHUANGSHI TECHNOLOGY ADVERTISING CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
GUANGDONG CHUANGSHI TECHNOLOGY ADVERTISING CO LTD
Filing Date
2026-03-31
Publication Date
2026-07-21

AI Technical Summary

Technical Problem

Existing technologies have limitations in merging and generating PDFs, resulting in rendered PDF pages that cannot meet font and layout requirements. In particular, when merging multiple sources, issues such as difficulty in managing page order, inconsistent fonts, missing Chinese characters or special symbols, and inability to unify headers or numbering after merging occur.

Method used

On the browser side, HTML strings are generated through template rendering, converted into structured descriptions, and remote PDF data is merged using intermediate PDF generation instructions. Font management and text annotation overlay processing are also performed to achieve unified headers and numbering.

Benefits of technology

The browser-side operation enables the generation and merging of multi-source PDFs, reducing reliance on backend rendering services and resource overhead. It avoids issues such as unsearchability and distortion caused by rasterizing screenshots, implements a source-independent unified header and numbering strategy, ensures the correct display of Chinese characters and symbols, and controls file size.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN122432428A_ABST
    Figure CN122432428A_ABST
Patent Text Reader

Abstract

This invention discloses a method, system, terminal, and storage medium for merging and generating multi-source PDFs on a browser-side platform. The method includes: executing template rendering instructions on the template component to be output to obtain an HTML string; converting the HTML string into a structured description required by the browser-side PDF generation database; generating an intermediate PDF document based on the structured description using intermediate PDF generation instructions, and obtaining the remote PDF binary data corresponding to the intermediate PDF document; loading the multi-source PDF binary data, copying the corresponding PDF pages to the final document, and performing font management and text annotation overlay processing on the final document; and outputting the processed final document. This invention reduces the dependence on backend rendering services and resource overhead, avoids the unsearchability and distortion problems caused by rasterizing screenshots, and achieves a source-independent unified header or numbering strategy.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This invention relates to the field of document rendering and PDF processing technology, and in particular to a method, system, terminal, and storage medium for merging and generating multi-source PDFs based on a browser. Background Technology

[0002] In many web applications, there is a need to output page content as PDF documents for download, preview, archiving, or printing. Existing technologies typically suffer from the following shortcomings: (1) Reliance on backend generation: The method of generating PDFs by centrally rendering on the backend often requires the deployment of additional rendering services and font resources, which leads to CPU or memory consumption, cost of elastic scaling, network latency and stability dependence; at the same time, it does not support scenarios such as "instant generation, offline availability, and client-side privacy protection".

[0003] (2) Limitations based on screenshots or rasterization: Using DOM (Document Object Model) screenshots (e.g., drawing the page as a canvas and then converting it to an image and embedding it in the PDF) will result in unsearchable text, increased file size, distortion of tables and vector elements, and weaker pagination control for multi-page content.

[0004] (3) Capability gaps of a single PDF engine: While using only pdfmake (pdfmake is an open-source library based on pure JavaScript that supports generating PDF documents on both the client and server sides without relying on any external plugins or system components) can generate PDFs containing text and tables, it has limited support for capabilities such as "merging existing PDFs" and "uniformly overlaying headers or numbering on each page after merging"; while using only pdf-lib (pdf-lib is an open-source library based on JavaScript that supports creating, modifying and manipulating PDF documents in any JavaScript environment) is good at parsing or merging PDFs, it has high costs for automatic layout rendering of complex HTML (Hypertext Markup Language) layouts.

[0005] (4) Issues with merging multiple sources and font consistency: When a PDF needs to contain both "pages generated by template rendering" and "existing PDF pages obtained remotely", problems such as difficulty in managing page order, inconsistent fonts, missing Chinese characters or special symbols, and inability to unify headers or numbering after merging often occur.

[0006] Therefore, existing technologies still have limitations in merging and generating, resulting in rendered PDF pages that cannot meet font and layout requirements, and the technology needs further improvement. Summary of the Invention

[0007] The technical problem to be solved by the present invention is that, in view of the defects of the prior art, the present invention provides a method, system, terminal and storage medium for merging and generating multi-source PDFs based on the browser, so as to solve the problem that the rendered PDF pages cannot meet the font and layout requirements due to the technical limitations of the prior art in merging and generating.

[0008] The technical solution adopted by this invention to solve the technical problem is as follows: In a first aspect, the present invention provides a method for merging and generating multi-source PDFs based on a browser, including: Execute template rendering instructions on the template component to be output to obtain an HTML string; The HTML string is converted into a structured description required for generating a PDF database in the browser. Based on the structured description, an intermediate PDF document is generated using intermediate PDF generation instructions, and the remote PDF binary data corresponding to the intermediate PDF document is obtained. Load multi-source PDF binary data, copy the corresponding PDF pages to the final document, and perform font management and text annotation overlay processing on the final document; Output the final document after processing.

[0009] In one implementation, executing template rendering instructions on the template component to be output to obtain an HTML string includes: Initialize browser-side system configuration; The renderToString instruction is executed on the template component to be output to obtain the HTML string.

[0010] In one implementation, converting the HTML string into a structured description required for generating a PDF database on the browser side includes: The HTML string is converted using the html-to-pdfmake command, and the default style is configured to obtain the structured description required by the browser-side PDF generation database; wherein, the default style includes: headings, paragraphs and tables.

[0011] In one implementation, the step of generating an intermediate PDF document based on the structured description using intermediate PDF generation instructions, and obtaining the remote PDF binary data corresponding to the intermediate PDF document, includes: The pdfmake.getBuffer instruction is called to convert the structured description and obtain the intermediate PDF document; The PDFDocument.load instruction is executed on the intermediate PDF document to obtain a document object with copyable pages, and the remote PDF binary data is obtained through the fetch instruction.

[0012] In one implementation, loading multi-source PDF binary data, copying the corresponding PDF pages to the final document, and performing font management and text annotation overlay processing on the final document include: Load the multi-source PDF binary data, and execute the copyPages instruction on each source PDF document in the loading order to copy the corresponding PDF pages to the final document; In the final document, fonts are embedded and subsetted using the registerFontkit and embedFont directives, and the drawText directive is used on each page of the final document to overlay headers, numbering, and attachment identifiers.

[0013] In one implementation, the embedding of fonts via the registerFontkit and embedFont directives and the subsequent subset processing includes: Obtain font file binaries from the Font Uniform Resource Locator or local resources, and register browser font engines with the PDF Development Database to support TrueType or OpenType fonts; The corresponding font is embedded using the embedFont directive, and all fonts are uniformly converted to the embedded font using the drawText directive.

[0014] In one implementation, the step of using the drawText instruction on each page of the final document to overlay headers, numbering, and attachment identifiers includes: In the final document, for each newly added page, the drawText command is executed in the top area of ​​the page to write a label string to achieve a uniform header effect; wherein, the label string includes: page number, timestamp, watermark or check code.

[0015] Secondly, the present invention provides a browser-based multi-source PDF merging and generation system, comprising: The template rendering module is used to execute template rendering instructions on the template components to be output, and obtain HTML strings; The HTML structuring conversion module is used to convert the HTML string into a structured description required by the browser-side PDF generation database. An intermediate PDF generation module is used to generate an intermediate PDF document based on the structured description and using intermediate PDF generation instructions; The remote PDF acquisition module is used to acquire the remote PDF binary data corresponding to the intermediate PDF document; The PDF parsing and merging module is used to load multi-source PDF binary data and copy the corresponding PDF pages to the final document. The font management module is used to manage the fonts in the final document; The text annotation overlay module is used to perform text annotation overlay processing on the final document; The output module is used to output the final processed document.

[0016] Thirdly, the present invention provides a terminal, including: a processor and a memory, wherein the memory stores a browser-based multi-source PDF merging and generation program, and the browser-based multi-source PDF merging and generation program, when executed by the processor, is used to implement the operation of the browser-based multi-source PDF merging and generation method as described in the first aspect.

[0017] Fourthly, the present invention also provides a computer-readable storage medium storing a browser-based multi-source PDF merging and generation program, which, when executed by a processor, is used to implement the browser-based multi-source PDF merging and generation method as described in the first aspect.

[0018] The present invention, by employing the above technical solution, has the following effects: 1) This invention completes the generation and merging of multi-source PDFs on the browser side, reducing the dependence on backend rendering services and resource overhead. Furthermore, it uses structured typesetting to generate vector PDFs, avoiding the problems of unsearchability and distortion caused by rasterizing screenshots.

[0019] 2) This invention achieves a source-independent unified header and numbering strategy by merging and overlaying annotations at the page level, and controls file size while ensuring the correct display of Chinese characters or symbols by using font subsetation and resource reuse.

[0020] 3) This invention improves the consistency and controllability of the final document through configurable remote acquisition and cache avoidance strategies. Attached Figure Description

[0021] To more clearly illustrate the technical solutions in the embodiments of the present invention or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on the structures shown in these drawings without creative effort.

[0022] Figure 1 This is a flowchart of the multi-source PDF merging and generation method based on the browser side in this invention.

[0023] Figure 2 This is a schematic diagram of the overall architecture for merging and generating multi-source PDFs on the browser side in this invention.

[0024] Figure 3 This is a schematic diagram of the end-to-end generation and merging process and timing in this invention.

[0025] Figure 4 This is a schematic diagram of the font loading, subset embedding, and text drawing process in this invention.

[0026] Figure 5 This is a schematic diagram of the page merging and post-merging annotation overlay rules in this invention.

[0027] Figure 6 This is a functional schematic diagram of the terminal in one implementation of the present invention.

[0028] The objectives, features, and advantages of this invention will be further explained in conjunction with the embodiments and with reference to the accompanying drawings. Detailed Implementation

[0029] To make the objectives, technical solutions, and advantages of this invention clearer and more explicit, the invention will be further described in detail below with reference to the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are merely illustrative of the invention and are not intended to limit the invention.

[0030] Exemplary methods In many web applications, there is a need to output page content as PDF documents for download, preview, archiving, or printing. Existing technologies typically suffer from the following shortcomings: (1) Reliance on backend generation: The method of generating PDFs by centrally rendering on the backend often requires the deployment of additional rendering services and font resources, which leads to CPU or memory consumption, cost of elastic scaling, network latency and stability dependence; at the same time, it does not support scenarios such as "instant generation, offline availability, and client-side privacy protection".

[0031] (2) Limitations based on screenshots or rasterization: Using DOM (Document Object Model) screenshots (e.g., drawing the page as a canvas and then converting it to an image and embedding it in the PDF) will result in unsearchable text, increased file size, distortion of tables and vector elements, and weaker pagination control for multi-page content.

[0032] (3) Capability gaps of a single PDF engine: While using only pdfmake (pdfmake is an open-source library based on pure JavaScript that supports generating PDF documents on both the client and server sides without relying on any external plugins or system components) can generate PDFs containing text and tables, it has limited support for capabilities such as "merging existing PDFs" and "uniformly overlaying headers or numbering on each page after merging"; while using only pdf-lib (pdf-lib is an open-source library based on JavaScript that supports creating, modifying and manipulating PDF documents in any JavaScript environment) is good at parsing or merging PDFs, it has high costs for automatic layout rendering of complex HTML (Hypertext Markup Language) layouts.

[0033] (4) Issues with merging multiple sources and font consistency: When a PDF needs to contain both "pages generated by template rendering" and "existing PDF pages obtained remotely", problems such as difficulty in managing page order, inconsistent fonts, missing Chinese characters or special symbols, and inability to unify headers or numbering after merging often occur.

[0034] Therefore, existing technologies still have limitations in merging and generating, resulting in rendered PDF pages that cannot meet font and layout requirements, and the technology needs further improvement.

[0035] To address the above technical issues, this invention provides a browser-based method for merging and generating multi-source PDFs. The method includes: executing template rendering instructions on the template component to be output to obtain an HTML string; converting the HTML string into a structured description required by the browser-based PDF generation database; generating an intermediate PDF document based on the structured description using intermediate PDF generation instructions, and obtaining the remote PDF binary data corresponding to the intermediate PDF document; loading the multi-source PDF binary data, copying the corresponding PDF pages to the final document, and performing font management and text annotation overlay processing on the final document; and outputting the processed final document. This invention reduces the dependence on backend rendering services and resource overhead, avoids the unsearchability and distortion problems caused by rasterizing screenshots, and achieves a source-independent unified header or numbering strategy.

[0036] like Figure 1 As shown, this embodiment of the invention provides a method for merging and generating multi-source PDFs based on a browser, including the following steps: Step S100: Execute template rendering instructions on the template component to be output to obtain an HTML string.

[0037] This embodiment proposes a technical solution that enables "template rendering and generation + multi-source PDF merging + font consistency + unified annotation overlay + unified output" on the browser side, aiming to achieve the following functions: 1) Implement stable rendering of componentized template content into paginated and searchable vector PDFs on the browser side, instead of rasterizing screenshots.

[0038] 2) Merge the PDF generated from the template with the existing PDF obtained remotely in a predetermined order at the page level.

[0039] 3) On each merged page, uniformly overlay headers, attachment labels, or page numbers, and ensure that Chinese characters and special symbols are displayed correctly.

[0040] 4) Control the PDF size and generation time on the client side to avoid repeatedly loading fonts and resources.

[0041] 5) Handle caching, failure retries, and degradation during the remote PDF acquisition process to make the generation process controllable and observable.

[0042] To achieve the above technical solution, this embodiment provides a browser-based multi-source PDF merging and generation system, such as... Figure 2 As shown, the system includes at least: a template rendering module, an HTML structured conversion module, an intermediate PDF generation module, a remote PDF acquisition module, a PDF parsing and merging module, a font management module, a text annotation overlay module, and an output module.

[0043] First, during the template rendering module's processing, the renderToString instruction is used to render the template components to be output as HTML strings, thereby achieving PDF template rendering.

[0044] Specifically, in one implementation of this embodiment, step S100 includes the following steps: Step S101: Initialize browser-side system configuration; Step S102: Execute the renderToString instruction on the template component to be output to obtain the HTML string.

[0045] In this embodiment, the browser-side system configuration is first initialized, specifically: creating the final PDFDocument (PDF document file), registering fontkit (an advanced font engine for Node.js and browser environments, mainly used for loading, parsing, layout, and rendering font files), obtaining the font binary from the font URL (Uniform Resource Locator) or built-in resources, and executing the embedFont(..., { subset: true}) instruction.

[0046] Based on the system configuration described above, when embedding fonts using the pdf-lib library, the `embedFont(..., {subset: true})` directive enables font subsetation, meaning only the characters actually used in the document are embedded into the PDF, rather than the entire font file. This significantly reduces the size of the generated PDF file, especially when using custom fonts (such as Chinese fonts).

[0047] In this embodiment, after initializing the browser-side system configuration, the template component to be output (i.e., the PDF template) is selected. Then, the renderToString(createApp(comp)) instruction is executed on the template component to be output to obtain a collection of HTML strings. The renderToString(createApp(comp)) instruction is a rendering mode in the server-side rendering scenario, used to render the front-end application (such as a Vue component or a React component) into an HTML string.

[0048] In this embodiment, the template component is rendered as an HTML string using the renderToString directive, achieving deterministic layout input that decouples the template component from the DOM, thereby avoiding the rasterization of screenshots.

[0049] like Figure 1 As shown, this embodiment of the invention provides a method for merging and generating multi-source PDFs based on a browser, including the following steps: Step S200: Convert the HTML string into a structured description required for generating the PDF database on the browser side.

[0050] In this embodiment, after the HTML string is rendered, the HTML string is converted into the structured description required by pdfmake (i.e., the browser-side PDF generation database) through the HTML structure conversion module.

[0051] Specifically, in one implementation of this embodiment, step S200 includes the following steps: Step S201: Use the html-to-pdfmake conversion command on the HTML string and configure the default style to obtain the structured description required by the browser-side PDF generation database; wherein, the default style includes: headings, paragraphs and tables.

[0052] In this embodiment, after obtaining the set of HTML strings, the html-to-pdfmake conversion command is used on the HTML strings, and the default PDF styles (titles, paragraphs, tables, etc.) are configured. The html-to-pdfmake conversion command is an open-source JavaScript module specifically designed to convert HTML code into a document definition format that pdfmake can recognize, thereby enabling the generation of high-quality PDF documents from familiar HTML / CSS structures.

[0053] In this embodiment, the HTML is converted into a pdfmake structured description using the html-to-pdfmake directive, and combined with the default style strategy, controllable pagination and table rendering are achieved.

[0054] like Figure 1 As shown, this embodiment of the invention provides a method for merging and generating multi-source PDFs based on a browser, including the following steps: Step S300: Based on the structured description, generate an intermediate PDF document using intermediate PDF generation instructions, and obtain the remote PDF binary data corresponding to the intermediate PDF document.

[0055] In this embodiment, after the HTML structure conversion, an intermediate PDF is generated by the intermediate PDF generation module, that is, the intermediate PDF buffer (i.e., the binary data of the PDF file) is generated by the pdfmake.getBuffer instruction set therein; then, the remote PDF binary data (which may have a cache-busting parameter) is obtained by the fetch instruction of the remote PDF acquisition module.

[0056] Specifically, in one implementation of this embodiment, step S300 includes the following steps: Step S301: Call the pdfmake.getBuffer instruction to convert the structured description and obtain the intermediate PDF document; Step S302: Execute the PDFDocument.load instruction on the intermediate PDF document to obtain a document object with copyable pages, and obtain the remote PDF binary data through the fetch instruction.

[0057] In this embodiment, after converting the HTML into a pdfmake description, pdfmake.createPdf(...).getBuffer(...) is called to obtain the intermediate PDF binary; where pdfmake.createPdf(...).getBuffer(...) is the core method chain in the pdfmake library used to generate PDF documents and obtain their binary buffer, which includes: pdfmake.createPdf(docDefinition) and .getBuffer(callback).

[0058] `pdfmake.createPdf(docDefinition)`: Creates a PDF document instance based on the document definition object (docDefinition); `.getBuffer(callback)`: Asynchronously generates the binary data of the PDF and returns a `Buffer` object (in a Node.js environment) or a `Uint8Array` (in a browser environment) via a callback function, which can be used to save the file, upload it to a server, or perform further processing.

[0059] Furthermore, after obtaining the intermediate PDF binary, PDFDocument.load(buffer) is executed on the intermediate PDF to obtain a document object with copyable pages. PDFDocument.load(buffer) is the core method in the pdf-lib library used to load existing PDF files from PDF data in memory (such as ArrayBuffer or Uint8Array). Its function is to parse a binary buffer (buffer) containing PDF content into an operable PDF document object so that operations such as reading, modifying, merging, and extracting pages can be performed.

[0060] For example, after downloading a PDF from the internet, it is loaded and processed, and then viewed in a browser. <input type="file"> After selecting a file, it is read as an ArrayBuffer and loaded. This way, when merging multiple PDF files, each source file is loaded first.

[0061] like Figure 1 As shown, this embodiment of the invention provides a method for merging and generating multi-source PDFs based on a browser, including the following steps: Step S400: Load multi-source PDF binary data, copy the corresponding PDF pages to the final document, and perform font management and text annotation overlay processing on the final document; Step S500: Output the final processed document.

[0062] In this embodiment, after acquiring remote PDF binary data, the PDF files are merged through the PDF parsing and merging module. This module uses the PDFDocument.load instruction to load PDFs from various sources and uses the copyPages instruction to copy the pages to the final document, thereby realizing the merging function of multi-source PDF documents.

[0063] After that, the font and text annotation of the merged PDF document are adjusted through the font management module and the text annotation overlay module. The font management module embeds fonts and performs subset processing through the registerFontkit(fontkit) and embedFont(subset:true) commands. The text annotation overlay module uses the drawText command on each page of the final document to overlay content such as headers, numbering, and attachment labels.

[0064] After merging and adjusting the content of the PDF documents, the output module encapsulates the bytes of the final document doc.save() into a Blob('application / pdf') format for download and preview by the browser.

[0065] Specifically, in one implementation of this embodiment, step S400 includes the following steps: Step S401: Load the multi-source PDF binary data, and execute the copyPages instruction on each source PDF document in the loading order to copy the corresponding PDF pages to the final document; In step S402, in the final document, fonts are embedded and subsetted using the registerFontkit and embedFont directives, and the drawText directive is used on each page of the final document to overlay headers, numbering, and attachment identifiers.

[0066] In this embodiment, after loading the intermediate PDF file, the fetch command is used on each remote URL to obtain the binary data and then PDFDocument.load(...). Here, using the fetch command on each remote URL means initiating an HTTP request to the specified URL through the browser's native fetch() API to obtain or submit data; while PDFDocument.load(...) means passing the binary data to the PDF parsing library (such as pdf.js or pdf-lib)'s PDFDocument.load method to load the PDF.

[0067] To avoid caching leading to outdated content, you can append the `t=Date.now()` directive. `t=Date.now()` adds a timestamp to the URL query parameters to prevent browsers or proxies from caching request results. By adding the current timestamp to the URL, each request will have a different URL, preventing the browser from reusing cached responses, ensuring the latest data is obtained, and reducing the risk of caching-induced content staleness.

[0068] Furthermore, the `copyPages` command is executed sequentially for each source document, and then `addPage` is added to the final document. Afterward, for each newly added PDF page, coordinates are calculated based on the page size, and the `drawText` function (a function used to draw and format text within a specified rectangular area) is executed at the top of the page to write attachment identifiers, page numbers, and other content. Finally, `doc.save()` is executed to obtain bytes, which are then encapsulated into a Blob (an HTML5 object used to represent immutable raw binary data) and returned to the caller for downloading or previewing. `doc.save()` is a common method in various document processing libraries used to save document objects in memory to a file or stream.

[0069] In this embodiment, the fontkit and embedFont(subset:true) font embedding strategies are used uniformly during the merging stage to ensure that multilingual characters are displayed consistently in the drawText overlay annotation and to reduce the file size.

[0070] Specifically, in one implementation of this embodiment, step S402 includes the following steps: Step S4021: Obtain the font file binary from the Font Uniform Resource Locator or local resources, and register the browser font engine with the PDF Development Database to support TrueType fonts or OpenType fonts. Step S4022: Use the embedFont instruction to embed the corresponding font, and use the drawText instruction to convert all fonts into the embedded font. Step S4023: In the final document, for each newly added page, execute the drawText command in the top area of ​​the page to write a label string to achieve a unified header effect; wherein, the label string includes: page number, timestamp, watermark or verification code.

[0071] In this embodiment, after the pages are merged, drawText is executed page by page to overlay headers, attachment identifiers, or page numbers, achieving a unified annotation strategy independent of the source; and the final PDF is delivered on the client side in the form of Blob('application / pdf'), supporting direct download, preview, and local printing.

[0072] As an example, such as Figure 3 As shown, in one application scenario, this embodiment provides a browser-based method for merging and generating multi-source PDFs, which includes the following steps: S1: Initialization. Create the final PDFDocument, register the fontkit, retrieve the font binary from the font URL / built-in resources, and execute embedFont(..., { subset: true}).

[0073] S2: The template is rendered as HTML. The `renderToString(createApp(comp))` method is executed on the template component to be output, resulting in a collection of HTML strings.

[0074] S3: HTML to pdfmake description. Uses html-to-pdfmake to convert HTML and configures default styles (headings, paragraphs, tables, etc.).

[0075] S4: Generate an intermediate PDF buffer. Call pdfmake.createPdf(...).getBuffer(...) to obtain the intermediate PDF binary.

[0076] S5: Load the intermediate PDF. Execute PDFDocument.load(buffer) on the intermediate PDF to obtain a document object containing the copyable pages.

[0077] S6: Retrieve and load remote PDFs. Use `fetch` on each remote URL to retrieve the binary and load it using `PDFDocument.load(...)`. To avoid caching and outdated content, you can append `?t=Date.now()`.

[0078] S7: Page-level merging. Performs copyPages sequentially for each source document and adds the Page to the final document.

[0079] S8: Overlay text annotations. For each new page, calculate the coordinates based on the page size, execute drawText in the top area of ​​the page, and write attachment identifiers / page numbers, etc.

[0080] S9: Output. Executing doc.save() yields bytes, which are then encapsulated as a Blob and returned to the caller for downloading or previewing.

[0081] like Figure 4 As shown, in the above process, to ensure that Chinese characters and special symbols are displayed consistently in the "Generated Page" and "Overlay Annotation", the following strategy is adopted in this embodiment: 1) Font Acquisition: Obtain the font file binary from the font URL or local resources; 2) Font registration: Register the fontkit for pdf-lib to support TrueType / OpenType fonts; 3) Font embedding and subsettization: Use embedFont(..., { subset: true}) to embed only the glyphs actually used, reducing the final PDF size; 4) Consistent drawing: drawText uses the same embedded font to avoid garbled characters or missing characters caused by missing system fonts.

[0082] like Figure 5 As shown, in the above process, this embodiment organizes the merging and labeling in the manner of "source sequence + page order": 1) Establish a MergePlan: including the sorting of template sources and remote sources, and the labeling rules for each source; 2) Copy pages by source: Execute getPageIndices for each source to obtain the page index, and then use copyPages to copy them in batches; 3) Overlay annotations page by page: For each new page, write the annotation string in the top area of ​​y = pageHeight - offset to achieve a uniform header effect; 4) Optional extensions: Add page numbers, timestamps, watermarks, or verification codes.

[0083] Compared with traditional technical solutions, the technical solution provided in this embodiment has the following advantages:

[0084] It is worth mentioning that in some other application scenarios, the method provided in this embodiment can be improved or modified in the following ways, for example: 1) Template rendering replacement: Replace vue / server-renderer with the SSR / static rendering solution of other component frameworks to output equivalent HTML.

[0085] 2) Replacement of typesetting engine: Replace pdfmake with other front-end typesetting and generation engines, as long as they can output intermediate PDFs that can be loaded by pdf-lib.

[0086] 3) Remote resource acquisition strategy: Add retry, timeout, concurrency control or Service Worker caching; use signed URLs or proxy methods for cross-domain resources.

[0087] 4) Performance optimization: Move the recalculation of S2 to S7 into Web Worker; perform hash caching for fonts and remote PDFs; merge segments by source to reduce peak memory usage.

[0088] 5) Security Enhancement: Add watermarks, encryption, access control, or digital signatures to the output PDF (as an enhancement module without changing the core merging process).

[0089] It is understood that all the improvements and modifications based on the above embodiments should fall within the protection scope of the present invention.

[0090] This embodiment achieves the following technical effects through the above technical solution: 1) This embodiment completes the generation and merging of multi-source PDFs on the browser side, reducing the dependence on backend rendering services and resource overhead. Furthermore, it uses structured typesetting to generate vector PDFs, avoiding the problems of unsearchability and distortion caused by rasterizing screenshots.

[0091] 2) This embodiment achieves a source-independent unified header and numbering strategy by merging and overlaying annotations at the page level. Furthermore, by using font subsetation and resource reuse, it can control the file size while ensuring the correct display of Chinese characters or symbols.

[0092] 3) This embodiment improves the consistency and controllability of the final document through configurable remote acquisition and cache avoidance strategies.

[0093] Exemplary device Based on the above embodiments, the present invention also provides a browser-based multi-source PDF merging and generation system, comprising: The template rendering module is used to execute template rendering instructions on the template components to be output, and obtain HTML strings; The HTML structuring conversion module is used to convert the HTML string into a structured description required by the browser-side PDF generation database. An intermediate PDF generation module is used to generate an intermediate PDF document based on the structured description and using intermediate PDF generation instructions; The remote PDF acquisition module is used to acquire the remote PDF binary data corresponding to the intermediate PDF document; The PDF parsing and merging module is used to load multi-source PDF binary data and copy the corresponding PDF pages to the final document. The font management module is used to manage the fonts in the final document; The text annotation overlay module is used to perform text annotation overlay processing on the final document; The output module is used to output the final processed document.

[0094] This embodiment achieves the following technical effects through the above technical solution: 1) This embodiment completes the generation and merging of multi-source PDFs on the browser side, reducing the dependence on backend rendering services and resource overhead. Furthermore, it uses structured typesetting to generate vector PDFs, avoiding the problems of unsearchability and distortion caused by rasterizing screenshots.

[0095] 2) This embodiment achieves a source-independent unified header and numbering strategy by merging and overlaying annotations at the page level. Furthermore, by using font subsetation and resource reuse, it can control the file size while ensuring the correct display of Chinese characters or symbols.

[0096] 3) This embodiment improves the consistency and controllability of the final document through configurable remote acquisition and cache avoidance strategies.

[0097] Based on the above embodiments, the present invention also provides a terminal, the principle block diagram of which can be as follows: Figure 6 As shown.

[0098] The terminal includes: a processor, a memory, an interface, a display screen, and a communication module connected via a system bus; wherein, the processor of the terminal provides computing and control capabilities; the memory of the terminal includes a computer-readable storage medium and internal memory; the computer-readable storage medium stores an operating system and computer programs; the internal memory provides an environment for the operation of the operating system and computer programs in the computer-readable storage medium; the interface is used to connect to external devices; the display screen is used to display relevant information; and the communication module is used to communicate with a cloud server or other devices.

[0099] When executed by the processor, this computer program is used to implement a browser-based method for merging and generating multi-source PDFs.

[0100] It will be understood by those skilled in the art that Figure 6 The schematic diagram shown is merely a partial structural diagram related to the present invention and does not constitute a limitation on the terminal to which the present invention is applied. A specific terminal may include more or fewer components than those shown in the figure, or combine certain components, or have different component arrangements.

[0101] In one embodiment, a terminal is provided, comprising: a processor and a memory, the memory storing a browser-based multi-source PDF merging and generation program, which, when executed by the processor, is used to implement the above-described browser-based multi-source PDF merging and generation method.

[0102] In one embodiment, a computer-readable storage medium is provided, wherein the computer-readable storage medium stores a browser-based multi-source PDF merging and generation program, which, when executed by a processor, is used to implement the above-described browser-based multi-source PDF merging and generation method.

[0103] Those skilled in the art will understand that all or part of the processes in the methods of the above embodiments can be implemented by a computer program instructing related hardware. The computer program can be stored in a non-volatile storage medium, and when executed, it can include the processes of the embodiments of the methods described above. Any references to memory, storage, database, or other media used in the embodiments provided by this invention can include both non-volatile and volatile memory.

[0104] In summary, this invention provides a browser-based method, system, terminal, and storage medium for merging and generating multi-source PDFs. The method includes: executing template rendering instructions on the template component to be output to obtain an HTML string; converting the HTML string into a structured description required by the browser-based PDF generation database; generating an intermediate PDF document based on the structured description using intermediate PDF generation instructions, and obtaining the remote PDF binary data corresponding to the intermediate PDF document; loading the multi-source PDF binary data, copying the corresponding PDF pages to the final document, and performing font management and text annotation overlay processing on the final document; and outputting the processed final document. This invention reduces the dependence on backend rendering services and resource overhead, avoids the unsearchability and distortion problems caused by rasterizing screenshots, and achieves a source-independent unified header or numbering strategy.

[0105] It should be understood that the application of the present invention is not limited to the examples above. Those skilled in the art can make improvements or modifications based on the above description, and all such improvements and modifications should fall within the protection scope of the appended claims.

Claims

1. A method for merging and generating multi-source PDFs based on a browser, characterized in that, include: Execute template rendering instructions on the template component to be output to obtain an HTML string; The HTML string is converted into a structured description required for generating a PDF database in the browser. Based on the structured description, an intermediate PDF document is generated using intermediate PDF generation instructions, and the remote PDF binary data corresponding to the intermediate PDF document is obtained. Load multi-source PDF binary data, copy the corresponding PDF pages to the final document, and perform font management and text annotation overlay processing on the final document; Output the final document after processing.

2. The method for merging and generating multi-source PDFs based on a browser as described in claim 1, characterized in that, The template rendering instruction is executed on the template component to be output to obtain an HTML string, including: Initialize browser-side system configuration; The renderToString instruction is executed on the template component to be output to obtain the HTML string.

3. The method for merging and generating multi-source PDFs based on a browser as described in claim 1, characterized in that, The process of converting the HTML string into a structured description required for generating a PDF database on the browser side includes: The HTML string is converted using the html-to-pdfmake command, and the default style is configured to obtain the structured description required by the browser-side PDF generation database; wherein, the default style includes: headings, paragraphs and tables.

4. The method for merging and generating multi-source PDFs based on a browser as described in claim 1, characterized in that, The step of generating an intermediate PDF document using intermediate PDF generation instructions based on the structured description, and obtaining the remote PDF binary data corresponding to the intermediate PDF document, includes: The pdfmake.getBuffer instruction is called to convert the structured description and obtain the intermediate PDF document; The PDFDocument.load instruction is executed on the intermediate PDF document to obtain a document object with copyable pages, and the remote PDF binary data is obtained through the fetch instruction.

5. The method for merging and generating multi-source PDFs based on a browser as described in claim 1, characterized in that, The process of loading multi-source PDF binary data, copying the corresponding PDF pages to the final document, and performing font management and text annotation overlay processing on the final document includes: Load the multi-source PDF binary data, and execute the copyPages instruction on each source PDF document in the loading order to copy the corresponding PDF pages to the final document; In the final document, fonts are embedded and subsetted using the registerFontkit and embedFont directives, and the drawText directive is used on each page of the final document to overlay headers, numbering, and attachment identifiers.

6. The method for merging and generating multi-source PDFs based on a browser as described in claim 5, characterized in that, The process of embedding fonts using the registerFontkit and embedFont directives and then performing subset processing includes: Obtain font file binaries from the Font Uniform Resource Locator or local resources, and register browser font engines with the PDF Development Database to support TrueType or OpenType fonts; The corresponding font is embedded using the embedFont directive, and all fonts are uniformly converted to the embedded font using the drawText directive.

7. The method for merging and generating multi-source PDFs based on a browser as described in claim 1, characterized in that, The step of using the drawText command on each page of the final document to overlay headers, numbering, and attachment identifiers includes: In the final document, for each newly added page, the drawText command is executed in the top area of ​​the page to write a label string to achieve a uniform header effect; wherein, the label string includes: page number, timestamp, watermark or check code.

8. A browser-based multi-source PDF merging and generation system, characterized in that, include: The template rendering module is used to execute template rendering instructions on the template components to be output, and obtain HTML strings; The HTML structuring conversion module is used to convert the HTML string into a structured description required by the browser-side PDF generation database. An intermediate PDF generation module is used to generate an intermediate PDF document based on the structured description and using intermediate PDF generation instructions; The remote PDF acquisition module is used to acquire the remote PDF binary data corresponding to the intermediate PDF document; The PDF parsing and merging module is used to load multi-source PDF binary data and copy the corresponding PDF pages to the final document. The font management module is used to manage the fonts in the final document; The text annotation overlay module is used to perform text annotation overlay processing on the final document; The output module is used to output the final processed document.

9. A terminal, characterized in that, include: The processor and memory, wherein the memory stores a browser-based multi-source PDF merging and generation program, which, when executed by the processor, is used to implement the browser-based multi-source PDF merging and generation method as described in any one of claims 1-7.

10. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a browser-based multi-source PDF merging and generation program, which, when executed by a processor, is used to implement the browser-based multi-source PDF merging and generation method as described in any one of claims 1-7.