A method and system for on-demand generation of 3D renderings

By using CDN caching and server-side rendering, the problem of client-side resource consumption during the generation of customized product renderings was solved, improving user experience and system resource utilization.

CN115168763BActive Publication Date: 2025-12-12XIAMEN FINGERPRINT TECH CO LTD
View PDF 1 Cites 0 Cited by

Patent Information

Application Number
CN202210885070.4
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2022-07-26
Publication Date
2025-12-12
Estimated Expiration
2042-07-26

AI Technical Summary

Technical Problem

Existing technologies, when generating customized product renderings, result in excessive client-side resource consumption, computer lag, and a poor user experience, especially when rendering large amounts of graphics.

Method used

By caching pre-compiled static image files via CDN and dynamically generating and statically saving images when needed by users, server-side rendering is used to reduce the burden on the client and achieve on-demand rendering.

Benefits of technology

It effectively distributes user traffic, reduces backend service pressure, improves user experience, avoids prolonged client lag, and enhances system resource utilization.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN115168763B_ABST
    Figure CN115168763B_ABST
Patent Text Reader

Abstract

The application provides a method for generating a 3D effect picture on demand, which comprises the following steps: S1, obtaining a picture file pre-stored on a CDN; S2, judging whether the picture file exists or not, and accessing a picture server if the picture file exists; S3, further obtaining and accessing a cache path of a design picture; S4, judging whether the design picture has been synthesized or not, and accessing picture source data and downloading if the design picture has been synthesized, and directly using the design picture to synthesize an effect picture; S5, otherwise, synthesizing the design picture first and then using the design picture to synthesize an effect picture. Through the pseudo-static technical scheme, corresponding pictures are dynamically produced when the user actually applies the demand, the synthesized pictures are statically stored, and the pictures are cached to the nearest access point on demand when the user accesses through the CDN application. When a large number of concurrent accesses occur, the user traffic is sufficiently dispersed, the pressure on the backend service is avoided, the server side is rendered, and the purpose of rendering on demand is achieved.
Need to check novelty before this filing date? Find Prior Art

Description

TECHNICAL FIELD

[0001] The application belongs to the technical field of software technology, and particularly relates to a method and system for generating 3D effect pictures on demand. BACKGROUND

[0002] A user can combine his own design resources (pictures, texts, etc.) with a product (such as a hat, a mobile phone case, etc.) with a 3D model in the form of a picture, preview the design in real time through a what-you-see-is-what-you-get (WYSIWYG) mode, and finally obtain a customized product that is satisfactory to the user and a series of pictures of the product from different angles, which are called customized product effect pictures. The design picture can be combined with the 3D model in the form of a picture to make the design picture more realistically fit the wrinkles and curved parts of the product, so that the effect picture is more realistic.

[0003] When the user downloads the customized product effect picture in a browser, the model file, the picture file and other resources are downloaded from the server by executing a script code, and the model and the picture are rendered by the webgl engine of the browser. However, the number of customized product effect pictures is usually large, and the model file and the picture file required for synthesizing each effect picture usually have a large file size. Long-time downloading causes a long time for the user, and the limited computing power of the client causes the computer to lag during a large amount of graphic rendering, which causes the user to be unable to accept and experience the effect.

[0004] Therefore, it is very meaningful to propose a method and system for generating 3D effect pictures on demand. SUMMARY

[0005] In order to solve the problems of occupying a large amount of client resources, causing the computer to lag and causing the user to be unable to accept and experience the effect during the customization of the product effect picture, the application provides a method and system for generating 3D effect pictures on demand to solve the above technical defects.

[0006] In a first aspect, the application provides a method for generating 3D effect pictures on demand, which comprises the following steps:

[0007] S1, obtaining a picture file pre-cached on a CDN;

[0008] S2, judging whether the picture file exists, and if so, accessing a picture server;

[0009] S3, further obtaining and accessing a cache path of a design picture;

[0010] S4, judging whether the design picture has been synthesized, and if so, accessing picture source data and downloading, and directly synthesizing the effect picture by using the design picture;

[0011] S5, otherwise, synthesizing the design picture first and then synthesizing the effect picture by using the design picture.

[0012] Preferably, before step S1, the domain name of the picture file is bound to a CDN access point, so that the user accesses the page from the nearest access point.

[0013] Further preferably, the picture file is a static file written by a synthesized effect picture stream, and the CDN only loads the pre-generated picture file.

[0014] Further preferably, step S2 further comprises: S21, if the page does not exist or has expired in the CDN, the CDN initiates a back-to-source request to the back-to-source address to obtain new file content.

