WO2021143828A1 - 图片加载方法及电子设备 - Google Patents

图片加载方法及电子设备 Download PDF

Info

Publication number
WO2021143828A1
WO2021143828A1 PCT/CN2021/072110 CN2021072110W WO2021143828A1 WO 2021143828 A1 WO2021143828 A1 WO 2021143828A1 CN 2021072110 W CN2021072110 W CN 2021072110W WO 2021143828 A1 WO2021143828 A1 WO 2021143828A1
Authority
WO
WIPO (PCT)
Prior art keywords
target
picture
format
browser
image
Prior art date
Application number
PCT/CN2021/072110
Other languages
English (en)
French (fr)
Inventor
陈泓硕
Original Assignee
北京达佳互联信息技术有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 北京达佳互联信息技术有限公司 filed Critical 北京达佳互联信息技术有限公司
Publication of WO2021143828A1 publication Critical patent/WO2021143828A1/zh
Priority to US17/862,594 priority Critical patent/US20220343056A1/en

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/103—Formatting, i.e. changing of presentation of documents
    • G06F40/106—Display of layout of documents; Previewing
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/50—Information retrieval; Database structures therefor; File system structures therefor of still image data
    • G06F16/51—Indexing; Data structures therefor; Storage structures
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/955—Retrieval from the web using information identifiers, e.g. uniform resource locators [URL]
    • G06F16/9566—URL specific, e.g. using aliases, detecting broken or misspelled links
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/957—Browsing optimisation, e.g. caching or content distillation
    • G06F16/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
    • Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
    • Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
    • Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
    • Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management

