Picture reading method for H5 display mobile phone system picture
The ZZLGCDWebServer framework handles mobile phone system images on iOS system devices, solving the file access problems caused by security restrictions, achieving efficient image reading and management, and improving user experience and operation efficiency.
Patent Information
- Application Number
- CN202510356943.6
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-03-25
- Publication Date
- 2025-06-27
AI Technical Summary
On iOS system devices, due to security restrictions and privacy protection, the system images cannot be accessed directly, which restricts the access to the file system, resulting in the user encountering the problem of reading and processing performance degradation when uploading and managing mobile phone system images on the H5 page.
By initializing ZZLGCDWebServer, creating temporary folders, using ZZLGCDWebServerDataRequest and ZZLGCDWebServerFileResponse to handle multipart/form-data type requests, realizing the parsing and response of file contents, and avoiding performance degradation caused by blocking.
It realizes efficient reading and processing of mobile phone system pictures on iOS system devices, ensuring that users can view, delete or add new pictures in a timely manner on the H5 page, and improving user experience and operation efficiency.
Smart Images

Figure CN120216223A_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the field of reading picture frameworks of mobile phone systems, and particularly to a picture reading method for displaying mobile phone system pictures on H5. Background Art
[0002] When users use a mobile banking app to operate business functions such as material management, contract management, document management, adding attachments, and editing products on an H5 page and upload pictures, it is crucial that the H5 page can promptly display the selected mobile phone system pictures after uploading. On mobile devices, especially iOS system devices, due to security restrictions and privacy protection, it may not be possible to directly access system pictures, which limits access to the file system. Enabling users to view the pictures they upload, facilitating users to delete or add new pictures at any time, meeting users' personalized needs for picture management, making users more convenient and efficient during use, and making users' operations more handy.
[0003] When processing a large number of or large files, it may have a certain impact on the performance of the device. Especially on devices with limited resources, it may lead to performance degradation or resource exhaustion.
[0004] Different browsers have different degrees of support for the H5 file API, which may cause the inability to normally read or process picture files on some browsers. Summary of the Invention
[0005] In view of the above problems, the present invention is proposed to provide a picture reading method for displaying mobile phone system pictures on H5 that overcomes the above problems or at least partially solves the above problems.
[0006] According to one aspect of the present invention, there is provided a picture reading method for displaying mobile phone system pictures on H5, the picture reading method comprising:
[0007] Initialize ZZLGCDWebServer, first create a singleton class of ZZLGCDWebServerTool, configure the webServer, add the handler path of the request as the root path, set the Web server directory as the temporary folder path / temp, and traverse all sub-folder paths under the temporary folder;
[0008] Implement the Web server method for starting ZZLGCDWebServer, the Web server method for pausing ZZLGCDWebServer, and implement the ZZLGCDWebServer proxy method;
[0009] Use a subclass of ZZLGCDWebServerDataRequest
[0010] ZZLGCDWebServerMultiPartFormRequest;
[0011] Parse the body data when the Content-Type is multipart / form-data;
[0012] Use the subclass ZZLGCDWebServerFileResponse of ZZLGCDWebServerResponse to take the file content as the response information.
[0013] Optionally, the image reading method further includes:
[0014] Use the _start method of ZZLGCDWebServer to obtain the listening port of the externally configured server and determine the form of accessing the server;
[0015] Set the maximum number of connections in the waiting connection queue, create a listen socket, and start listening on the listen socket.
[0016] Optionally, the method for creating the source of the listen socket includes: listening for the source of readable content.
[0017] Optionally, after the listening source obtains the listening event, establish a connection with the client, and generate a socket called: connect socket. If the connection is successfully established, obtain the address information of the connector.
[0018] Optionally, the image reading method further includes:
[0019] Process the request, read the header, and use the dispatch_read method of ZZLGCDWebServer to read the data;
[0020] Process the request, read the body data, and use different subclasses of ZZLGCDWebServerRequest to process the body data of different requests to conveniently format or store the body data.
[0021] Optionally, the ZZLGCDWebServerDataRequest specifically includes:
[0022] Save the data of the body in the form of the original data, and provide convenient attributes such as text and jsonObject to obtain the decoded body data.
[0023] Optionally, the ZZLGCDWebServerResponse specifically includes:
[0024] After obtaining an instance of ZZLGCDWebServerRequest externally;
[0025] Return an instance of ZZLGCDWebServerResponse;
[0026] Construct the response information by passing in the original Data, and use ZZLGCDWebServerFileResponse to take the file content as the response information.
[0027] Optionally, the picture reading method further includes: by setting the SO_NOSIGPIPE option to prevent the socket from emitting the SIG_PIPE signal, and determining whether to re - establish the connection.
[0028] Optionally, the picture reading method further includes:
[0029] The app writes the pictures selected by the user to the temporary folder path / temp;
[0030] Read the content of the temporary folder path / temp to read the pictures.
[0031] A picture reading method for an H5 to display mobile system pictures provided by the present invention. The picture reading method includes: initializing ZZLGCDWebServer, first creating a singleton class of ZZLGCDWebServerTool, configuring the webServer, adding the request handler path as the root path, setting the web server directory as the temporary folder path / temp, and traversing all sub - folder paths under the temporary folder; implementing the web server method for starting ZZLGCDWebServer, the web server method for pausing ZZLGCDWebServer, and implementing the ZZLGCDWebServer proxy method; using the subclass ZZLGCDWebServerMultiPartFormRequest of ZZLGCDWebServerDataRequest; parsing the body data when the Content - Type is multipart / form - data; using the subclass ZZLGCDWebServerFileResponse of ZZLGCDWebServerResponse to take the file content as the response information. The full - stack asynchronous design avoids performance degradation caused by blocking.
[0032] The above description is only an overview of the technical solution of the present invention. In order to better understand the technical means of the present invention, it can be implemented according to the content of the specification. In addition, in order to make the above and other purposes, features and advantages of the present invention more obvious and understandable, the following specific embodiments of the present invention are provided. Brief Description of the Drawings
[0033] In order to more clearly illustrate the technical solutions of the embodiments of the present invention, the accompanying drawings required for the description of the embodiments will be briefly introduced below. Obviously, the accompanying drawings in the following description are only some embodiments of the present invention. For those of ordinary skill in the art, without creative efforts, other accompanying drawings can be obtained based on these drawings.
[0034] Figure 1 It is a flowchart of a picture reading method for an H5 display mobile phone system picture provided by an embodiment of the present invention;
[0035] Figure 2 It is a flowchart of a method for creating a listen socket and starting to listen to the listen socket provided by an embodiment of the present invention. Detailed Embodiments
[0036] The exemplary embodiments of the present disclosure will be described in more detail below with reference to the accompanying drawings. Although the exemplary embodiments of the present disclosure are shown in the drawings, it should be understood that the present disclosure can be implemented in various forms and should not be limited by the embodiments set forth herein. On the contrary, these embodiments are provided to enable a more thorough understanding of the present disclosure and to fully convey the scope of the present disclosure to those skilled in the art.
[0037] The terms "including" and "having" and any variations thereof in the embodiments of the specification, claims and drawings of the present invention are intended to cover non-exclusive inclusion. For example, a series of steps or units are included.
[0038] The technical solutions of the present invention will be further described in detail below with reference to the accompanying drawings and embodiments.
[0039] H5 display of mobile system pictures based on ZZLGCDWebServer means that when the app starts, ZZLGCDWebServer is initialized. First, a singleton class ZZLGCDWebServerTool is created, the webServer is configured, the handler path of the request is added as the root path, the web server directory is set to the temporary folder path / temp, and all sub-folder paths under the temporary folder are allowed to be traversed. Implement the web server method to start ZZLGCDWebServer, the web server method to pause ZZLGCDWebServer, and implement the ZZLGCDWebServer proxy method. Use the subclass ZZLGCDWebServerMultiPartFormRequest of ZZLGCDWebServerDataRequest: to parse the body data when the Content-Type is multipart / form-data. Use the subclass ZZLGCDWebServerFileResponse of ZZLGCDWebServerResponse: to use the file content as the response information. As Figure 1 shown
[0040] 1. Use the -(BOOL)startWithPort:bonjourName: method of ZZLGCDWebServer to start the web service, passing 80 for port and nil for Name.
[0041] 2. Use the _stop method of ZZLGCDWebServer to pause the web service.
[0042] 3. Use the proxy methods webServerDidStart: and webServerDidStop: of ZZLGCDWebServer to listen for whether the web service has been started or paused successfully.
[0043] 4. Use the _start: method of ZZLGCDWebServer to obtain the listening port of the externally configured server and determine the form of accessing the server. Set the maximum number of connections in the waiting connection queue, create a listen socket, and start listening to the listen socket. As Figure 2 shown
[0044] 5. Create a method for the source that listens to the listen socket, a listen source for whether there is readable content (i.e., whether there is a client connection request).
[0045] 6. After the source monitors an event, it establishes a connection with the client. The socket generated here is called: connectsocket. If the connection is successfully established, the address information of the connector is obtained.
[0046] 7. Process the request, read the header, and use the dispatch_read method of ZZLGCDWebServer to read the data.
[0047] 8. Process the request, read the body data, and use different subclasses of ZZLGCDWebServerRequest to process the body data of different requests to conveniently format or store the body data.
[0048] 9. ZZLGCDWebServerDataRequest: Saves the body data in the form of the original data and provides convenient properties such as text and jsonObject to obtain the decoded body data.
[0049] 10. After obtaining an instance of ZZLGCDWebServerRequest externally, return an instance of ZZLGCDWebServerResponse. Construct the response information by passing in the original Data, and use ZZLGCDWebServerFileResponse to use the file content as the response information.
[0050] 11. Use the autorelease pool to automatically manage the generated connect socket and recycle the repeatedly generated connect sockets to avoid excessive memory consumption and occupying the mobile phone's running memory.
[0051] 12. Set the SO_NOSIGPIPE option to prevent the socket from emitting the SIG_PIPE signal and determine whether to re-establish the connection.
[0052] 13. The app writes the user-selected picture to the temporary folder path / temp and reads the picture by reading the content of the temporary folder path / temp.
[0053] Specific effects include:
[0054] Introducing the ZZLGCDWebServer framework provides flexible APIs that allow developers to customize routing and processing logic to adapt to different business scenarios.
[0055] Introducing the ZZLGCDWebServer framework can be compatible with different mobile phone models and different mobile phone system versions. Especially for iOS devices with security restrictions, it can be used normally.
[0056] Instant communication can be achieved through a local server, quickly responding to upload requests and accelerating the image processing speed.
[0057] Introduce the ZZLGCDWebServer framework to reduce the volume of AppDelegate.
[0058] ZZLGCDWebServer by default uses Apple's GCD (Grand Central Dispatch) to handle requests. This is a powerful framework for concurrent programming, providing functions such as thread management and task scheduling.
[0059] Enable the server to run efficiently on multi-core processors, ensuring the speed and stability of handling requests.
[0060] ZZLGCDWebServer supports the WebSocket protocol, allowing two-way real-time communication. It supports upload and download operations, making file management and data exchange simple.
[0061] Perform necessary processing on the uploaded image data on the server side, such as compression, cropping, format conversion, etc. operations to meet the specific requirements of the application.
[0062] Handle a large number of concurrent connections and have a low memory footprint.
[0063] Full-stack asynchronous design avoids performance degradation caused by blocking.
[0064] Beneficial effects:
[0065] A lightweight method for displaying mobile system images without other redundant code;
[0066] Handle a large number of concurrent connections and have a low memory footprint;
[0067] Full-stack asynchronous design avoids performance degradation caused by blocking.
[0068] The above specific implementation manners further elaborate on the purpose, technical solutions, and beneficial effects of the present invention. It should be understood that the above are only the specific implementation manners of the present invention and are not used to limit the protection scope of the present invention. Any modifications, equivalent replacements, improvements, etc. made within the spirit and principles of the present invention shall be included within the protection scope of the present invention.
Claims
1. A method for reading pictures of an H5 display mobile phone system, characterized in that: The picture reading method comprises: Initialize ZZLGCDWebServer, first create the ZZLGCDWebServerTool singleton class, configure webServer, add the requested handler path as the root path, set the web server directory to the temporary folder path / temp, and traverse all subfolder paths under the temporary folder; Implement the web server method of starting ZZLGCDWebServer, the web server method of pausing ZZLGCDWebServer, and the proxy method of ZZLGCDWebServer; Using a subclass of ZZLGCDWebServerDataRequest ZZLGCDWebServerMultiPartFormRequest; Parse body data when Content-Type is multipart / form-data; Use ZZLGCDWebServerFileResponse, a subclass of ZZLGCDWebServerResponse, to use file content as response information.
2. According to claim 1, a method for reading pictures of an H5 display mobile phone system is characterized in that: The picture reading method also includes: Use the _start method of ZZLGCDWebServer to obtain the listening port of the externally configured server and determine the way to access the server; Set the maximum number of connections in the waiting connection queue, create a listen socket, and start listening on the listen socket.
3. A method for reading pictures of an H5 display mobile phone system according to claim 2, characterized in that: The method for creating a source of a listen socket includes: whether there is a listening source with readable content.
4. According to claim 3, a method for reading pictures of an H5 display mobile phone system is characterized in that: After the monitoring source obtains the monitoring event, it establishes a connection with the client and generates a socket called: connect socket. If the connection is successfully established, the address information of the connector is obtained.
5. The method for reading pictures of an H5 display mobile phone system according to claim 1, characterized in that: The picture reading method also includes: Process the request, read the header, and use the dispatch_read method of ZZLGCDWebServer to read the data; Process the request, read the body data, use different subclasses of ZZLGCDWebServerRequest to process the body data of different requests to conveniently format or store the body data.
6. A method for reading pictures of an H5 display mobile phone system according to claim 1, characterized in that: The ZZLGCDWebServerDataRequest specifically includes: The body data is saved in the form of original data, and the text and jsonObject convenience properties are provided to obtain the decoded body data.
7. A method for reading pictures of an H5 display mobile phone system according to claim 1, characterized in that: The ZZLGCDWebServerResponse specifically includes: After obtaining the ZZLGCDWebServerRequest instance externally; Returns a ZZLGCDWebServerResponse instance; Construct the response information by passing in the original Data, and use ZZLGCDWebServerFileResponse to use the file content as the response information.
8. The method for reading pictures of an H5 display mobile phone system according to claim 1, characterized in that: The image reading method further includes: setting the SO_NOSIGPIPE option so that the socket does not transmit a SIG_PIPE signal, and determining whether to re-establish the link.
9. A method for reading pictures of an H5 display mobile phone system according to claim 1, characterized in that: The picture reading method also includes: The app writes the image selected by the user to the temporary folder path / temp; Read the contents of the temporary folder path / temp and read the image.