[0015] Preferably, the specific steps of synthesizing the effect picture comprise:

[0016] S51, the server generates a synthesis picture process, the process obtains a webgl context, and injects related javascript code of the synthesized effect picture;

[0017] S52, related resource information in the gltf exported by the modeling software is extracted into a separate file, and the file is compressed into a glb file;

[0018] S53, further load map data and model data;

[0019] S54, the model file is converted from the read base64 format to the ArrayBuffer format, and then combined with related parameters to output a customized product effect picture.

[0020] Preferably, it further comprises:

[0021] S6, if the picture source data problem or network anomaly causes the synthesis of the effect picture to fail, an abnormal response code is returned, and the CDN does not cache at this time.

[0022] Further preferably, step S2 further comprises:

[0023] S22, when the user requests back-to-source to the API gateway, crc32 verification is first performed on the unique code on the picture address, and further hash operation is performed with the server weight configuration file data to ensure that the same source picture set is distributed together.

[0024] In a second aspect, the application further provides a system for generating 3D effect pictures on demand, comprising:

[0025] An acquisition module for acquiring a picture file pre-cached on a CDN;

[0026] A judgment module for judging whether the picture file exists and whether the design picture has been synthesized;

[0027] Synthesis module: for synthesizing the effect picture;

[0028] Loading module: for loading map data, model data.

[0029] In a third aspect, an electronic device is provided, including: one or more processors; a storage device storing one or more programs, when the one or more programs are executed by the one or more processors, the one or more processors implement the method described in any implementation manner of the first aspect.

[0030] In a fourth aspect, a computer readable storage medium is provided, and the computer readable storage medium stores a computer program, when the computer program is executed by a processor, the computer program implements the method described in any implementation manner of the first aspect.

[0031] Compared with the prior art, the beneficial results of the present application are that:

[0032] (1) Through the pseudo-static technical solution, the corresponding picture is dynamically produced when the user actually applies the demand, and the synthesized picture is statically saved, through the CDN application, the user traffic is dispersed enough when accessing, and the pressure on the backend service is avoided, the server side is rendered, and the purpose of on-demand rendering is achieved.

[0033] (2) The system can bear more peak online user quantity with lower server data, and the system resources are concentrated to provide real active user use, and unnecessary waste is reduced; when a large number of effect pictures are rendered, a large amount of client resources are consumed, the user computer is operated for a long time, the network is occupied, the waiting time is long, and the user experience is poor. BRIEF DESCRIPTION OF DRAWINGS

[0034] The accompanying drawings are included to provide a further understanding of embodiments and are incorporated in and constitute a part of this specification. The drawings illustrate embodiments and, together with the description, serve to explain the principles of the present application. Other embodiments and many of the intended advantages of the present application will be readily appreciated as the same becomes better understood by reference to the following detailed description when considered in connection with the accompanying drawings. The elements of the drawings are not necessarily to scale relative to each other. Like reference numerals designate corresponding similar parts.

[0035] Figure 1 is an exemplary device architecture diagram to which an embodiment of the present application can be applied;

[0036] Figure 2 is a flowchart of a method for on-demand generation of 3D effect pictures according to an embodiment of the present application;

[0037] Figure 3This is an overall architecture diagram of the method for generating 3D renderings on demand according to an embodiment of the present invention;

[0038] Figure 4 A schematic flowchart of a system for generating 3D renderings on demand, according to an embodiment of the present invention;

[0039] Figure 5 This is a schematic diagram of the structure of a computer device suitable for implementing electronic devices according to embodiments of the present invention. Detailed Implementation

[0040] In the following detailed description, reference is made to the accompanying drawings, which form part of the detailed description and are illustrated by specific illustrative embodiments in which the invention may be practiced. In this regard, directional terms such as “top,” “bottom,” “left,” “right,” “up,” “down,” etc., are used with reference to the orientation of the described figures. Because components of the embodiments can be positioned in several different orientations, directional terms are used for illustrative purposes and are by no means limiting. It should be understood that other embodiments may be utilized or logical changes may be made without departing from the scope of the invention. Therefore, the following detailed description should not be taken in a limiting sense, and the scope of the invention is defined by the appended claims.

[0041] It should be understood that Figure 1 The number of terminal devices, networks, and servers shown is merely illustrative. Depending on implementation needs, any number of terminal devices, networks, and servers can be included.

[0042] Figure 1 An exemplary system architecture 100 for processing information, or for processing information, to which embodiments of the present invention can be applied, is shown.

