FLV real-time video
This component plays live video streams that use the FLV protocol. It currently supports features such as auto-play, pause, volume control, and full screen mode. This topic details how to configure the component.
Usage
The real-time FLV video component has the following compatibility requirements:
-
Supported playback protocol: HTTP-FLV.
-
Supported video encoding protocol: H.264.
Step 1: Add the component
-
Create a web application. For more information, see Create a web application.
In the Web application editor, click the component icon
on the left.-
In the search box above the component list, enter real-time FLV video to find the component, and then drag it to the canvas.
For more information about adding components, see Add a component.
In the style panel on the right, you can configure properties such as the component's position (X and Y), size (W and H), name, and opacity. In the source URL input box, enter the FLV video stream URL.
Step 2: Configure data source
-
Static data
In the style panel on the right, enter the video stream URL in the source URL input box.
ImportantOnly HTTP-FLV video stream URLs are supported. The format is
https://domain/path/filename.flv. -
Dynamic data
Click the configure data source icon
next to the source URL input box. Select a data source type, complete the configuration, and then click OK.The available data source types are device, API, application push, and page variable.
The associated data source updates the source URL in real time.
Step 3: Configure styles
-
Adjust the final position of the component on the page. For information about general component style settings, see Configure styles.
-
In the upper-right corner of the page, click save and then preview to preview the component.
The preview shows a video player, which may be loading or buffering. Its control bar includes a play button, a time display (0:00), a mute icon, and a full screen toggle.
Best practices
Use IoT Studio to play real-time video streams from a Link Visual camera