Definitions

  • the present disclosure relates to the technical field of picture processing, and in particular to a picture loading method, device, electronic equipment and storage medium.
  • WebP is a picture file format that provides both lossy compression and lossless compression (reversible compression). For two pictures in WebP format and JPG format of the same size, the picture in WebP format is clearer than the picture in JPG format.
  • the present disclosure provides a picture loading method, device, electronic equipment, and storage medium.
  • the technical solutions of the present disclosure are as follows:
  • an image loading method including:
  • the target browser When it is determined that the target browser does not support the picture format, acquiring a picture coding format of a preset type of the target picture, wherein the target browser supports the picture coding format of the preset type;
  • the picture format of the target picture is webp format
  • the picture encoding format of the preset type is base64.
  • the method before the obtaining the picture coding format of the preset type of the target picture, the method further includes:
  • the obtaining the preset type of coding format of the target picture includes:
  • the method further includes:
  • a picture loading device including:
  • the picture format obtaining module is configured to execute in response to detecting that the target browser needs to load the target picture, and obtain the picture format of the target picture;
  • the picture encoding format acquisition module is configured to execute in response to determining that the target browser does not support the picture format, acquiring a preset type of picture encoding format of the target picture, wherein the target browser supports the preview Set the type of picture encoding format;
  • the uniform resource locator replacement module is configured to perform the replacement of the uniform resource locator url of the target picture with the picture encoding format
  • the picture loading module is configured to load the target picture through the target browser and display the target picture.
  • the picture format of the target picture is webp format
  • the picture encoding format of the preset type is base64.
  • the device further includes:
  • the picture preloading module is configured to execute preloading the target picture into the target browser cache by lazy loading before the picture coding format module obtains the picture coding format of the preset type of the target picture ;
  • the thread start module is configured to execute and start the target asynchronous thread in the target browser
  • the picture conversion module is configured to execute calling preset webpJS through the target asynchronous thread, and convert the target picture in the target browser cache to base64;
  • the base64 storage module is configured to store the base64 in the cache of the target browser.
  • the picture encoding format obtaining module is configured to execute:
  • it further includes:
  • the deleting module is configured to execute after loading the target picture through the target browser and displaying the target picture, deleting the target picture and the base64 in the cache of the target browser.
  • an electronic device including:
  • a memory for storing executable instructions of the processor
  • the processor is configured to execute the instruction to implement the image loading method described in the first aspect.
  • a storage medium is provided.
  • the electronic device can execute the image loading method described in the first aspect .
  • the technical solution provided by the embodiment of the present disclosure obtains the picture format of the target picture when it is detected that the target browser needs to load the target picture; when it is determined that the target browser does not support the picture format, the picture encoding format of the preset type of the target picture is obtained , Where the target browser supports a preset type of picture encoding format; replaces the uniform resource locator url of the target picture with the picture encoding format; loads the target picture through the target browser, and displays the target picture.
  • the url of the target picture can be replaced with the picture encoding format of the preset type of the target picture, because the target browser supports The preset type of picture encoding format, therefore, the target picture can be loaded through the target browser, and the target picture can be displayed.
  • the browser that does not originally support the webp format picture can be compatible with the webp format picture, that is, it can be successfully loaded The target picture, and display the picture in webp format normally.
  • Fig. 1 is a flow chart showing a method for loading a picture according to an exemplary embodiment
  • Fig. 2 is a flowchart showing another image loading method according to an exemplary embodiment
  • Fig. 3 is a block diagram showing a picture loading device according to an exemplary embodiment
  • Fig. 4 is a block diagram showing an electronic device according to an exemplary embodiment
  • Fig. 5 is a block diagram showing a picture loading device according to an exemplary embodiment
  • Fig. 6 is a block diagram showing another picture loading device according to an exemplary embodiment.
  • WebP is a picture file format that provides both lossy compression and lossless compression (reversible compression). For two pictures in WebP format and JPG format of the same size, the picture in WebP format is clearer than the picture in JPG format.
  • the embodiments of the present disclosure provide a picture loading method, device, electronic equipment, and storage medium.
  • the execution body of the image loading method provided by the embodiments of the present disclosure is an image loading device, and the image loading device runs in an electronic device, and the electronic device may be a terminal or a server. There are no specific restrictions on electronic equipment.
  • Fig. 1 is a flow chart showing a method for loading a picture according to an exemplary embodiment. As shown in Figure 1, the method may include the following steps.
  • step S11 in response to detecting that the target browser needs to load the target picture, the picture format of the target picture is acquired.
  • the target browser can be any browser in the electronic device as the execution subject.
  • the target picture can be any picture that needs to be loaded by the target browser, and the target picture can be CSS (Cascading Style Sheets).
  • the user when the user needs to access a webpage through the target browser, the user can send a webpage access instruction to the electronic device as the execution subject.
  • the electronic device as the execution subject can receive the webpage access instruction.
  • the electronic device as the execution subject can detect whether the webpage to be visited includes pictures. When it is detected that the webpage to be visited includes pictures, it is detected that the target browser needs to load the target picture, and the target picture is in the webpage to be visited. Any picture included, at this time, the electronic device as the execution subject can obtain the picture format of the target picture.
  • the picture format of the target picture can be: jpg format, gif format, bmp format, tif format,
  • the picture format of the target picture may be determined according to actual conditions, and the embodiment of the present disclosure does not specifically limit the picture format of the target picture.
  • step S12 in response to determining that the target browser does not support the picture format, a preset type of picture coding format of the target picture is acquired.
  • the target browser supports a preset type of picture encoding format.
  • the electronic device as the execution subject can determine whether the target browser supports the picture format of the target picture.
  • the target browser is the IE browser
  • the IE browser does not support the webp format, it can be determined that the target browser does not support the image format of the target image.
  • the image format of the target image is webp format
  • the target browser is Firefox browser. Since Firefox supports the webp format, at this time, it can be determined that the target browser supports the image format of the target image.
  • the electronic device as the execution subject determines that the target browser does not support the picture format of the target picture, it can obtain the picture encoding format of the preset type of the target picture, and the target browser supports the picture encoding format of the preset type, which is helpful Successfully load the target image in the subsequent steps.
  • the picture format of the target picture is webp format
  • the picture encoding format of the preset type is base64.
  • base64 is a picture encoding format, which is a method of representing binary data based on 64 printable characters.
  • the preset type may be any picture encoding format supported by the target browser, and the embodiment of the present disclosure does not specifically limit the picture encoding format of the preset type.
  • the electronic device as the execution subject can start an asynchronous thread, and use the preset webpJS target picture to convert into a preset type of picture encoding format through the asynchronous thread.
  • the process of converting the target picture into the picture encoding format of the preset type is performed in the target asynchronous thread, the thread will not be blocked, thereby saving the performance of the electronic device as the execution subject.
  • the electronic device as the execution subject can directly obtain the preset type of picture encoding format of the target picture from the browser cache. For the sake of clear description of the solution, it will be described in detail in the embodiment of FIG. 2.
  • step S13 the uniform resource locator url of the target picture is replaced with the picture encoding format.
  • the uniform resource locator url of the target picture may be replaced with the picture encoding format of the preset type.
  • the url of the target picture can be replaced with base64, which is beneficial for the target browser to successfully load the target picture in subsequent steps.
  • step S14 the target image is loaded through the target browser, and the target image is displayed.
  • the target image After replacing the url of the target image with a preset type of image encoding format, since the target browser supports the preset type of image encoding format, the target image can be loaded through the target browser and displayed, so that you can Allows browsers that do not originally support images in webp format to successfully load the target image, so that images in webp format can be displayed normally.
  • the technical solution provided by the embodiment of the present disclosure obtains the picture format of the target picture when it is detected that the target browser needs to load the target picture; when it is determined that the target browser does not support the picture format, the picture encoding format of the preset type of the target picture is obtained , Where the target browser supports a preset type of picture encoding format; replaces the uniform resource locator url of the target picture with the picture encoding format; loads the target picture through the target browser, and displays the target picture.
  • the url of the target picture can be replaced with the picture encoding format of the preset type of the target picture, because the target browser supports The preset type of picture encoding format, therefore, the target picture can be loaded through the target browser, and the target picture can be displayed.
  • the browser that does not originally support the webp format picture can be compatible with the webp format picture, that is, it can be successfully loaded The target picture, and display the picture in webp format normally.
  • Fig. 2 is a flow chart showing a method for loading a picture according to an exemplary embodiment. As shown in Figure 2, the method may include the following steps.
  • step S21 in response to detecting that the target browser needs to load the target picture, the picture format of the target picture is acquired.
  • the target browser can be any browser in the electronic device as the execution subject.
  • the target image can be any image that needs to be loaded by the target browser.
  • the user when the user needs to access a webpage through the target browser, the user can send a webpage access instruction to the electronic device as the execution subject.
  • the electronic device as the execution subject can receive the webpage access instruction.
  • the electronic device as the execution subject can detect whether the webpage to be visited includes pictures. When it is detected that the webpage to be visited includes pictures, it is detected that the target browser needs to load the target picture, and the target picture is in the webpage to be visited. Any picture included, at this time, the electronic device as the execution subject can obtain the picture format of the target picture.
  • the picture format of the target picture can be: jpg format, gif format, bmp format, tif format, webp format, etc. It is understandable that the picture format of the target picture may be determined according to actual conditions, and the embodiment of the present disclosure does not specifically limit the picture format of the target picture.
  • step S22 the target image is preloaded into the cache of the target browser by lazy loading.
  • lazy loading is a unique and powerful data acquisition method. It can automatically acquire more data when the user scrolls the page, and the newly acquired data will not affect the display of the original data, and the maximum To a certain extent, reduce the resource consumption on the server side.
  • the electronic device as the execution subject can preload the target image into the cache of the target browser by lazy loading.
  • step S23 the target asynchronous thread in the target browser is started.
  • the electronic device as the execution subject may start the target asynchronous thread of the target browser after preloading the target picture into the target browser cache, so that in the subsequent steps, the target picture is stored in the target asynchronous thread. Converted to base64.
  • step S24 the preset webpJS library is called through the target asynchronous thread, and the target image in the cache of the target browser is converted to base64.
  • the electronic device as the execution subject After the electronic device as the execution subject starts the target asynchronous thread, it can call the preset webpJS to convert the target image cached in the target browser into base64. In addition, since the process of converting the target image cached in the target browser into base64 is performed in the target asynchronous thread, the thread will not be blocked, thereby saving the performance of the electronic device as the execution subject.
  • step S25 store base64 in the cache of the target browser.
  • the base64 of the target picture can be stored in the cache of the target browser. In this way, in the subsequent steps, when the electronic device as the execution subject determines that the target browser does not support the image format , Can obtain the base64 of the target picture directly from the cache of the target browser, thereby improving the efficiency of obtaining the base64 of the target picture.
  • step S26 in response to determining that the target browser does not support the image format, base64 is obtained from the cache of the target browser.
  • the base64 of the target image is stored in the cache of the target browser, when the electronic device as the execution subject determines that the target browser does not support the image format of the target image, it can directly obtain the base64 from the target browser cache, which improves the acquisition of the target image The efficiency of base64.
  • step S27 the uniform resource locator url of the target picture is replaced with base64.
  • the electronic device as the execution subject After the electronic device as the execution subject obtains the base64 of the target picture, it can replace the uniform resource locator url of the target picture with base64 when loading the target picture. It is helpful for the target browser to successfully load the target image in the subsequent steps.
  • step S28 the target image is loaded through the target browser, and the target image is displayed.
  • the target image After replacing the url of the target image with base64, because the target browser supports base64, the target image can be loaded through the target browser and displayed, so that browsers that do not originally support webp format images can be able to The target image is successfully loaded, so that the webp format image can be displayed normally.
  • the base64 of the target image when it is detected that the target browser does not support the image format of the target image, the base64 of the target image can be directly obtained from the target browser cache, and the url of the target image can be replaced with the target image.
  • the base64 of the picture because the target browser supports base64, the target picture can be loaded through the target browser, and the target picture can be displayed.
  • the browser that does not originally support the webp format picture can be compatible with the webp format picture, that is The target image can be successfully loaded and the webp format image can be displayed normally.
  • the image loading method may further include:
  • the electronic device as the execution subject loads the target picture through the target browser and displays the picture, it indicates that the target browser has successfully loaded the target picture.
  • the target picture cached in the target browser can be And delete the base64 of the target image to save the cache of the target browser.
  • a picture loading device as shown in FIG. 3, including:
  • the picture format obtaining module 310 is configured to execute in response to detecting that the target browser needs to load the target picture, and obtain the picture format of the target picture.
  • the picture encoding format acquisition module 320 is configured to execute in response to determining that the target browser does not support the picture format, acquiring a preset type of picture encoding format of the target picture, wherein the target browser supports the picture format Preset type of picture encoding format.
  • the picture format of the target picture is webp format
  • the picture encoding format of the preset type is base64.
  • the uniform resource locator replacement module 330 is configured to perform the replacement of the uniform resource locator url of the target picture with the picture encoding format.
  • the picture loading module 340 is configured to load the target picture through the target browser and display the target picture.
  • the technical solution provided by the embodiment of the present disclosure obtains the picture format of the target picture when it is detected that the target browser needs to load the target picture; when it is determined that the target browser does not support the picture format, the picture encoding format of the preset type of the target picture is obtained , Where the target browser supports a preset type of picture encoding format; replaces the uniform resource locator url of the target picture with the picture encoding format; loads the target picture through the target browser, and displays the target picture.
  • the url of the target picture can be replaced with the picture encoding format of the preset type of the target picture, because the target browser supports The preset type of picture encoding format, therefore, the target picture can be loaded through the target browser, and the target picture can be displayed.
  • the browser that does not originally support the webp format picture can be compatible with the webp format picture, that is, it can be successfully loaded The target picture, and display the picture in webp format normally.
  • the device further includes:
  • the picture preloading module is configured to perform lazy loading to preload the target picture into the target browser cache
  • the thread start module is configured to execute and start the target asynchronous thread in the target browser
  • the picture conversion module is configured to execute calling preset webpJS through the target asynchronous thread, and convert the target picture in the target browser cache to base64;
  • the base64 storage module is configured to execute storing the base64 in the cache of the target browser.
  • the base64 of the target image when it is detected that the target browser does not support the image format of the target image, the base64 of the target image can be directly obtained from the target browser cache, and the url of the target image can be replaced with the target image.
  • the base64 of the picture because the target browser supports base64, the target picture can be loaded through the target browser, and the target picture can be displayed.
  • the browser that does not originally support the webp format picture can be compatible with the webp format picture, that is The target image can be successfully loaded and the webp format image can be displayed normally.
  • the picture encoding format obtaining module is configured to execute:
  • the device further includes:
  • the deleting module is configured to delete the target image in the cache of the target browser and the base64.
  • Fig. 4 is a block diagram showing an electronic device according to an exemplary embodiment. Referring to Figure 4, the electronic device includes:
  • a memory 420 for storing executable instructions of the processor
  • the processor is configured to execute the instructions to implement the image loading method provided in the present disclosure.
  • the technical solution provided by the embodiment of the present disclosure obtains the picture format of the target picture in response to detecting that the target browser needs to load the target picture; when it is determined that the target browser does not support the picture format, the picture encoding format of the preset type of the target picture is obtained , Where the target browser supports a preset type of picture encoding format; replaces the uniform resource locator url of the target picture with the picture encoding format; loads the target picture through the target browser, and displays the target picture.
  • the url of the target picture can be replaced with the picture encoding format of the preset type of the target picture, because the target browser supports The preset type of picture encoding format, therefore, the target picture can be loaded through the target browser, and the target picture can be displayed.
  • the browser that does not originally support the webp format picture can be compatible with the webp format picture, that is, it can be successfully loaded The target picture, and display the picture in webp format normally.
  • Fig. 5 is a block diagram showing a picture loading device 500 according to an exemplary embodiment.
  • the apparatus 500 may be a mobile phone, a computer, a digital broadcasting electronic device, a messaging device, a game console, a tablet device, a medical device, a fitness device, a personal digital assistant, etc.
  • the device 500 may include one or more of the following components: a processing component 502, a memory 504, a power component 506, a multimedia component 508, an audio component 510, an input/output (I/O) interface 512, a sensor component 514, And communication component 516.
  • the processing component 502 generally controls the overall operations of the device 500, such as operations associated with display, telephone calls, data communications, camera operations, and recording operations.
  • the processing component 502 may include one or more processors 520 to execute instructions to complete all or part of the steps of the above-mentioned image loading method.
  • the processing component 502 may include one or more modules to facilitate the interaction between the processing component 502 and other components.
  • the processing component 502 may include a multimedia module to facilitate the interaction between the multimedia component 508 and the processing component 502.
  • the memory 504 is configured to store various types of data to support operations in the device 500. Examples of these data include instructions for any application or method operating on the device 500, contact data, phone book data, messages, pictures, videos, etc.
  • the memory 504 can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable and Programmable Read Only Memory (EPROM), Programmable Read Only Memory (PROM), Read Only Memory (ROM), Magnetic Memory, Flash Memory, Magnetic Disk or Optical Disk.
  • SRAM static random access memory
  • EEPROM electrically erasable programmable read-only memory
  • EPROM erasable and Programmable Read Only Memory
  • PROM Programmable Read Only Memory
  • ROM Read Only Memory
  • Magnetic Memory Flash Memory
  • Magnetic Disk Magnetic Disk or Optical Disk.
  • the power supply component 506 provides power to various components of the device 500.
  • the power supply component 506 may include a power management system, one or more power supplies, and other components associated with the generation, management, and distribution of power for the device 500.
  • the multimedia component 508 includes a screen that provides an output interface between the device 500 and the user.
  • the screen may include a liquid crystal display (LCD) and a touch panel (TP). If the screen includes a touch panel, the screen can be implemented as a touch screen to receive input signals from the user.
  • the touch panel includes one or more touch sensors to sense touch, sliding, and gestures on the touch panel. The touch sensor may not only sense the boundary of a touch or slide action, but also detect the duration and pressure related to the touch or slide operation.
  • the multimedia component 508 includes a front camera and/or a rear camera. When the device 500 is in an operation mode, such as a shooting mode or a video mode, the front camera and/or the rear camera can receive external multimedia data. Each front camera and rear camera can be a fixed optical lens system or have focal length and optical zoom capabilities.
  • the audio component 510 is configured to output and/or input audio signals.
  • the audio component 510 includes a microphone (MIC), and when the device 500 is in an operation mode, such as a call mode, a recording mode, and a voice recognition mode, the microphone is configured to receive an external audio signal.
  • the received audio signal can be further stored in the memory 404 or sent via the communication component 516.
  • the audio component 510 further includes a speaker for outputting audio signals.
  • the I/O interface 512 provides an interface between the processing component 502 and a peripheral interface module.
  • the peripheral interface module may be a keyboard, a click wheel, a button, and the like. These buttons may include, but are not limited to: home button, volume button, start button, and lock button.
  • the sensor component 514 includes one or more sensors for providing the device 500 with various aspects of status assessment.
  • the sensor component 514 can detect the on/off status of the device 500 and the relative positioning of components.
  • the component is the display and the keypad of the device 500.
  • the sensor component 514 can also detect the position change of the device 500 or a component of the device 500. , The presence or absence of contact between the user and the device 500, the orientation or acceleration/deceleration of the device 500, and the temperature change of the device 500.
  • the sensor component 514 may include a proximity sensor configured to detect the presence of nearby objects when there is no physical contact.
  • the sensor component 514 may also include a light sensor, such as a CMOS or CCD image sensor, for use in imaging applications.
  • the sensor component 514 may also include an acceleration sensor, a gyroscope sensor, a magnetic sensor, a pressure sensor, or a temperature sensor.
  • the communication component 516 is configured to facilitate wired or wireless communication between the apparatus 500 and other devices.
  • the device 500 can access a wireless network based on a communication standard, such as WiFi, an operator network (such as 2G, 3G, 4G, or 5G), or a combination thereof.
  • the communication component 416 receives a broadcast signal or broadcast related information from an external broadcast management system via a broadcast channel.
  • the communication component 516 further includes a near field communication (NFC) module to facilitate short-range communication.
  • the NFC module can be implemented based on radio frequency identification (RFID) technology, infrared data association (IrDA) technology, ultra-wideband (UWB) technology, Bluetooth (BT) technology and other technologies.
  • RFID radio frequency identification
  • IrDA infrared data association
  • UWB ultra-wideband
  • Bluetooth Bluetooth
  • the apparatus 500 may be implemented by one or more application specific integrated circuits (ASIC), digital signal processors (DSP), digital signal processing equipment (DSPD), programmable logic devices (PLD), field programmable A gate array (FPGA), controller, microcontroller, microprocessor, or other electronic components are implemented to implement the above methods.
  • ASIC application specific integrated circuits
  • DSP digital signal processors
  • DSPD digital signal processing equipment
  • PLD programmable logic devices
  • FPGA field programmable A gate array
  • controller microcontroller, microprocessor, or other electronic components are implemented to implement the above methods.
  • a non-transitory computer-readable storage medium including instructions, such as the memory 504 including instructions, and the foregoing instructions may be executed by the processor 520 of the device 500 to complete the foregoing method.
  • the storage medium may be a non-transitory computer-readable storage medium, for example, the non-transitory non-transitory computer-readable storage medium may be a ROM, a random access memory (RAM), CD-ROMs, magnetic tapes, floppy disks and optical data storage devices, etc.
  • the technical solution provided by the embodiment of the present disclosure obtains the picture format of the target picture when it is detected that the target browser needs to load the target picture; when it is determined that the target browser does not support the picture format, the picture encoding format of the preset type of the target picture is obtained , Where the target browser supports a preset type of picture encoding format; replaces the uniform resource locator url of the target picture with the picture encoding format; loads the target picture through the target browser, and displays the target picture.
  • the url of the target picture can be replaced with the picture encoding format of the preset type of the target picture, because the target browser supports The preset type of picture encoding format, therefore, the target picture can be loaded through the target browser, and the target picture can be displayed.
  • the browser that does not originally support the webp format picture can be compatible with the webp format picture, that is, it can be successfully loaded The target picture, and display the picture in webp format normally.
  • Fig. 6 is a block diagram showing a device 600 for loading a picture according to an exemplary embodiment.
  • the device 600 may be provided as a server.
  • the apparatus 600 includes a processing component 622, which further includes one or more processors, and a memory resource represented by a memory 632, for storing instructions that can be executed by the processing component 622, such as application programs.
  • the application program stored in the memory 632 may include one or more modules each corresponding to a set of instructions.
  • the processing component 622 is configured to execute instructions to execute the above-mentioned image loading method.
  • the device 600 may also include a power component 626 configured to perform power management of the device 600, a wired or wireless network interface 650 configured to connect the device 600 to a network, and an input output (I/O) interface 658.
  • the device 600 can operate based on an operating system stored in the memory 632, such as Windows ServerTM, Mac OS XTM, UnixTM, LinuxTM, FreeBSDTM or the like.
  • the technical solution provided by the embodiment of the present disclosure obtains the picture format of the target picture when it is detected that the target browser needs to load the target picture; when it is determined that the target browser does not support the picture format, the picture encoding format of the preset type of the target picture is obtained , Where the target browser supports a preset type of picture encoding format; replaces the uniform resource locator url of the target picture with the picture encoding format; loads the target picture through the target browser, and displays the target picture.
  • the url of the target picture can be replaced with the picture encoding format of the preset type of the target picture, because the target browser supports The preset type of picture encoding format, therefore, the target picture can be loaded through the target browser, and the target picture can be displayed.
  • the browser that does not originally support the webp format picture can be compatible with the webp format picture, that is, it can be successfully loaded The target picture, and display the picture in webp format normally.
  • the embodiments of the present disclosure also provide a storage medium.
  • the instructions in the storage medium are executed by the processor of the electronic device, the electronic device can execute the present disclosure.
  • the technical solution provided by the embodiment of the present disclosure obtains the picture format of the target picture when it is detected that the target browser needs to load the target picture; when it is determined that the target browser does not support the picture format, the picture encoding format of the preset type of the target picture is obtained , Where the target browser supports a preset type of picture encoding format; replaces the uniform resource locator url of the target picture with the picture encoding format; loads the target picture through the target browser, and displays the target picture.
  • the url of the target picture can be replaced with the picture encoding format of the preset type of the target picture, because the target browser supports The preset type of picture encoding format, therefore, the target picture can be loaded through the target browser, and the target picture can be displayed.
  • the browser that does not originally support the webp format picture can be compatible with the webp format picture, that is, it can be successfully loaded The target picture, and display the picture in webp format normally.
  • a computer program product containing instructions, which when run on a computer, enables the computer to implement the image loading method described in the first aspect.
  • the technical solution provided by the embodiment of the present disclosure obtains the picture format of the target picture when it is detected that the target browser needs to load the target picture; when it is determined that the target browser does not support the picture format, the picture encoding format of the preset type of the target picture is obtained , Where the target browser supports a preset type of picture encoding format; replaces the uniform resource locator url of the target picture with the picture encoding format; loads the target picture through the target browser, and displays the target picture.
  • the url of the target picture can be replaced with the picture encoding format of the preset type of the target picture, because the target browser supports The preset type of picture encoding format, therefore, the target picture can be loaded through the target browser, and the target picture can be displayed.
  • the browser that does not originally support the webp format picture can be compatible with the webp format picture, that is, it can be successfully loaded The target picture, and display the picture in webp format normally.

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Software Systems (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

一种图片加载方法、装置、电子设备及存储介质，该方法包括：响应于检测到目标浏览器需要加载目标图片，获取目标图片的图片格式（S11）；响应于判定目标浏览器不支持图片格式，获取目标图片的预设类型的图片编码格式（S12），其中，目标浏览器支持预设类型的图片编码格式；将目标图片的统一资源定位符url替换为图片编码格式（S13）；通过目标浏览器加载目标图片，并展示目标图片（S14）。可见，该方法在检测到目标浏览器不支持目标图片的图片格式时，可以将目标图片的url替换为目标图片的预设类型的图片编码格式，由于目标浏览器支持预设类型的图片编码格式，因此，可以通过目标浏览器加载目标图片，并展示目标图片。

Description

图片加载方法及电子设备
相关申请的交叉引用
本公开要求于2020年01月15日提交的申请号为202010043718.4、名称为“一种图片加载方法、装置、电子设备及存储介质”的中国专利申请的优先权，该中国专利申请的全部内容通过引用全部并入本文。
技术领域
本公开涉及图片处理技术领域，特别是涉及一种图片加载方法、装置、电子设备及存储介质。
背景技术
WebP是一种同时提供了有损压缩与无损压缩(可逆压缩)的图片文件格式。对于两张相同大小的WebP格式的图片和JPG格式的图片，WebP格式的图片比JPG格式的图片更加清晰。
发明内容
本公开提供一种图片加载方法、装置、电子设备及存储介质，本公开的技术方案如下：
根据本公开实施例的第一方面，提供了一种图片加载方法，包括：
在检测到目标浏览器需要加载目标图片时，获取所述目标图片的图片格式；
在判定所述目标浏览器不支持所述图片格式时，获取所述目标图片的预设类型的图片编码格式，其中，所述目标浏览器支持所述预设类型的图片编码格式；
将所述目标图片的统一资源定位符url替换为所述图片编码格式；
通过所述目标浏览器加载所述目标图片，并展示所述目标图片。
在一些实施例中，所述目标图片的图片格式为webp格式，所述预设类型的图片编码格式为base64。
在一些实施例中，在所述获取所述目标图片的预设类型的图片编码格式之前，所述方法还包括：
通过懒加载方式将所述目标图片预先加载到所述目标浏览器缓存中；
启动所述目标浏览器中的目标异步线程；
通过所述目标异步线程调用预设webpJS，将所述目标浏览器缓存中的所述目标图片转换为base64；
将所述base64存储于所述目标浏览器缓存中。
在一些实施例中，所述获取所述目标图片的预设类型的编码格式，包括：
从所述目标浏览器缓存中获取所述base64。
在一些实施例中，在通过所述目标浏览器加载所述目标图片，并展示所述目标图片之后，还包括：
删除目标浏览器缓存中的所述目标图片，以及所述base64。根据本公开实施例的第二方面，提供了一种图片加载装置，包括：
图片格式获取模块，被配置为执行响应于检测到目标浏览器需要加载目标图片，获取所述目标图片的图片格式；
图片编码格式获取模块，被配置为执行响应于判定所述目标浏览器不支持所述图片格式，获取所述目标图片的预设类型的图片编码格式，其中，所述目标浏览器支持所述预设类型的图片编码格式；
统一资源定位符替换模块，被配置为执行将所述目标图片的统一资源定位符url替换为所述图片编码格式；
图片加载模块，被配置为执行通过所述目标浏览器加载所述目标图片，并展示所述目标图片。
在一些实施例中，所述目标图片的图片格式为webp格式，所述预设类型的图片编码格式为base64。
在一些实施例中，所述装置还包括：
图片预加载模块，被配置为执行在所述图片编码格式模块获取所述目标图片的预设类型的图片编码格式之前，通过懒加载方式将所述目标图片预先加载到所述目标浏览器缓存中；
线程启动模块，被配置为执行启动所述目标浏览器中的目标异步线程；
图片转化模块，被配置为执行通过所述目标异步线程调用预设webpJS，将所述目标浏览器缓存中的所述目标图片转换为base64；
base64存储模块，被配置为执行将所述base64存储于所述目标浏览器缓存中。
在一些实施例中，所述图片编码格式获取模块，被配置为执行：
从所述目标浏览器缓存中获取所述base64。
在一些实施例中，还包括：
删除模块，被配置为执行在通过所述目标浏览器加载所述目标图片，并展示所述目标图片之后，删除目标浏览器缓存中的所述目标图片，以及所述base64。
根据本公开实施例的第三方面，提供了一种电子设备，包括：
处理器；
用于存储所述处理器可执行指令的存储器；
其中，所述处理器被配置为执行所述指令，以实现第一方面所述的图片加载方法。
根据本公开实施例的第四方面，提供了一种存储介质，当所述存储介质中的指令由电子设备的处理器执行时，使得所述电子设备能够执行第一方面所述的图片加载方法。
本公开实施例提供的技术方案，在检测到目标浏览器需要加载目标图片时，获取目标图片的图片格式；在判定目标浏览器不支持图片格式时，获取目标图片的预设类型的图片编码格式，其中，目标浏览器支持预设类型的图片编码格式；将目标图片的统一资源定位符url替换为图片编码格式；通过目标浏览器加载目标图片，并展示目标图片。
可见，通过本公开实施例提供的技术方案，在检测到目标浏览器不支持目标图片的图片格式，可以将目标图片的url替换为目标图片的预设类型的图片编码格式，由于目标浏览器支持预设类型的图片编码格式，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片，即能够成功加载目标图片，并正常显示webp格式的图片。
附图说明
图1是根据一示例性实施例示出的一种图片加载方法的流程图；
图2是根据一示例性实施例示出的另一种图片加载方法的流程图；
图3是根据一示例性实施例示出的一种图片加载装置的框图；
图4是根据一示例性实施例示出的一种电子设备的框图；
图5是根据一示例性实施例示出的一种图片加载装置的框图；
图6是根据一示例性实施例示出的另一种图片加载装置的框图。
具体实施方式
为了使本领域普通人员更好地理解本公开的技术方案，下面将结合附图，对本公开实施例中的技术方案进行清楚、完整地描述。
WebP是一种同时提供了有损压缩与无损压缩(可逆压缩)的图片文件格式。对于两张相同大小的WebP格式的图片和JPG格式的图片，WebP格式的图片比JPG格式的图片更加清晰。
但是，相关技术中，有些浏览器如IE浏览器不支持WebP格式的图片，因此，不支持WebP格式的图片的浏览器无法成功加载WebP格式的图片。
为了解决相关技术中存在的因浏览器不支持WebP格式的图片，而导致浏览器无法成功加载WebP格式的图片的问题。本公开实施例提供了一种图片加载方法、装置、电子设备及存储介质。
首先对本公开实施例提供的一种图片加载方法进行详细介绍。
需要说明的是，本公开实施例提供的一种图片加载方法的执行主体为一种图片加 载装置，该图片加载装置运行于电子设备中，该电子设备可以是终端或者服务器，本公开实施例对电子设备不做具体限定。
图1是根据一示例性实施例示出的一种图片加载方法的流程图。如图1所示，该方法可以包括以下步骤。
在步骤S11中，响应于检测到目标浏览器需要加载目标图片，获取目标图片的图片格式。
其中，目标浏览器可以为作为执行主体的电子设备中的任一浏览器。目标图片可以为目标浏览器需要加载的任一图片，且目标图片可以为CSS(Cascading Style Sheets，层叠样式表)。
在一些实施例中，当用户需要通过目标浏览器访问网页时，用户可以向作为执行主体的电子设备发送网页访问指令，此时，作为执行主体的电子设备可以接收到网页访问指令。并且，作为执行主体的电子设备可以检测要访问的网页是否包括图片，在检测到要访问的网页中包括图片时，即检测到目标浏览器需要加载目标图片，该目标图片为要访问的网页中包括的任一图片，此时，作为执行主体的电子设备可以获取目标图片的图片格式。
其中，目标图片的图片格式可以为：jpg格式，gif格式，bmp格式，tif格式，
webp格式等。可以理解的是，目标图片的图片格式可以根据实际情况确定，本公开实施例对目标图片的图片格式不做具体限定。
在步骤S12中，响应于判定目标浏览器不支持图片格式，获取目标图片的预设类型的图片编码格式。
其中，目标浏览器支持预设类型的图片编码格式。
为了防止后续步骤中因目标浏览器不支持目标图片的图片格式，而导致目标浏览器无法成功加载目标图片。作为执行主体的电子设备获取到目标图片的图片格式之后，可以判断目标浏览器是否支持目标图片的图片格式。
例如，假设目标图片的图片格式为webp格式，目标浏览器为IE浏览器，由于IE浏览器不支持webp格式，此时，可以判定目标浏览器不支持目标图片的图片格式。
再例如，假设目标图片的图片格式为webp格式，目标浏览器为火狐浏览器，由于火狐浏览器支持webp格式，此时，可以判定目标浏览器支持目标图片的图片格式。
如果作为执行主体的电子设备判定目标浏览器不支持目标图片的图片格式，可以获取目标图片的预设类型的图片编码格式，并且，目标浏览器支持预设类型的图片编 码格式，这样，有助于后续步骤中成功加载目标图片。
在一种实施方式中，目标图片的图片格式为webp格式，预设类型的图片编码格式为base64。其中，base64是一种图片编码格式，是一种基于64个可打印字符来表示二进制数据的方法。当然，预设类型可以是目标浏览器支持的任意一种图片编码格式，本公开实施例对预设类型的图片编码格式不做具体限定。
并且，获取目标图片的预设类型的图片编码格式的方式可以有多种。
在一种实施方式中，作为执行主体的电子设备可以启动异步线程，通过异步线程用预设webpJS目标图片转化为预设类型的图片编码格式。并且，由于将目标图片转化为预设类型的图片编码格式的过程是在目标异步线程中进行的，因此，不会造成线程阻塞，从而节省了作为执行主体的电子设备的性能。
在另一种实施方式中，作为执行主体的电子设备可以直接从浏览器缓存中获取目标图片的预设类型的图片编码格式，为了方案描述清楚，将在图2实施例中进行详细阐述。
在步骤S13中，将目标图片的统一资源定位符url替换为图片编码格式。
作为执行主体的电子设备获取目标图片的预设类型的图片编码格式后，在加载目标图片时，可以将目标图片的统一资源定位符url替换为预设类型的图片编码格式。
在一些实施例中，当预设类型的图片编码格式为base64时，可以将目标图片的url替换为base64，这样，有利于后续步骤中，目标浏览器能够成功加载目标图片。
在步骤S14中，通过目标浏览器加载目标图片，并展示目标图片。
在将目标图片的url替换为预设类型的图片编码格式后，由于目标浏览器支持预设类型的图片编码格式，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够成功加载目标图片，从而能够正常显示webp格式的图片。
本公开实施例提供的技术方案，在检测到目标浏览器需要加载目标图片时，获取目标图片的图片格式；在判定目标浏览器不支持图片格式时，获取目标图片的预设类型的图片编码格式，其中，目标浏览器支持预设类型的图片编码格式；将目标图片的统一资源定位符url替换为图片编码格式；通过目标浏览器加载目标图片，并展示目标图片。
可见，通过本公开实施例提供的技术方案，在检测到目标浏览器不支持目标图片的图片格式，可以将目标图片的url替换为目标图片的预设类型的图片编码格式，由 于目标浏览器支持预设类型的图片编码格式，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片，即能够成功加载目标图片，并正常显示webp格式的图片。
图2是根据一示例性实施例示出的一种图片加载方法的流程图。如图2所示，该方法可以包括以下步骤。
在步骤S21中，响应于检测到目标浏览器需要加载目标图片，获取目标图片的图片格式。
其中，目标浏览器可以为作为执行主体的电子设备中的任一浏览器。目标图片可以为目标浏览器需要加载的任一图片。
在一些实施例中，当用户需要通过目标浏览器访问网页时，用户可以向作为执行主体的电子设备发送网页访问指令，此时，作为执行主体的电子设备可以接收到网页访问指令。并且，作为执行主体的电子设备可以检测要访问的网页是否包括图片，在检测到要访问的网页中包括图片时，即检测到目标浏览器需要加载目标图片，该目标图片为要访问的网页中包括的任一图片，此时，作为执行主体的电子设备可以获取目标图片的图片格式。
其中，目标图片的图片格式可以为：jpg格式，gif格式，bmp格式，tif格式，webp格式等。可以理解的是，目标图片的图片格式可以根据实际情况确定，本公开实施例对目标图片的图片格式不做具体限定。
在步骤S22中，通过懒加载方式将目标图片预先加载到目标浏览器缓存中。
可以理解的是，懒加载是一种独特而又强大的数据获取方法,它能够在用户滚动页面的时候自动获取更多的数据,而新得到的数据不会影响原有数据的显示,同时最大程度上减少服务器端的资源耗用。
因此，作为执行主体的电子设备可以通过懒加载的方式将目标图片预先加载的目标浏览器的缓存中。
在步骤S23中，启动目标浏览器中的目标异步线程。
在一些实施例中，作为执行主体的电子设备在将目标图片预先加载到目标浏览器缓存中之后，可以启动目标浏览器的目标异步线程，以在后续步骤中，在目标异步线程中将目标图片转化为base64。
在步骤S24中，通过目标异步线程调用预设webpJS库，将目标浏览器缓存中的 目标图片转换为base64。
作为执行主体的电子设备启动目标异步线程之后，可以调用预设webpJS将目标浏览器中缓存的目标图片转化为base64。并且，由于将目标浏览器中缓存的目标图片转化为base64的过程是在目标异步线程中进行的，因此，不会造成线程阻塞，从而节省了作为执行主体的电子设备的性能。
在步骤S25中，将base64存储于目标浏览器缓存中。
作为执行主体的电子设备将目标图片转化为base64之后，可以将目标图片的base64存储于目标浏览器缓存中，这样，后续步骤中，在作为执行主体的电子设备判定目标浏览器不支持图片格式时，可以从目标浏览器缓存中获取直接获取目标图片的base64，从而提高了获取目标图片的base64的效率。
在步骤S26中，响应于判定目标浏览器不支持图片格式，从目标浏览器缓存中获取base64。
由于目标浏览器缓存中存储有目标图片的base64，因此，作为执行主体的电子设备判定目标浏览器不支持目标图片的图片格式时，可以直接从目标浏览器缓存中获取base64，提高了获取目标图片的base64的效率。
在步骤S27中，将目标图片的统一资源定位符url替换为base64。
作为执行主体的电子设备获取目标图片的base64后，在加载目标图片时，可以将目标图片的统一资源定位符url替换为base64。有利于后续步骤中，目标浏览器能够成功加载目标图片。
在步骤S28中，通过目标浏览器加载目标图片，并展示目标图片。
在将目标图片的url替换为base64后，由于目标浏览器支持base64，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够成功加载目标图片，从而能够正常显示webp格式的图片。
可见，通过本公开实施例提供的技术方案，在检测到目标浏览器不支持目标图片的图片格式，可以直接从目标浏览器缓存中获取目标图片的base64，并可以将目标图片的url替换为目标图片的base64，由于目标浏览器支持base64，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片，即能够成功加载目标图片，并正常显示webp格式的图片。
在图2所示实施例的基础上，在一种实施方式中，在通过目标浏览器加载目标图片，并展示目标图片之后，图片加载方法还可以包括：
删除目标浏览器缓存中的目标图片，以及目标图片的base64。
在该实施方式中，作为执行主体的电子设备通过目标浏览器加载目标图片，并展示图片之后，即表明目标浏览器已经成功加载了目标图片，此时，可以将目标浏览器中缓存的目标图片以及目标图片的base64删除，以达到节省目标浏览器缓存的效果。
可见，通过本公开实施例提供的技术方案，在通过目标浏览器加载目标图片，并展示目标图片之后，删除目标浏览器缓存中的目标图片，以及目标图片的base64，从而达到节省目标浏览器缓存的效果。
根据本公开一些实施例，提供了一种图片加载装置，如图3所示，包括：
图片格式获取模块310，被配置为执行响应于检测到目标浏览器需要加载目标图片，获取所述目标图片的图片格式。
图片编码格式获取模块320，被配置为执行响应于判定所述目标浏览器不支持所述图片格式，获取所述目标图片的预设类型的图片编码格式，其中，所述目标浏览器支持所述预设类型的图片编码格式。
在一些实施例中，所述目标图片的图片格式为webp格式，所述预设类型的图片编码格式为base64。
统一资源定位符替换模块330，被配置为执行将所述目标图片的统一资源定位符url替换为所述图片编码格式。
图片加载模块340，被配置为执行通过所述目标浏览器加载所述目标图片，并展示所述目标图片。
本公开实施例提供的技术方案，在检测到目标浏览器需要加载目标图片时，获取目标图片的图片格式；在判定目标浏览器不支持图片格式时，获取目标图片的预设类型的图片编码格式，其中，目标浏览器支持预设类型的图片编码格式；将目标图片的统一资源定位符url替换为图片编码格式；通过目标浏览器加载目标图片，并展示目标图片。
可见，通过本公开实施例提供的技术方案，在检测到目标浏览器不支持目标图片的图片格式，可以将目标图片的url替换为目标图片的预设类型的图片编码格式，由于目标浏览器支持预设类型的图片编码格式，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够兼 容webp格式的图片，即能够成功加载目标图片，并正常显示webp格式的图片。
在一些实施例中，所述装置还包括：
图片预加载模块，被配置为执行通过懒加载方式将所述目标图片预先加载到所述目标浏览器缓存中；
线程启动模块，被配置为执行启动所述目标浏览器中的目标异步线程；
图片转化模块，被配置为执行通过所述目标异步线程调用预设webpJS，将所述目标浏览器缓存中的所述目标图片转换为base64；
base64存储模块，被配置为执行将所述base64存储于所述目标浏览器缓存中。
可见，通过本公开实施例提供的技术方案，在检测到目标浏览器不支持目标图片的图片格式，可以直接从目标浏览器缓存中获取目标图片的base64，并可以将目标图片的url替换为目标图片的base64，由于目标浏览器支持base64，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片，即能够成功加载目标图片，并正常显示webp格式的图片。
在一些实施例中，所述图片编码格式获取模块，被配置为执行：
从所述目标浏览器缓存中获取所述base64。
在一些实施例中，所述装置还包括：
删除模块，被配置为执行删除目标浏览器缓存中的所述目标图片，以及所述base64。
可见，通过本公开实施例提供的技术方案，在通过目标浏览器加载目标图片，并展示目标图片之后，删除目标浏览器缓存中的目标图片，以及目标图片的base64，从而达到节省目标浏览器缓存的效果。
根据本公开一些实施例，提供了一种电子设备。图4是根据一示例性实施例示出的一种电子设备框图。参照图4，该电子设备包括：
处理器410；
用于存储所述处理器可执行指令的存储器420；
其中，所述处理器被配置为执行所述指令，以实现本公开所提供的图片加载方法。
本公开实施例提供的技术方案，响应于检测到目标浏览器需要加载目标图片，获取目标图片的图片格式；在判定目标浏览器不支持图片格式时，获取目标图片的预设 类型的图片编码格式，其中，目标浏览器支持预设类型的图片编码格式；将目标图片的统一资源定位符url替换为图片编码格式；通过目标浏览器加载目标图片，并展示目标图片。
可见，通过本公开实施例提供的技术方案，在检测到目标浏览器不支持目标图片的图片格式，可以将目标图片的url替换为目标图片的预设类型的图片编码格式，由于目标浏览器支持预设类型的图片编码格式，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片，即能够成功加载目标图片，并正常显示webp格式的图片。
图5是根据一示例性实施例示出的一种图片加载装置500的框图。例如，装置500可以是移动电话，计算机，数字广播电子设备，消息收发设备，游戏控制台，平板设备，医疗设备，健身设备，个人数字助理等。
参照图5，装置500可以包括以下一个或多个组件：处理组件502，存储器504，电力组件506，多媒体组件508，音频组件510，输入/输出(I/O)的接口512，传感器组件514，以及通信组件516。
处理组件502通常控制装置500的整体操作，诸如与显示，电话呼叫，数据通信，相机操作和记录操作相关联的操作。处理组件502可以包括一个或多个处理器520来执行指令，以完成上述的图片加载方法的全部或部分步骤。此外，处理组件502可以包括一个或多个模块，便于处理组件502和其他组件之间的交互。例如，处理组件502可以包括多媒体模块，以方便多媒体组件508和处理组件502之间的交互。
存储器504被配置为存储各种类型的数据以支持在设备500的操作。这些数据的示例包括用于在装置500上操作的任何应用程序或方法的指令，联系人数据，电话簿数据，消息，图片，视频等。存储器504可以由任何类型的易失性或非易失性存储设备或者它们的组合实现，如静态随机存取存储器(SRAM)，电可擦除可编程只读存储器(EEPROM)，可擦除可编程只读存储器(EPROM)，可编程只读存储器(PROM)，只读存储器(ROM)，磁存储器，快闪存储器，磁盘或光盘。
电源组件506为装置500的各种组件提供电力。电源组件506可以包括电源管理系统，一个或多个电源，及其他与为装置500生成、管理和分配电力相关联的组件。
多媒体组件508包括在所述装置500和用户之间的提供一个输出接口的屏幕。在一些实施例中，屏幕可以包括液晶显示器(LCD)和触摸面板(TP)。如果屏幕包括 触摸面板，屏幕可以被实现为触摸屏，以接收来自用户的输入信号。触摸面板包括一个或多个触摸传感器以感测触摸、滑动和触摸面板上的手势。所述触摸传感器可以不仅感测触摸或滑动动作的边界，而且还检测与所述触摸或滑动操作相关的持续时间和压力。在一些实施例中，多媒体组件508包括一个前置摄像头和/或后置摄像头。当设备500处于操作模式，如拍摄模式或视频模式时，前置摄像头和/或后置摄像头可以接收外部的多媒体数据。每个前置摄像头和后置摄像头可以是一个固定的光学透镜系统或具有焦距和光学变焦能力。
音频组件510被配置为输出和/或输入音频信号。例如，音频组件510包括一个麦克风(MIC)，当装置500处于操作模式，如呼叫模式、记录模式和语音识别模式时，麦克风被配置为接收外部音频信号。所接收的音频信号可以被进一步存储在存储器404或经由通信组件516发送。在一些实施例中，音频组件510还包括一个扬声器，用于输出音频信号。
I/O接口512为处理组件502和外围接口模块之间提供接口，上述外围接口模块可以是键盘，点击轮，按钮等。这些按钮可包括但不限于：主页按钮、音量按钮、启动按钮和锁定按钮。
传感器组件514包括一个或多个传感器，用于为装置500提供各个方面的状态评估。例如，传感器组件514可以检测到设备500的打开/关闭状态，组件的相对定位，例如所述组件为装置500的显示器和小键盘，传感器组件514还可以检测装置500或装置500一个组件的位置改变，用户与装置500接触的存在或不存在，装置500方位或加速/减速和装置500的温度变化。传感器组件514可以包括接近传感器，被配置用来在没有任何的物理接触时检测附近物体的存在。传感器组件514还可以包括光传感器，如CMOS或CCD图像传感器，用于在成像应用中使用。在一些实施例中，该传感器组件514还可以包括加速度传感器，陀螺仪传感器，磁传感器，压力传感器或温度传感器。
通信组件516被配置为便于装置500和其他设备之间有线或无线方式的通信。装置500可以接入基于通信标准的无线网络，如WiFi，运营商网络(如2G、3G、4G或5G)，或它们的组合。在一个示例性实施例中，通信组件416经由广播信道接收来自外部广播管理系统的广播信号或广播相关信息。在一个示例性实施例中，所述通信组件516还包括近场通信(NFC)模块，以促进短程通信。例如，在NFC模块可基于射频识别(RFID)技术，红外数据协会(IrDA)技术，超宽带(UWB)技术，蓝 牙(BT)技术和其他技术来实现。
在示例性实施例中，装置500可以被一个或多个应用专用集成电路(ASIC)、数字信号处理器(DSP)、数字信号处理设备(DSPD)、可编程逻辑器件(PLD)、现场可编程门阵列(FPGA)、控制器、微控制器、微处理器或其他电子元件实现，用于执行上述方法。
在示例性实施例中，还提供了一种包括指令的非临时性计算机可读存储介质，例如包括指令的存储器504，上述指令可由装置500的处理器520执行以完成上述方法。可选地，例如，存储介质可以是非临时性计算机可读存储介质，例如，所述非临时性非临时性计算机可读存储介质计算机可读存储介质可以是ROM、随机存取存储器(RAM)、CD-ROM、磁带、软盘和光数据存储设备等。
本公开实施例提供的技术方案，在检测到目标浏览器需要加载目标图片时，获取目标图片的图片格式；在判定目标浏览器不支持图片格式时，获取目标图片的预设类型的图片编码格式，其中，目标浏览器支持预设类型的图片编码格式；将目标图片的统一资源定位符url替换为图片编码格式；通过目标浏览器加载目标图片，并展示目标图片。
可见，通过本公开实施例提供的技术方案，在检测到目标浏览器不支持目标图片的图片格式，可以将目标图片的url替换为目标图片的预设类型的图片编码格式，由于目标浏览器支持预设类型的图片编码格式，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片，即能够成功加载目标图片，并正常显示webp格式的图片。
图6是根据一示例性实施例示出的一种用于图片加载装置600的框图。例如，装置600可以被提供为一服务器。参照图6，装置600包括处理组件622，其进一步包括一个或多个处理器，以及由存储器632所代表的存储器资源，用于存储可由处理组件622的执行的指令，例如应用程序。存储器632中存储的应用程序可以包括一个或一个以上的每一个对应于一组指令的模块。此外，处理组件622被配置为执行指令，以执行上述图片加载方法。
装置600还可以包括一个电源组件626被配置为执行装置600的电源管理，一个有线或无线网络接口650被配置为将装置600连接到网络，和一个输入输出(I/O)接口658。装置600可以操作基于存储在存储器632的操作系统，例如Windows ServerTM，Mac OS XTM，UnixTM,LinuxTM，FreeBSDTM或类似。
本公开实施例提供的技术方案，在检测到目标浏览器需要加载目标图片时，获取目标图片的图片格式；在判定目标浏览器不支持图片格式时，获取目标图片的预设类型的图片编码格式，其中，目标浏览器支持预设类型的图片编码格式；将目标图片的统一资源定位符url替换为图片编码格式；通过目标浏览器加载目标图片，并展示目标图片。
可见，通过本公开实施例提供的技术方案，在检测到目标浏览器不支持目标图片的图片格式，可以将目标图片的url替换为目标图片的预设类型的图片编码格式，由于目标浏览器支持预设类型的图片编码格式，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片，即能够成功加载目标图片，并正常显示webp格式的图片。
根据本公开实施例的第四方面，提供了本公开实施例还提供了一种存储介质，当所述存储介质中的指令由电子设备的处理器执行时，使得所述电子设备能够执行本公开实施例提供的图片加载方法。
本公开实施例提供的技术方案，在检测到目标浏览器需要加载目标图片时，获取目标图片的图片格式；在判定目标浏览器不支持图片格式时，获取目标图片的预设类型的图片编码格式，其中，目标浏览器支持预设类型的图片编码格式；将目标图片的统一资源定位符url替换为图片编码格式；通过目标浏览器加载目标图片，并展示目标图片。
可见，通过本公开实施例提供的技术方案，在检测到目标浏览器不支持目标图片的图片格式，可以将目标图片的url替换为目标图片的预设类型的图片编码格式，由于目标浏览器支持预设类型的图片编码格式，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片，即能够成功加载目标图片，并正常显示webp格式的图片。
根据本公开一些实施例，提供了一种包含指令的计算机程序产品，当其在计算机上运行时，使得计算机实现第一方面所述的图片加载方法。
本公开实施例提供的技术方案，在检测到目标浏览器需要加载目标图片时，获取目标图片的图片格式；在判定目标浏览器不支持图片格式时，获取目标图片的预设类型的图片编码格式，其中，目标浏览器支持预设类型的图片编码格式；将目标图片的统一资源定位符url替换为图片编码格式；通过目标浏览器加载目标图片，并展示目 标图片。
可见，通过本公开实施例提供的技术方案，在检测到目标浏览器不支持目标图片的图片格式，可以将目标图片的url替换为目标图片的预设类型的图片编码格式，由于目标浏览器支持预设类型的图片编码格式，因此，可以通过目标浏览器加载目标图片，并展示目标图片，这样，就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片，即能够成功加载目标图片，并正常显示webp格式的图片。
应理解，本公开的所有实施例均可以单独被执行也可以与其他实施例相结合被执行，均属于本公开要求保护的范围。本公开中提到的“一个实施例”或“一些实施例”意味着与实施例有关的特定特征、结构或特性包括在本公开的至少一个实施例中。因此，在整个说明书各处出现的“在一个实施例中”或“在一些实施例中”未必一定指相同的实施例。此外，这些特定的特征、结构或特性可以任意适合的方式结合在一个或多个实施例中。应理解，在本公开的各种实施例中，上述各过程的序号的大小并不意味着执行顺序的先后，各过程的执行顺序应以其功能和内在逻辑确定，而不应对本公开实施例的实施过程构成任何限定。上述本公开实施例序号仅仅为了描述，不代表实施例的优劣。

Claims (12)

  1. 一种图片加载方法，其中，包括：
    响应于检测到目标浏览器需要加载目标图片，获取所述目标图片的图片格式；
    响应于判定所述目标浏览器不支持所述图片格式，获取所述目标图片的预设类型的图片编码格式，其中，所述目标浏览器支持所述预设类型的图片编码格式；
    将所述目标图片的统一资源定位符url替换为所述图片编码格式；
    通过所述目标浏览器加载所述目标图片，并展示所述目标图片。
  2. 根据权利要求1所述的方法，其中，所述目标图片的图片格式为webp格式，所述预设类型的图片编码格式为base64。
  3. 根据权利要求2所述的方法，其中，所述方法还包括：
    通过懒加载方式将所述目标图片预先加载到所述目标浏览器缓存中；
    启动所述目标浏览器中的目标异步线程；
    通过所述目标异步线程调用预设webpJS，将所述目标浏览器缓存中的所述目标图片转换为base64；
    将所述base64存储于所述目标浏览器缓存中。
  4. 根据权利要求3所述的方法，其中，所述获取所述目标图片的预设类型的编码格式包括：
    从所述目标浏览器缓存中获取所述base64。
  5. 根据权利要求3所述的方法，其中，还包括：
    删除目标浏览器缓存中的所述目标图片，以及所述base64。
  6. 一种图片加载装置，其中，包括：
    图片格式获取模块，被配置为执行响应于检测到目标浏览器需要加载目标图片，获取所述目标图片的图片格式；
    图片编码格式获取模块，被配置为执行响应于判定所述目标浏览器不支持所述图片格式，获取所述目标图片的预设类型的图片编码格式，其中，所述目标浏览器支持所述预设类型的图片编码格式；
    统一资源定位符替换模块，被配置为执行将所述目标图片的统一资源定位符url替换为所述图片编码格式；
    图片加载模块，被配置为执行通过所述目标浏览器加载所述目标图片，并展示所 述目标图片。
  7. 根据权利要求6所述的装置，其中，所述目标图片的图片格式为webp格式，所述预设类型的图片编码格式为base64。
  8. 根据权利要求7所述的装置，其中，所述装置还包括：
    图片预加载模块，被配置为执行通过懒加载方式将所述目标图片预先加载到所述目标浏览器缓存中；
    线程启动模块，被配置为执行启动所述目标浏览器中的目标异步线程；
    图片转化模块，被配置为执行通过所述目标异步线程调用预设webpJS，将所述目标浏览器缓存中的所述目标图片转换为base64；
    base64存储模块，被配置为执行将所述base64存储于所述目标浏览器缓存中。
  9. 根据权利要求8所述的装置，其中，所述图片编码格式获取模块，被配置为执行：
    从所述目标浏览器缓存中获取所述base64。
  10. 根据权利要求8所述的装置，其中，还包括：
    删除模块，被配置为执行删除目标浏览器缓存中的所述目标图片，以及所述base64。
  11. 一种电子设备，其中，包括：
    处理器；
    用于存储所述处理器可执行指令的存储器；
    其中，所述处理器被配置为执行所述指令，实现以下步骤：
    响应于检测到目标浏览器需要加载目标图片，获取所述目标图片的图片格式；
    响应于判定所述目标浏览器不支持所述图片格式，获取所述目标图片的预设类型的图片编码格式，其中，所述目标浏览器支持所述预设类型的图片编码格式；
    将所述目标图片的统一资源定位符url替换为所述图片编码格式；
    通过所述目标浏览器加载所述目标图片，并展示所述目标图片。
  12. 一种存储介质，当所述存储介质中的指令由电子设备的处理器执行时，使得所述电子设备能够执行如下步骤：
    响应于检测到目标浏览器需要加载目标图片，获取所述目标图片的图片格式；
    响应于判定所述目标浏览器不支持所述图片格式，获取所述目标图片的预设类型的图片编码格式，其中，所述目标浏览器支持所述预设类型的图片编码格式；
    将所述目标图片的统一资源定位符url替换为所述图片编码格式；
    通过所述目标浏览器加载所述目标图片，并展示所述目标图片。
PCT/CN2021/072110 2020-01-15 2021-01-15 图片加载方法及电子设备 WO2021143828A1 (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
US17/862,594 US20220343056A1 (en) 2020-01-15 2022-07-12 Method for loading image and electronic device

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN202010043718.4 2020-01-15
CN202010043718.4A CN111259289B (zh) 2020-01-15 2020-01-15 一种图片加载方法、装置、电子设备及存储介质

Related Child Applications (1)

Application Number Title Priority Date Filing Date
US17/862,594 Continuation US20220343056A1 (en) 2020-01-15 2022-07-12 Method for loading image and electronic device

Publications (1)

Publication Number Publication Date
WO2021143828A1 true WO2021143828A1 (zh) 2021-07-22

Family

ID=70948947

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2021/072110 WO2021143828A1 (zh) 2020-01-15 2021-01-15 图片加载方法及电子设备

Country Status (3)

Country Link
US (1) US20220343056A1 (zh)
CN (1) CN111259289B (zh)
WO (1) WO2021143828A1 (zh)

Families Citing this family (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111259289B (zh) * 2020-01-15 2024-04-30 北京达佳互联信息技术有限公司 一种图片加载方法、装置、电子设备及存储介质
CN112612964A (zh) * 2020-12-31 2021-04-06 武汉悦学帮网络技术有限公司 一种图片展示方法、装置、计算机设备和存储介质
CN112800372B (zh) * 2021-02-03 2023-06-13 网易（杭州）网络有限公司 页面加载方法、装置和电子设备
CN113836452A (zh) * 2021-07-12 2021-12-24 上海一谈网络科技有限公司 图片显示优化方法、系统、设备及存储介质

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20170223393A1 (en) * 2013-10-31 2017-08-03 Uc Mobile Co., Ltd. Methods and devices for image loading and methods and devices for video playback
CN107066609A (zh) * 2017-04-27 2017-08-18 北京京东尚科信息技术有限公司 图片显示方法和装置
CN109086374A (zh) * 2018-07-23 2018-12-25 北京达佳互联信息技术有限公司 网页加载显示方法、装置、终端设备及可读存储介质
CN111259289A (zh) * 2020-01-15 2020-06-09 北京达佳互联信息技术有限公司 一种图片加载方法、装置、电子设备及存储介质

Family Cites Families (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US9454607B1 (en) * 2010-12-10 2016-09-27 A9.Com, Inc. Image as database
CN107577766B (zh) * 2017-09-04 2020-09-15 苏州英诺迈医学创新服务有限公司 一种网页3d目标的加载方法及装置
US20210312474A1 (en) * 2019-09-17 2021-10-07 Brightedge Technologies, Inc. Dynamic General Configurability of Web Pages To Optimize Content for Search Performance and User Experiences

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20170223393A1 (en) * 2013-10-31 2017-08-03 Uc Mobile Co., Ltd. Methods and devices for image loading and methods and devices for video playback
CN107066609A (zh) * 2017-04-27 2017-08-18 北京京东尚科信息技术有限公司 图片显示方法和装置
CN109086374A (zh) * 2018-07-23 2018-12-25 北京达佳互联信息技术有限公司 网页加载显示方法、装置、终端设备及可读存储介质
CN111259289A (zh) * 2020-01-15 2020-06-09 北京达佳互联信息技术有限公司 一种图片加载方法、装置、电子设备及存储介质

Also Published As

Publication number Publication date
CN111259289B (zh) 2024-04-30
US20220343056A1 (en) 2022-10-27
CN111259289A (zh) 2020-06-09

Similar Documents

Publication Publication Date Title
WO2021143828A1 (zh) 图片加载方法及电子设备
CN109086374A (zh) 网页加载显示方法、装置、终端设备及可读存储介质
US9591256B2 (en) Methods and devices for video communication
WO2017088580A1 (zh) 一种显示图像的方法和装置
CN106201734B (zh) 文件分享方法及装置
WO2016119497A1 (zh) 固件压缩方法、固件解压方法和装置
CN111371949A (zh) 应用程序切换方法、装置、存储介质与触控终端
WO2017113666A1 (zh) 应用界面切换方法及装置
CN112449099B (zh) 一种图像处理方法、电子设备及云服务器
WO2016011749A1 (zh) 轻应用离线更新方法、装置及终端
WO2019101043A1 (zh) 图像处理方法、终端、计算机存储介质及计算机程序
US11582377B2 (en) Apparatus and method for controlling auto focus function in electronic device
CN110262692B (zh) 一种触摸屏扫描方法、装置及介质
WO2022134875A1 (zh) 数据的获取方法及电子设备
CN107239307B (zh) 版本更新信息的显示方法及装置
JP6441385B2 (ja) 情報入力方法、装置、プログラム及び記録媒体
CN112866612B (zh) 插帧方法、装置、终端及计算机可读存储介质
WO2022068642A1 (zh) 一种消息显示方法及电子设备
CN109981729B (zh) 文件处理方法、装置、电子设备及计算机可读存储介质
CN113535161A (zh) 一种用户界面生成方法及装置
CN111698414B (zh) 图像信号处理方法及装置、电子设备、可读存储介质
CN110784721A (zh) 一种图片数据压缩方法、装置、电子设备及存储介质
CN111414245B (zh) 一种控制闪存读写速率的方法、装置及介质
CN114979451A (zh) 图像预览方法及装置、存储介质
CN115705230A (zh) 数据加载方法、装置、及存储介质

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 21741955

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 21741955

Country of ref document: EP

Kind code of ref document: A1