CN108228836B - Video compatible loading method and device and video component - Google Patents
Video compatible loading method and device and video component Download PDFInfo
- Publication number
- CN108228836B CN108228836B CN201810008651.3A CN201810008651A CN108228836B CN 108228836 B CN108228836 B CN 108228836B CN 201810008651 A CN201810008651 A CN 201810008651A CN 108228836 B CN108228836 B CN 108228836B
- Authority
- CN
- China
- Prior art keywords
- video
- browser
- loading
- component
- configuration
- Prior art date
- Legal status (The legal status 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 status listed.)
- Active
Links
- 238000011068 loading method Methods 0.000 title claims abstract description 121
- 238000001514 detection method Methods 0.000 claims abstract description 28
- 230000003111 delayed effect Effects 0.000 claims abstract description 16
- 238000000034 method Methods 0.000 claims abstract description 14
- 230000000007 visual effect Effects 0.000 claims description 11
- 230000004044 response Effects 0.000 claims description 9
- 230000008676 import Effects 0.000 claims description 8
- 238000012544 monitoring process Methods 0.000 claims description 6
- 230000003068 static effect Effects 0.000 claims description 3
- 230000000977 initiatory effect Effects 0.000 claims 1
- 238000012545 processing Methods 0.000 description 7
- 238000010586 diagram Methods 0.000 description 6
- 238000006243 chemical reaction Methods 0.000 description 3
- 230000006870 function Effects 0.000 description 3
- 230000000903 blocking effect Effects 0.000 description 2
- 238000004590 computer program Methods 0.000 description 2
- 238000013461 design Methods 0.000 description 2
- 230000004048 modification Effects 0.000 description 2
- 238000012986 modification Methods 0.000 description 2
- 230000008569 process Effects 0.000 description 2
- VYZAMTAEIAYCRO-UHFFFAOYSA-N Chromium Chemical compound [Cr] VYZAMTAEIAYCRO-UHFFFAOYSA-N 0.000 description 1
- 241000334993 Parma Species 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000008859 change Effects 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 230000006872 improvement Effects 0.000 description 1
- 230000002452 interceptive effect Effects 0.000 description 1
- 230000007246 mechanism Effects 0.000 description 1
- 230000002093 peripheral effect Effects 0.000 description 1
Images
Classifications
-
- 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
-
- 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/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
Abstract
The invention provides a video compatible loading method and device and a video component. The method comprises the following steps: and responding to the operation of starting the browser page, and loading the browser page. When the browser page is loaded, performing video compatibility detection on the current browser through a pre-configured video component, and selecting a video loading mode supported by the current browser. And carrying out delayed loading on a video file based on the selected video loading mode through the video component. Therefore, different technical implementation schemes can be provided for different browsers, video loading can be performed by selecting a video loading mode supported by the browser through performing video compatibility detection on the browsers, and the video component is high in transportability and wide in application range.
Description
Technical Field
The invention relates to the technical field of browsers, in particular to a video compatible loading method and device and a video component.
Background
With the increasing powerful functions of the browser, the requirements of users on the aesthetic degree of the browser page and the user experience are also higher, and in the page design and development stage, designers can consider adding cool dynamic interactive videos into the page (especially in the head area of the page).
However, in the prior art, due to the wide variety of browsers on the market, there are many limitations when different types of browsers load video files, and the compatibility is poor. When the same video file is loaded in browsers of different versions or browsers of different operating systems, situations that the loading is unsuccessful and the video file cannot be automatically played may occur, which require setting and intervention by a user and result in poor user experience.
Disclosure of Invention
The embodiment of the invention provides a video compatible loading method and device and a video component.
In a first aspect, an embodiment of the present invention provides a video compatible loading method, including:
responding to the operation of starting a browser page, and loading the browser page;
when the browser page is loaded, performing video compatibility detection on the current browser through a pre-configured video component, and selecting a video loading mode supported by the current browser;
and carrying out delayed loading on a video file based on the selected video loading mode through the video component.
In a second aspect, an embodiment of the present invention provides a video compatible loading apparatus, including:
the response module is used for responding to the operation of starting the browser page and loading the browser page;
the video component is used for carrying out video compatibility detection on the current browser when the browser page is loaded, and selecting a video loading mode supported by the current browser;
and the video component is also used for carrying out delayed loading on the video file based on the selected video loading mode.
In a third aspect, an embodiment of the present invention provides a video component, where the video component includes:
the detection selection unit is used for carrying out video compatibility detection on the current browser when a browser page is loaded and selecting a video loading mode supported by the current browser;
and the loading unit is used for carrying out delayed loading on the video file based on the selected video loading mode.
Compared with the prior art, the invention has the following beneficial effects:
the embodiment of the invention provides a video compatible loading method and device and a video component. The method comprises the following steps: and responding to the operation of starting the browser page, and loading the browser page. When the browser page is loaded, performing video compatibility detection on the current browser through a pre-configured video component, and selecting a video loading mode supported by the current browser. And carrying out delayed loading on a video file based on the selected video loading mode through the video component. Therefore, different technical implementation schemes can be provided for different browsers, and video loading can be performed by selecting a video loading mode supported by the browser through performing video compatibility detection on the browser. The scheme is basically applicable to most browsers, and the video component is high in transportability and wide in application range.
Drawings
In order to more clearly illustrate the technical solutions of the embodiments of the present invention, the drawings needed to be used in the embodiments will be briefly described below, it should be understood that the following drawings only illustrate some embodiments of the present invention and therefore should not be considered as limiting the scope, and for those skilled in the art, other related drawings can be obtained according to the drawings without inventive efforts.
Fig. 1 is a flowchart illustrating steps of a video compatible loading method according to a first embodiment of the present invention.
Fig. 2 is a flowchart illustrating sub-steps of step S130 shown in fig. 1 according to a first embodiment of the present invention.
Fig. 3 is a flowchart illustrating sub-steps of step S140 shown in fig. 1 according to a first embodiment of the present invention.
Fig. 4 is a second flowchart illustrating steps of a video compatible loading method according to the first embodiment of the present invention.
Fig. 5 is a flowchart illustrating sub-steps of step S110 shown in fig. 4 according to a first embodiment of the present invention.
Fig. 6 is a functional block diagram of a video compatible loading apparatus according to a second embodiment of the present invention.
Fig. 7 is a functional unit diagram of a video module according to a third embodiment of the present invention.
Fig. 8 is a schematic block diagram of a structure of an electronic device according to an embodiment of the present invention.
Icon: 100-an electronic device; 110-a bus; 120-a processor; 130-a memory; 200-a video compatible loading device; 210-configuration update module; 220-a response module; 230-a video component; 231-a detection selection unit; 232-load unit.
Detailed Description
The technical solutions in the embodiments of the present invention will be clearly and completely described below with reference to the drawings in the embodiments of the present invention, and it is obvious that the described embodiments are some, not all, embodiments of the present invention. The components of embodiments of the present invention generally described and illustrated in the figures herein may be arranged and designed in a wide variety of different configurations. Thus, the following detailed description of the embodiments of the present invention, presented in the figures, is not intended to limit the scope of the invention, as claimed, but is merely representative of selected embodiments of the invention. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present invention.
It should be noted that: like reference numbers and letters refer to like items in the following figures, and thus, once an item is defined in one figure, it need not be further defined and explained in subsequent figures.
In the process of implementing the technical solution provided by the embodiment of the present application, the inventor of the present application finds that in the prior art, a solution for a browser page developer to load a video in a page mainly includes: the video file address is loaded into the page using the tag of HTML5 or the video is imported using a Flash plug-in. However, both of these solutions have problems, and the tag mechanism of HTML5 is not compatible with older versions of browsers. More and more browsers have many restrictions on Flash plug-ins, for example, some browsers do not have Flash plug-ins (e.g., Firefox, chrome, etc.), and devices using the iOS system (e.g., iPad, iPhone, iPod touch) do not support Flash. Therefore, when the same video file is loaded in browsers of different versions or browsers of different operating systems, the situations that the video file is not loaded successfully and the video cannot be played may occur.
The above prior art solutions have shortcomings which are the results of practical and careful study of the inventor, and therefore, the discovery process of the above problems and the solutions proposed by the following embodiments of the present invention to the above problems should be the contribution of the inventor to the present invention in the course of the present invention.
In order to alleviate the above problem, embodiments of the present invention provide a video compatible loading method and apparatus, and a video component. The following embodiments are provided to describe a video compatible loading method, device and video component provided by the present invention.
First embodiment
The embodiment of the invention provides a video compatible loading method. Referring to fig. 1, fig. 1 is a flowchart illustrating a video compatible loading method according to a first embodiment of the present invention. The following describes in detail the flow of a video compatible loading method, which includes: step S120, step S130, and step S140.
Step S120, responding to the operation of starting the browser page, and loading the browser page.
In this embodiment, when a user opens a browser page, the browser responds to an operation of starting the browser page by the user, and loads the browser page.
Step S130, when loading the browser page, performing video compatibility detection on the current browser through the pre-configured video component 230, and selecting a video loading mode supported by the current browser.
Referring to fig. 2, fig. 2 is a flowchart illustrating sub-steps of step S130 shown in fig. 1 according to a first embodiment of the present invention. The step S130 includes a sub-step S131, a sub-step S132, a sub-step S133, a sub-step S134, and a sub-step S135.
Sub-step S131, detecting whether the hypertext video parameter of the current browser is defined through the pre-configured video component 230.
In this embodiment, the hypertext video parameter may be, but is not limited to, html videoelement. The HTMLVideoElement interface provides special properties and methods for manipulating video objects, inherits the properties and methods of htmlmediaelements and htmlelements, and can be applied to different browsers.
In this embodiment, the Video component 230 may further determine whether the current browser supports the Video tag of HTML5 by detecting whether the HTML videoelement of the current browser is defined. The Video tag of HTML5 can add the address of the Video file to the browser page to facilitate Video loading.
When the hypertext video parameter is defined, substep S132 is performed.
When the hypertext video parameter is not defined, substep S133.
In sub-step S132, the video component 230 selects a hypertext video loading mode as the video loading mode supported by the current browser.
In this embodiment, when the hypertext Video parameter (HTML Video element) is defined, the Video component 230 may determine that the current browser supports a Video tag of HTML5, and may select a hypertext Video loading mode as the Video loading mode supported by the current browser. The hypertext Video loading mode means that the Video component 230 may create a Video tag of HTML5, and fill an address of a Video file (e.g., a Video file in mp4 format, webm format, or ogv format) configured by a developer into an src attribute of the Video tag for Video loading.
In sub-step S133, the video component 230 detects whether the current browser installs a video plug-in.
In this embodiment, when the hypertext video parameter is not defined, the video component 230 can detect whether the current browser installs a video plug-in. The video plug-in may include, but is not limited to, Flash plug-in, npapi (netscape plug-in Application Programming interface), active plug-in schemes, and the like.
For example, the video component 230 may determine whether a Flash plug-in is installed in the current browser through navigator.
When the video plug-in is installed, substep S134 is performed.
When the video plug-in is not installed, substep S135 is performed.
In sub-step S134, the video component 230 selects a video plug-in loading mode as the video loading mode supported by the current browser.
In this embodiment, when installing a video plug-in, the video component 230 may select a video plug-in loading mode as the video loading mode supported by the current browser.
For example, if the current browser is installed with a Flash plug-in, the video plug-in loading mode means that the video component 230 can load a Flash video file configured by a developer in advance by using SWFObject.
In this embodiment, SWFObject is a JavaScript module for conveniently inserting Adobe Flash media resources (swf files) in HTML. The JavaScript script in SWFObject can automatically detect the support condition of various mainstream browsers on PC and Mac machines to the Flash plug-in, so that the inserted Flash media resources are simple, convenient and safe.
In sub-step S135, the video component 230 performs video demotion based on the pre-configured still picture.
In this embodiment, when a Video plug-in is not installed, that is, when the current browser does not support both a hypertext Video loading mode (for example, a Video tag of HTML 5) and a Video plug-in loading mode (for example, a Flash plug-in loading mode), the Video component 230 may perform Video demotion display processing, that is, the Video component 230 may load and display a static picture configured in advance by a developer in a browser page.
In this embodiment, different technical implementation schemes are provided for different browsers, and video loading can be performed in a video loading mode supported by a browser by performing video compatibility detection on the browser. The scheme is basically applicable to most browsers, and the video component 230 is high in portability and wide in application range.
In step S140, the video component 230 performs delayed loading on the video file based on the selected video loading manner.
Referring to fig. 3, fig. 3 is a flowchart illustrating sub-steps of step S140 shown in fig. 1 according to a first embodiment of the present invention. The step S140 includes a substep S141, a substep S142, and a substep S143.
Substep S141, a listening check is performed on page scrolling and browser window scaling by the video component 230.
In this embodiment, in order to improve the loading performance, the video component 230 may perform a lazy loading operation on a video file, that is, the video component 230 may perform monitoring detection on a scroll event of a mouse operated by a user and a zoom event of a browser window. For example, the video component 230 may sum the size of the browser window and the scrolling value of the browser window, and compare the sum result with a preset top position value of the display frame of the loaded video file.
In sub-step S142, the video component 230 determines whether the display position of the video file is within the current visual view according to the detection result.
In this embodiment, the video component 230 may determine whether the display position of the video file is within the current visual view according to a detection result obtained by comparing the summation result with the top position value.
In this embodiment, if the summation result is consistent with the comparison result of the top position value, or is within a preset reasonable threshold range, it may be determined that the display position of the video file is within the current visual view.
In sub-step S143, when the current visual view is displayed, the video component 230 loads the video file based on the selected video loading manner.
In this embodiment, when the current visual view is within the current visual view, the video component 230 may load the video file based on the video loading manner selected in step S130.
In this embodiment, if the current view is not in the current view, the video component 230 will not load the video file, and will continue to monitor and detect page scrolling and browser window zooming.
In this embodiment, resources such as videos and pictures can be delayed and loaded as required by the scheme, so that a potential page white screen caused by blocking of page display when the video component 230 loads the resources is avoided, the loading speed and performance of the page can be effectively improved, and user experience is improved.
Referring to fig. 4, fig. 4 is a second flowchart illustrating a video compatible loading method according to a first embodiment of the present invention. The method further comprises the following steps: step S110 and step S115.
Step S110, responding to the operation of editing the configuration parameters of the video component 230, and updating the configuration of the video component 230 based on the configuration parameters.
Referring to fig. 5, fig. 5 is a flowchart illustrating sub-steps of step S110 shown in fig. 4 according to a first embodiment of the present invention. The step S110 includes a substep S111, a substep S112, a substep S113, and a substep S114.
Substep S111, monitoring an editing event of the configuration text box of the video component 230, and responding to an operation of editing the configuration parameters of the video component 230.
In this embodiment, in the configuration text box provided by the video component 230, a developer can perform custom editing on the video component 230 through the editing function provided by the video component 230. For example, a developer can perform custom editing on configuration parameters such as width and height (height) of a video display area, a video file address, and a video playing speed.
In this embodiment, a callback function corresponding to an API (Application Programming Interface) provided by a browser may be used to monitor a custom editing operation of a developer in a configuration text box, and when the developer edits configuration parameters, the video component 230 may obtain a notification and respond to the operation of editing the configuration parameters of the video component 230.
And a substep S112, obtaining the configuration parameters edited to the configuration text box.
In this embodiment, the configuration parameters may include, but are not limited to, a width and a height (width, height) of the Video display area, Video file addresses (e.g., Video file addresses in mp4 format and webm format loaded by a Video tag of HTML5, Video file addresses in swf format corresponding to a Flash plug-in, img format corresponding to a still picture, etc.), a Video playing speed, and the like.
And a substep S113, performing configuration update on the data state of the video component 230 based on the configuration parameters, and performing preview play on the video file subjected to configuration update.
In this embodiment, the browser may perform configuration update on the data state of the video component 230 based on the configuration parameters edited by the developer, update the data state inside the video component 230, and automatically preview and play the video file subjected to configuration update to the developer.
In this embodiment, an automatic preview mode is adopted in the scheme, and the browser can automatically preview and play the updated configuration effect to the developer, so that the developer can dynamically adjust the visual effect of the page.
And a substep S114, responding to the storage operation completed by the configuration, and performing conversion processing on the stored configuration parameters to obtain variable texts corresponding to the configuration parameters.
In this embodiment, after the developer completes the configuration change of the video component 230, the browser may click the save button, respond to the save operation completed by the configuration of the developer, save the edited and changed configuration parameters, and perform conversion processing on the saved configuration parameters to convert the configuration parameters into the variable text of the JavaScript.
In step S115, in response to the initial import operation of introducing the configuration updated video component 230 into the browser page, the video component 230 is applied to the browser page.
In this embodiment, the browser responds to an initial import operation in which a developer imports the video component 230 into the browser page to apply the video component 230 to the browser page. Wherein the initializing import operation comprises: after the configuration of the video component 230 is completed, when a developer needs to use the video component 230, the developer introduces (performs import processing) the video component 230 into a developed browser page; then, a module export class (e.g. Video) is created, and the variable text of the JavaScript obtained by the previous conversion is passed into the constructor of the Video class, that is: new Video (parmas), whereby the Video component 230 can be successfully introduced into the browser page.
In the embodiment, a developer only needs to write codes when introducing and custom-editing the video component 230, and other parts can be automatically realized by the video component 230, so that the use threshold of the video component 230 can be reduced, and the use range of the video component 230 can be expanded.
Second embodiment
The embodiment of the invention also provides a video compatible loading device 200. Referring to fig. 6, fig. 6 is a functional block diagram of a video compatible loading device 200 according to a second embodiment of the present invention. The device comprises: a response module 220 and a video component 230.
The response module 220 is configured to respond to an operation of starting a browser page, and load the browser page.
The video component 230 is configured to perform video compatibility detection on the current browser when the browser page is loaded, and select a video loading mode supported by the current browser.
The video component 230 is further configured to perform delayed loading on a video file based on the selected video loading manner.
Referring to fig. 6 again, the apparatus further includes: the configuration update module 210.
The configuration update module 210 is configured to respond to an operation of editing the configuration parameters of the video component 230, and perform configuration update on the video component 230 based on the configuration parameters.
The response module 220 is further configured to respond to an initial import operation of introducing the video component 230 with the configuration update into the browser page, so as to apply the video component 230 to the browser page.
It can be understood that, for the specific operation method of each functional module in this embodiment, reference may be made to the detailed description of the corresponding step in the first embodiment, and no repeated description is provided herein.
Third embodiment
An embodiment of the present invention further provides a video component 230. Referring to fig. 7, fig. 7 is a functional unit diagram of a video module 230 according to a third embodiment of the present invention. The video component 230 includes: a detection selection unit 231 and a loading unit 232.
The detection selecting unit 231 is configured to perform video compatibility detection on the current browser when a browser page is loaded, and select a video loading mode supported by the current browser.
And a loading unit 232, configured to perform delayed loading on the video file based on the selected video loading manner.
It is understood that, in the present embodiment, the detailed description of step S130 and step S140 in the first embodiment can be referred to for the specific operation method of each functional unit of the video component 230, and the detailed description is not repeated herein.
An embodiment of the present invention further provides a readable storage medium, where a computer program is stored in the readable storage medium, and when the computer program is executed, the video compatible loading method provided in the first embodiment is implemented.
Further, the video compatible loading method, apparatus and video component 230 provided by the embodiment of the present invention can be applied to the electronic device 100. Referring to fig. 8, fig. 8 is a schematic block diagram of a structure of an electronic device 100 according to an embodiment of the present invention. The electronic device 100 may be a tablet computer, a Personal Computer (PC), a notebook computer, or even a server. The electronic device 100 may include a bus 110, a processor 120, and a memory 130.
In this embodiment, electronic device 100 may be implemented by bus 110 as a general bus architecture. Bus 110 may include any number of interconnecting buses and bridges depending on the specific application of electronic device 100 and the overall design constraints. The bus 110 connects various circuits including the processor 120, the memory 130, and the like. The bus 110 may also connect various other circuits such as timing sources, peripherals, voltage regulators, or power management circuits, which are well known in the art, and therefore, will not be described in detail herein.
In this embodiment, the memory 130 stores the video compatible loader 200, the video compatible loader 200 includes at least one software functional module which can be stored in the memory 130 in a form of software or firmware (firmware), and the processor 120 executes various functional applications and data processing by running the software programs and modules stored in the memory 130.
The Memory 130 may be, but is not limited to, a Random Access Memory (RAM), a Read Only Memory (ROM), a Programmable Read-Only Memory (PROM), an Erasable Read-Only Memory (EPROM), an electrically Erasable Read-Only Memory (EEPROM), and the like. The memory 130 is used for storing a program, and the processor 120 executes the program after receiving the execution instruction. Further, the software programs and modules within the memory 130 may also include an operating system, which may include various software components and/or drivers for managing system tasks (e.g., memory management, storage device control, power management, etc.), and may communicate with various hardware or software components to provide an operating environment for other software components.
The processor 120 may be an integrated circuit chip having signal processing capabilities. The Processor 120 may be a general-purpose Processor including a Central Processing Unit (CPU), a Network Processor (NP), and the like. The various methods, steps and logic blocks disclosed in the embodiments of the present invention may be implemented or performed. A general purpose processor may be a microprocessor or the processor may be any conventional processor or the like.
It will be appreciated that the configuration depicted in FIG. 8 is merely illustrative and that electronic device 100 may include more or fewer components than shown in FIG. 8 or have a different configuration than shown in FIG. 8. The components shown in fig. 8 may be implemented in hardware, software, or a combination thereof.
In summary, embodiments of the present invention provide a video compatible loading method and apparatus, and a video component. The method comprises the following steps: and responding to the operation of starting the browser page, and loading the browser page. When the browser page is loaded, performing video compatibility detection on the current browser through a pre-configured video component, and selecting a video loading mode supported by the current browser. And carrying out delayed loading on a video file based on the selected video loading mode through the video component.
Therefore, different technical implementation schemes are provided for different browsers, and video loading can be performed by selecting a video loading mode supported by the browser through performing video compatibility detection on the browser. The scheme is basically applicable to most browsers, and the video component is high in transportability and wide in application range. In addition, according to the scheme, resources such as videos and pictures can be loaded in a delayed mode according to needs, potential page white screen caused by blocking of page display when the video components load the resources is avoided, the loading speed and performance of the page can be effectively improved, and user experience is improved.
The above description is only a preferred embodiment of the present invention and is not intended to limit the present invention, and various modifications and changes may be made by those skilled in the art. Any modification, equivalent replacement, or improvement made within the spirit and principle of the present invention should be included in the protection scope of the present invention.
Claims (7)
1. A video compatible loading method, comprising:
responding to the operation of starting a browser page, and loading the browser page;
when the browser page is loaded, performing video compatibility detection on the current browser through a pre-configured video component, and selecting a video loading mode supported by the current browser;
performing delayed loading on a video file through the video component based on the selected video loading mode;
prior to the step of initiating operation of a browser page in response, the method further comprises:
responding to the operation of editing the configuration parameters of the video assembly, and updating the configuration of the video assembly based on the configuration parameters;
responding to an initial import operation of introducing the video component subjected to the configuration update into the browser page, so as to apply the video component to the browser page;
the responding to the operation of editing the configuration parameters of the video assembly and updating the configuration of the video assembly based on the configuration parameters comprises the following steps:
monitoring an editing event of a configuration text box of the video assembly, and responding to the operation of editing the configuration parameters of the video assembly;
acquiring the configuration parameters edited to the configuration text box;
configuring and updating the data state of the video assembly based on the configuration parameters, and previewing and playing the video file subjected to configuration and updating;
and responding to the storage operation finished by the configuration, and converting the stored configuration parameters to obtain variable texts corresponding to the configuration parameters.
2. The method according to claim 1, wherein the performing video compatibility detection on the current browser through the preconfigured video component and selecting the video loading mode supported by the current browser comprises:
detecting whether a hypertext video parameter of a current browser is defined or not through a pre-configured video component;
when the video component is defined, selecting a hypertext video loading mode as a video loading mode supported by the current browser by the video component;
when not defined, the video component detects whether the current browser installs a video plug-in;
when a video plug-in is installed, the video component selects a video plug-in loading mode as a video loading mode supported by the current browser;
when the video plug-in is not installed, the video component performs video demotion display based on the pre-configured static pictures.
3. The method of claim 2, wherein the delayed loading of the video file by the video component based on the selected video loading mode comprises:
monitoring and detecting page scrolling and browser window zooming through the video component;
the video component judges whether the display position of the video file is in the current visual view according to the detection result;
when the video file is in the current visual view, the video component loads the video file based on the selected video loading mode.
4. A video compatible loading device, comprising:
the response module is used for responding to the operation of starting the browser page and loading the browser page;
the video component is used for carrying out video compatibility detection on the current browser when the browser page is loaded, and selecting a video loading mode supported by the current browser;
the video component is also used for carrying out delayed loading on a video file based on the selected video loading mode;
the configuration updating module is used for responding to the operation of editing the configuration parameters of the video assembly and updating the configuration of the video assembly based on the configuration parameters;
the response module is further used for responding to an initial import operation of introducing the video component subjected to the configuration update into the browser page so as to apply the video component to the browser page;
the configuration updating module is further configured to monitor an editing event of the configuration text box of the video component, and respond to an operation of editing the configuration parameters of the video component; acquiring the configuration parameters edited to the configuration text box; configuring and updating the data state of the video assembly based on the configuration parameters, and previewing and playing the video file subjected to configuration and updating; and responding to the storage operation finished by the configuration, and converting the stored configuration parameters to obtain variable texts corresponding to the configuration parameters.
5. A video component, the video component comprising:
the detection selection unit is used for carrying out video compatibility detection on the current browser when a browser page is loaded and selecting a video loading mode supported by the current browser;
the loading unit is used for carrying out delayed loading on the video file based on the selected video loading mode;
the video component performs configuration update in the following manner, including: monitoring an editing event of a configuration text box of the video assembly, and responding to the operation of editing the configuration parameters of the video assembly; acquiring the configuration parameters edited to the configuration text box; configuring and updating the data state of the video assembly based on the configuration parameters, and previewing and playing the video file subjected to configuration and updating; and responding to the storage operation finished by the configuration, and converting the stored configuration parameters to obtain variable texts corresponding to the configuration parameters.
6. The video component of claim 5, wherein the detecting and selecting unit performs video compatibility detection on the current browser and selects the video loading mode supported by the current browser, and the detecting and selecting unit includes:
detecting whether a hypertext video parameter of a current browser is defined or not through a pre-configured video component;
when the video component is defined, selecting a hypertext video loading mode as a video loading mode supported by the current browser by the video component;
when not defined, the video component detects whether the current browser installs a video plug-in;
when a video plug-in is installed, the video component selects a video plug-in loading mode as a video loading mode supported by the current browser;
when the video plug-in is not installed, the video component performs video demotion display based on the pre-configured static pictures.
7. The video component of claim 6, wherein the loading unit performs the delayed loading on the video file based on the selected video loading manner, and comprises:
monitoring and detecting page scrolling and browser window zooming through the video component;
the video component judges whether the display position of the video file is in the current visual view according to the detection result;
when the video file is in the current visual view, the video component loads the video file based on the selected video loading mode.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810008651.3A CN108228836B (en) | 2018-01-04 | 2018-01-04 | Video compatible loading method and device and video component |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810008651.3A CN108228836B (en) | 2018-01-04 | 2018-01-04 | Video compatible loading method and device and video component |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN108228836A CN108228836A (en) | 2018-06-29 |
| CN108228836B true CN108228836B (en) | 2021-02-02 |
Family
ID=62642890
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201810008651.3A Active CN108228836B (en) | 2018-01-04 | 2018-01-04 | Video compatible loading method and device and video component |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN108228836B (en) |
Families Citing this family (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN108924622B (en) * | 2018-07-24 | 2022-04-22 | 腾讯科技（深圳）有限公司 | Video processing method and device, storage medium and electronic device |
| CN113064590B (en) * | 2019-12-26 | 2023-10-27 | 腾讯科技（深圳）有限公司 | Processing method and device for interactive components in interactive video |
Citations (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102752385A (en) * | 2012-06-29 | 2012-10-24 | 广东大晋对接信息科技有限公司 | Cross-platform panorama three-dimensional display method and system |
| CN103281591A (en) * | 2013-06-03 | 2013-09-04 | 贝壳网际（北京）安全技术有限公司 | Method and device for playing flash video through browser and mobile terminal |
| CN103338384A (en) * | 2013-05-31 | 2013-10-02 | 优视科技有限公司 | Video play method and video play device |
| CN104200405A (en) * | 2014-09-03 | 2014-12-10 | 四川上略互动网络技术有限公司 | Scenic region intelligent digital panorama system and client side and server side response method thereof |
| CN104469528A (en) * | 2014-12-26 | 2015-03-25 | 北京奇虎科技有限公司 | Method and device for loading video data and browser client side |
| CN104954867A (en) * | 2015-06-26 | 2015-09-30 | 努比亚技术有限公司 | Media playing method and device |
| CN105959821A (en) * | 2016-05-30 | 2016-09-21 | 乐视控股（北京）有限公司 | Video play method and device |
Family Cites Families (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| KR102131644B1 (en) * | 2014-01-06 | 2020-07-08 | 삼성전자주식회사 | Electronic apparatus and operating method of web-platform |
-
2018
- 2018-01-04 CN CN201810008651.3A patent/CN108228836B/en active Active
Patent Citations (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102752385A (en) * | 2012-06-29 | 2012-10-24 | 广东大晋对接信息科技有限公司 | Cross-platform panorama three-dimensional display method and system |
| CN103338384A (en) * | 2013-05-31 | 2013-10-02 | 优视科技有限公司 | Video play method and video play device |
| CN103281591A (en) * | 2013-06-03 | 2013-09-04 | 贝壳网际（北京）安全技术有限公司 | Method and device for playing flash video through browser and mobile terminal |
| CN104200405A (en) * | 2014-09-03 | 2014-12-10 | 四川上略互动网络技术有限公司 | Scenic region intelligent digital panorama system and client side and server side response method thereof |
| CN104469528A (en) * | 2014-12-26 | 2015-03-25 | 北京奇虎科技有限公司 | Method and device for loading video data and browser client side |
| CN104954867A (en) * | 2015-06-26 | 2015-09-30 | 努比亚技术有限公司 | Media playing method and device |
| CN105959821A (en) * | 2016-05-30 | 2016-09-21 | 乐视控股（北京）有限公司 | Video play method and device |
Also Published As
| Publication number | Publication date |
|---|---|
| CN108228836A (en) | 2018-06-29 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10565293B2 (en) | Synchronizing DOM element references | |
| CN101952821B (en) | Editing a document using a transitory editing surface | |
| US7434174B2 (en) | Method and system for zooming in and out of paginated content | |
| US20130036196A1 (en) | Method and system for publishing template-based content | |
| WO2020010725A1 (en) | Method and apparatus for automatically synchronously refreshing browser, and computer device | |
| CN111796821A (en) | Page updating method and device | |
| KR20180091838A (en) | A page construction method, a terminal, a computer readable storage medium, and a page builder | |
| WO2017107851A1 (en) | Method and device for releasing and updating desktop application component | |
| CN108228836B (en) | Video compatible loading method and device and video component | |
| CN103761110A (en) | Browser font displaying and processing method and device | |
| CN112783783A (en) | Webpage point burying method, device and equipment and readable storage medium | |
| CN106991036B (en) | Prompting method and system for information input abnormity | |
| WO2013109858A1 (en) | Design canvas | |
| CN116304442A (en) | Page code generation method and device, electronic equipment and storage medium | |
| US20120216132A1 (en) | Embedding User Selected Content In A Web Browser Display | |
| CN112130951A (en) | AI-based RPA flow generation end flow generation method, equipment and storage medium | |
| CN108268298B (en) | Desktop icon generation method and device, storage medium and electronic equipment | |
| CN107341038B (en) | Compatibility processing method and device and electronic equipment | |
| CN108958823B (en) | Method for modifying set value of basic input and output system | |
| CN114063958A (en) | Page split-screen display method and device | |
| WO2018187107A1 (en) | Cross-application content injection | |
| CN113901360A (en) | Data processing method and device and electronic equipment | |
| CN113485689A (en) | Buried point processing method and device | |
| CN107357926B (en) | Webpage processing method and device and electronic equipment | |
| CN112433723A (en) | Personalized list development method and device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant | ||
| TR01 | Transfer of patent right |
Effective date of registration: 20240206 Address after: Room 17-1-0701, Huaguoshan Avenue, High tech Zone, Lianyungang City, Jiangsu Province, 222000 Patentee after: Weixing Shulian (Jiangsu) Digital Technology Co.,Ltd. Country or region after: China Address before: 11 / F, building B1, software industry phase 4.1, No.1, Software Park East Road, Donghu New Technology Development Zone, Wuhan City, Hubei Province, 430000 Patentee before: WUHAN DOUYU NETWORK TECHNOLOGY Co.,Ltd. Country or region before: China |
|
| TR01 | Transfer of patent right |