[0043] like Figure 1 As shown, system architecture 100 may include terminal devices 101, 102, and 103, a network 104, and a server 105. Network 104 serves as the medium for providing communication links between terminal devices 101, 102, and 103 and server 105. Network 104 may include various connection types, such as wired or wireless communication links, or fiber optic cables, etc.

[0044] Users can use terminal devices 101, 102, and 103 to interact with server 105 via network 104 to receive or send messages, etc. Various communication client applications can be installed on terminal devices 101, 102, and 103, such as web browser applications, shopping applications, search applications, instant messaging tools, email clients, social media platform software, etc.

[0045] The terminal devices 101, 102 and 103 can be various electronic devices with communication functions, including but not limited to smart phones, tablet computers, laptop computers and desktop computers, and the like.

[0046] The server 105 can be a server providing various services, such as a background information processing server processing the check request information sent by the terminal devices 101, 102 and 103. The background information processing server can analyze and process the received check request information, and obtain a processing result (for example, check success information representing that the check request is a legal request).

[0047] It should be noted that the method for processing information provided by the embodiment of the application is generally executed by the server 105, and correspondingly, the device for processing information is generally arranged in the server 105. In addition, the method for sending information provided by the embodiment of the application is generally executed by the terminal devices 101, 102 and 103, and correspondingly, the device for sending information is generally arranged in the terminal devices 101, 102 and 103.

[0048] It should be noted that the server can be hardware or software. When the server is hardware, it can be implemented as a distributed server cluster composed of multiple servers, or as a single server. When the server is software, it can be implemented as multiple software or software modules (for example, for providing distributed services), or as a single software or multiple software modules, which are not limited here.

[0049] The user can combine his own design resources such as pictures, texts, etc. with goods with 3D models (such as hats, mobile phone boxes, etc.) in the form of a map, preview the real-time design through what you see is what you get, and finally obtain a customized product that the user is satisfied with after self-design, and generate a series of pictures of each angle of the corresponding goods, which is called a customized product effect drawing. The design drawing can be combined with the 3D model in the form of a map to make the design drawing more realistically fit the wrinkles and curved parts of the goods, so that the effect drawing is more realistic. After the design is completed, all the effect drawings of the generated customized product need to be downloaded and posted on an e-commerce platform (such as Amazon, etc.).

[0050] Figure 2 An embodiment of the application discloses a method for generating 3D effect drawings on demand, as shown in Figure 2 and Figure 3 The method comprises the following steps:

[0051] S0, binding the domain name of the picture file to a CDN access point, so that the user accesses the page to access the nearest access point nearby;

[0052] S1, obtaining the picture file pre-cached on the CDN;

[0053] S2, judging whether the picture file exists, if so, accessing the picture server;

[0054] Specifically, in the embodiment, the picture file is a static file written by a synthesized effect picture stream, and the picture file that has been pre-generated is only loaded from the CDN.

[0055] Further, step S2 further includes:

[0056] S21, if the page does not exist in the CDN or has expired, the CDN initiates a back-to-source request to the back-to-source address to obtain new file content; in this embodiment, the back-to-source address is the API gateway of the back end.

[0057] S22, when the user requests to back to the API gateway, crc32 is checked through the unique code on the picture address, and further hash operation is performed with the server weight configuration file data to ensure that the same source picture set is distributed together.

[0058] In this embodiment, the target node of distribution will also be appropriately changed according to the load condition of each node to maximize the use of the same resource on the same platform.

[0059] S3, further obtaining and accessing the cache path of the design picture;

[0060] S4, judging whether the design picture has been synthesized, if so, accessing the picture source data and downloading, and directly using the design picture to synthesize the effect picture;

[0061] S5, otherwise, synthesizing the design picture and then using the design picture to synthesize the effect picture.

[0062] S6, if the picture source data problem or network exception causes the synthesis of the effect picture to fail, an abnormal response code is returned, and at this time the CDN does not cache.

[0063] The specific steps of synthesizing the effect picture include:

[0064] S51, the server generates a synthesis picture process, the process obtains a webgl context, and injects related javascript code of the synthesized effect picture;

[0065] S52, related resource information in the gltf exported in the modeling software is extracted to a separate file, and the file is compressed into a glb file;

[0066] S53, further loading map data and model data;

[0067] S54, the model file is converted from the base64 format read out into an Array Buffer format, and relevant parameters are combined to output a customized product effect picture.

[0068] Specifically, map data (such as normal, color map, environment map, etc.), model data (glb file), and relevant parameters (such as light, model position, camera angle, model definition, component information, etc.) are loaded.

[0069] Further, in the embodiment, the process picture does not use the path passing mode, but uses the parameter to ensure the uniqueness of the picture path at different levels, thereby reducing the complexity of level passing.

[0070] While normally synthesizing the effect picture, a thumbnail cache local static file is made according to the current specified size, and a picture stream is returned to the CDN for caching; when other users access the same picture request back source, the static file can be found to return the already static file.

[0071] The technical scheme of the application produces corresponding pictures dynamically when the user actually needs them, saves the synthesized pictures statically, applies the CDN, caches the pictures to the nearest access point on demand when the user accesses, disperses the user traffic sufficiently in a large concurrency, avoids excessive pressure on the backend service, uses the server-side rendering, and realizes the on-demand rendering purpose.

[0072] The system can bear more peak online user quantity with lower server data, concentrates system resources to provide real active user usage, reduces unnecessary waste, prevents a large number of effect pictures from consuming a large amount of client resources when rendering, causes the user computer to operate for a long time, occupies the network, causes a long waiting time, and causes poor user experience.

[0073] In a second aspect, the application further provides a system for generating 3D effect pictures on demand, as shown in Figure 4 The system comprises:

[0074] The acquisition module 41 is used for acquiring the picture file pre-cached on the CDN.

[0075] The judgment module 42 is used for judging whether the picture file exists and whether the design picture has been synthesized.

[0076] The synthesis module 43 is used for synthesizing the effect picture.

[0077] The loading module 44 is used for loading the map data and the model data.

[0078] Reference will be made to Figure 5 which shows an electronic device (such as a mobile phone, a tablet computer, a computer, a wearable device, or the like) suitable for use to implement embodiments of the application. Figure 1A structural diagram of a computer device 600 of a server or terminal device shown. Figure 5 The electronic device shown is merely an example and should not impose any limitation on the functions and use range of the embodiments of the present disclosure.

[0079] As Figure 5 As shown, the computer device 600 includes a central processing unit (CPU) 601 and a graphics processor (GPU) 602, which can perform various appropriate actions and processes according to programs stored in a read-only memory (ROM) 603 or programs loaded from a storage section 609 into a random access memory (RAM) 606. In the RAM 604, various programs and data required for the operation of the device 600 are also stored. The CPU 601, the GPU 602, the ROM 603, and the RAM 604 are connected to each other through a bus 605. An input / output (I / O) interface 606 is also connected to the bus 605.

[0080] The following components are connected to the I / O interface 606: an input section 607 including a keyboard, a mouse, etc.; an output section 608 including a display such as a cathode ray tube (CRT) display, a liquid crystal display (LCD), etc., and a speaker, etc.; a storage section 609 including a hard disk, etc.; and a communication section 610 including a network interface card such as a LAN card, a modem, etc. The communication section 610 performs communication processing via a network such as the Internet. A drive 611 can also be connected to the I / O interface 606 as needed. A removable media 612 such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, etc. is attached to the drive 611 as needed, so that a computer program read therefrom is installed into the storage section 609 as needed.

[0081] In particular, according to the embodiments of the present disclosure, the processes described above with reference to the flowcharts can be implemented as a computer software program. For example, the embodiments of the present disclosure include a computer program product including a computer program carried on a computer-readable medium, the computer program containing program codes for executing the methods shown in the flowcharts. In such embodiments, the computer program can be downloaded and installed from a network by the communication section 610, and / or installed from the removable media 612. When the computer program is executed by the central processing unit (CPU) 601 and the graphics processor (GPU) 602, the above-described functions defined in the methods of the present disclosure are performed.

[0082] It should be noted that the computer-readable medium of the present application can be a computer-readable signal medium or a computer-readable storage medium or any combination of the two. The computer-readable medium may, for example, be— but is not limited to— an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any suitable combination of the above. More specific examples of the computer-readable medium can include— but are not limited to— an electrical connection having one or more wires, a portable computer diskette, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or Flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present application, the computer-readable medium can be any tangible medium that contains or stores a program used by or in connection with an instruction execution system, apparatus, or device. In the present application, the computer-readable signal medium can include a data signal traveling in a baseband or an analog or digital carrier wave or other transport medium, in which the computer-readable program code is contained or stored. Such a program code traveling in a carrier wave can take any of a variety of forms, including but not limited to— electromagnetic, optical, or other types of signals. The computer-readable medium can also be any computer-readable medium other than the computer-readable medium that can transmit, propagate, or transport the program for use by or in connection with the instruction execution system, apparatus, or device. The program code contained or stored by the computer-readable medium can be transmitted or propagated using any suitable medium, including but not limited to— wireless, wire line, optical fiber, RF, etc., or any suitable combination of the above.

[0083] Computer program code for carrying out operations of the present application can be written in any combination of one or more programming languages, including an object oriented programming language such as Java, Smalltalk, C++ or the like, and conventional procedural programming languages, such as the "C" programming language or similar programming languages. The program code can execute entirely on the user's computer, partly on the user's computer, as a stand-alone software package, partly on the user's computer and partly on a remote computer or entirely on the remote computer or server. In the latter scenario, the remote computer can be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or the connection can be made to an external computer (for example, through the Internet using an Internet Service Provider).

[0084] The computer readable medium can be a storage medium or memory medium such as, but not limited to, readable and / or writeable nonvolatile memory devices (e.g., EPROM, EEPROM, Flash memory, etc.); volatile storage devices (e.g., RAM such as SRAM, DRAM, zero bus, etc.); or any memory storage devices suitable for the storage and / or transmission of information.

[0085] The modules described in the embodiments of the present application can be implemented by software or by hardware. The modules described can be located in a processor.

[0086] As another aspect, the present application also provides a computer readable medium, which can be included in the electronic device described in the above embodiments, or can exist separately without being assembled into the electronic device. The computer readable medium carries one or more programs, which, when executed by the electronic device, cause the electronic device to perform the method steps as described in the first aspect.

[0087] The above description is merely illustrative of the exemplary embodiments of the present application and the principles of the technology involved. It is understood that the scope of the present application is not limited to the specific combinations of technical features described above, and should also cover other technical solutions formed by any combination of the above technical features or equivalent features, without departing from the inventive concept. For example, the above technical features can be replaced with other technical features disclosed in the present application (but not limited to) having similar functions to form technical solutions.

Claims

1. A method of generating a 3D rendering on demand, characterized in that, The method comprises the following steps: S1, obtaining a picture file pre-cached on a CDN; S2, judging whether the picture file exists, and if so, accessing a picture server; S3, further obtaining and accessing a cache path of a design drawing; S4, judging whether the design drawing has been synthesized, and if so, accessing picture source data and downloading, and directly using the design drawing to synthesize a rendering; S5, otherwise, first synthesizing the design drawing and then using the design drawing to synthesize a rendering, when synthesizing a 3D rendering, generating a synthesis process and obtaining a WebGL context, injecting synthesis-related JavaScript code, extracting relevant resource information from a gltf file exported by modeling software to a separate file, and compressing the file into a glb file, after loading the texture data and the model data, converting the model file from base64 format read out to ArrayBuffer format, combining light parameters, camera angle parameters and model clarity parameters to generate a 3D rendering; S6: if the synthesis fails, return an abnormal response code, and the CDN does not cache the abnormal result; Wherein, while normally synthesizing the rendering, a thumbnail cache local static file is made according to the current specified size, and a picture stream is returned to the CDN for caching.

2. The method of on-demand generation of 3D renderings of claim 1, wherein, Before step S1, the domain name of the picture file is bound to a CDN access point, so that when a user accesses a page, the nearest access point is accessed.

3. The method of on-demand generation of 3D renderings according to claim 2, characterized in that, The picture file is a static file written by a synthesized rendering stream, and only the pre-generated picture file is loaded from the CDN.

4. The method of on-demand generation of 3D renderings of claim 3, wherein, Step S2 further comprises: S21, if the page does not exist or has expired in the CDN, the CDN initiates a back-to-source request to a back-to-source address to obtain new file content.

5. The method of on-demand generation of 3D renderings of claim 3, wherein, Step S2 further comprises: S22, when a user requests to back to the API gateway, first do crc32 check through the unique code on the picture address, and further do hash operation with the server weight configuration file data to ensure that the same source set is distributed together.

6. A system for generating 3D renderings on demand, characterized in that, For implementing the method of any one of claims 1-5, comprising: an obtaining module for obtaining a picture file pre-cached on a CDN; a judging module for judging whether the picture file exists and whether the design drawing has been synthesized; a synthesizing module for synthesizing a rendering; a loading module for loading texture data and model data.

7. An electronic device, comprising: one or more processors; storage configured to store one or more programs; when the one or more programs are executed by the one or more processors, the one or more processors implement the method of any one of claims 1-5.

8. A computer-readable storage medium having stored thereon a computer program, characterized in that, The program is executed by the processor to implement the method of any one of claims 1-5. The program is executed by the processor to implement the method of any one of claims 1-5.

Citation Information

Patent Citations

  • Webpage rendering method and device, electronic equipment and computer readable storage medium

    CN113468456A