# live-player
Start from base library version 1.7.0. Please remaining backward compatible.
Mini Program plugin: Support, the need for the Mini Program base library version is not less than 2.3.0
WeChat Windows edition: Support
WeChat Mac edition: Support
Relevant api: wx.createLivePlayerContext
# Functional description
Real-time audio and video playback (v2.9.1 Support fromSame layer rendering)。
# Apply for Open
For the time being, it is only open for the following categories of domestic entities, which need to pass the category audit first, and then in the background of the Mini Program management.Development-Interface settingsEnable the component permission in the.
Class I / Subject type | Class II | Mini Program Content Scene |
---|---|---|
social contact | live broadcast | Involves the entertainment nature, such as the star live, the life interesting live, the pet live and so on. After selecting this category, the code submitted for the first time for review shall be verified by the local Internet authority. 7 Day or so |
education | Online Video Lessons | Online courses, online training, lectures and other educational live broadcast |
Medical care | Internet Hospitals, Public Medical Institutions, Other Private Health Institutions | Live interviews, large health talks, etc. |
Finance | Bank, trust, public fund, private fund, securities/Futures, securities, futures investment consulting, insurance, credit investigation business, NEEQ information service platform, stock information service platform (Hong Kong stocks/U.S. Stocks), Consumer Finance, Financing Guarantees | Financial product video customer service claims, financial product promotion live, etc. |
automobile | Car Pre-sale Service | Pre-sale and promotion of automobiles |
Government Principal Account | / | Government related work to promote live broadcast, live leadership speech, etc. |
IT Technology | Multi-party communicationAudio and video equipment | Conference call for multiple parties/Video conferencing and other servicesControl the camera in the smart home scene |
Real Estate Services | Real Estate Marketing | Real Estate Marketing Live Broadcast Service, Online Audio and Video Tape Watch, etc. |
Business services | notarization | Online Business Processing, etc. |
# Property Dxplaination
attribute | type | Default value | Required | Introductions | Minimum version | |||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
src | string | no | Audio and video address. Currently only support flv , rtmp format | 1.7.0 | ||||||||||
mode | string | live | no | Pattern | 1.7.0 | |||||||||
| ||||||||||||||
autoplay | boolean | false | no | Autoplay | 1.7.0 | |||||||||
muted | boolean | false | no | Whether to mute | 1.7.0 | |||||||||
orientation | string | vertical | no | Screen Direction | 1.7.0 | |||||||||
| ||||||||||||||
object-fit | string | contain | no | Fill mode, the optional values are contain ,fillCrop | 1.7.0 | |||||||||
| ||||||||||||||
background-mute | boolean | false | no | Whether to mute when entering the background (deprecated, default background mute) | 1.7.0 | |||||||||
min-cache | number | 1 | no | Minimum buffer, in units s (RTC Model recommendation 0.2s) | 1.7.0 | |||||||||
max-cache | number | 3 | no | Maximum buffer, in units s (RTC Model recommendation 0.8s)。 Buffers are used to resist network fluctuations, the more data buffered, the better the network resistance, but the greater the delay. | 1.7.0 | |||||||||
sound-mode | string | speaker | no | Sound output mode | 1.9.90 | |||||||||
| ||||||||||||||
auto-pause-if-navigate | boolean | true | no | When you jump to other pages of this Mini Program, whether to automatically pause the real-time audio and video playback of this page | 2.5.0 | |||||||||
auto-pause-if-open-native | boolean | true | no | When you jump to other WeChat native pages, whether to automatically pause the real-time audio and video playback of this page | 2.5.0 | |||||||||
picture-in-picture-mode | string/Array | no | Set the small window mode: push, pop, empty character strings, or multiple modes such as ["push", "pop"]) | 2.10.3 | ||||||||||
| ||||||||||||||
enable-auto-rotation | boolean | false | no | Whether to turn on the horizontal screen of the mobile phone automatically full screen, when the system settings turn on automatic rotation effective | 2.11.0 | |||||||||
referrer-policy | string | no-referrer | no | The format is fixed as https://Servicewechat.com/{appid}/{version}/page-frame.html , of which, {appid} For Mini programs. appid,{version} Is the version number of the Mini Program, which is 0 Represented as development, trial, and audit versions, version numbers are devtools Represented as a developer tool and the rest as official versions | 2.13.0 | |||||||||
| ||||||||||||||
enable-casting | boolean | false | no | Whether to support the screen. After opening, you can go through LivePlayerContext On the related method. | 2.32.0 | |||||||||
bindingstatechange | eventhandle | no | Play change of state, detail = {code} | 1.7.0 | ||||||||||
bindfullscreenchange | eventhandle | no | Full screen change event, detail = {direction, fullScreen} | 1.7.0 | ||||||||||
bindingnet status | eventhandle | no | Network status notification, detail = {info} | 1.9.0 | ||||||||||
bindaudiovolumenotify | eventhandler | no | Play volume size notification, detail = {} | 2.10.0 | ||||||||||
bindingterpictureinpicture | eventhandler | no | Player into the small window | 2.11.0 | ||||||||||
bindleavepictureinpicture | eventhandler | no | Player Exit Small Window | 2.11.0 | ||||||||||
bindcastinguserselect | eventhandler | no | Triggered when the user selects the screen device detail = { state: "success"/"fail" } | 2.32.0 | ||||||||||
bindcastingstatechange | eventhandler | no | Screen Cast Successfully/Trigger on failure detail = { type, state: "success"/"fail" } | 2.32.0 | ||||||||||
bindcastinginterrupt | eventhandler | no | Triggered when the screen is interrupted | 2.32.0 |
# Status code
code | Introductions |
---|---|
2001 | Link: The server is already connected. |
2002 | Pull Stream: Already Connected RTMP Server, start pulling stream |
2003 | Pull stream: The network receives the first video packet(IDR) |
2004 | Pull Stream: Video Play Begins |
2005 | Pull Stream: Video Playback Progress |
2006 | Pull Stream: End of Video Play |
2007 | Pull stream: video playback Loading |
2008 | Pull Stream: Decoder Start |
2009 | Pull Stream: Video Resolution Change |
2030 | A change in the audio device is a change in the current input-output device, such as a headset being pulled out |
2032 | Pull Stream: Video Render First Frame Event |
2101 | Pull stream: current video frame decoding failed |
2102 | Pull stream: current audio frame decoding failed |
2103 | The network is disconnected, Automatic reconnection initiated |
2104 | Pull flow: network packet instability: may be insufficient downlink bandwidth, or due to uneven flow at the host end |
2105 | Pull Stream: Current Video Playback Appears Caton |
2106 | Pull flow: hard solution failed to start, using soft solution |
2107 | Pull stream: the current video frame is not continuous, may drop frames |
2108 | Pull stream: current stream hard solution first I frame failure, SDK automatically cut soft solution |
3001 | Pull Stream: RTMP -DNS Parse Failure |
3002 | Pull Flow: RTMP Server Connection Failure |
3003 | Pull Flow: RTMP Server Handshake Failure |
3005 | Pull Stream: RTMP read/Write failed, then a network retry will be initiated |
-2301 | Pull flow: The network is disconnected and invalid after multiple reconnections, please restart the pull flow by yourself |
-2302 | Pull stream: failed to get pull stream address |
# Network status data
Key | Introductions |
---|---|
videoBitrate | Current Video Editing/Bit rate of encoder output, unit kbps |
audioBitrate | Current Audio Edit/Bit rate of encoder output, unit kbps |
videoFPS | Current Video Frame Rate |
videoGOP | Current Videos GOP, which is for every two keyframes(I帧)Interval length, unit s |
netSpeed | Current Send/Receiving speed |
netJitter | Network jitter, for 0 Indicates that there is no jitter, and the higher the value, the greater the jitter, the more unstable the network. |
netQualityLevel | Network Quality: 0: Undefined 1: Best 2: Good 3: General 4: Poor 5: Very Bad 6: Not Available |
videoWidth | The width of the video frame |
videoHeight | The height of the video picture |
videoCache | Total length of buffered video in milliseconds |
audioCache | Total buffered audio duration in milliseconds |
vDecCacheSize | Number of video frames cached in the decoder (Android Present at the time of hard end decoding) |
vSumCacheSize | The total number of video frames buffered, the greater the number, the higher the playback delay |
avPlayInterval | Sound and Picture Synchronization Offset Time (Play), Unit Ms, the smaller this number, the better the audio and picture synchronization |
avRecvInterval | Sync Offset Time (Network), Unit Ms, the smaller this number, the better the audio and picture synchronization |
audioCacheThreshold | Audio buffering duration threshold beyond which the player starts to adjust the delay |
# Small Window Characteristics Dxplaination
live-player The window supports the following three trigger modes (set on the component picture-in-picture-mode Attribute):
push Mode, that is, a small window appears when you jump from the current page to the next page (page stack push)
pop Mode, which is triggered when leaving the current page (page stack pop)
Both of the above routing behaviors trigger small windows
In addition, small windows support the following features:
The small window container size is automatically determined based on the original component size
Click on the window, the user will be navigated back to the player page corresponding to the window
After the small window appears, the user can click the close button in the upper right corner of the small window or call context.exitPictureInPicture() Interface Close Small Window
When the player enters small window mode, the page where the player is in hide state(trigger onHide life cycle), the page will not be destroyed. When the window is closed, the page where the player is will be unload (trigger onUnload life cycle)。
# Bug & Tip
tip
:live-player Default width 300px, height 225px, width and height can be set through wxss.tip
: Not supported on developer tools.tip
: The relevant introduction and principle can refer toThis article
# sample code
<live-player src="https://domain/pull_stream" mode="RTC" autoplay bindstatechange="statechange" binderror="error" style="width: 300px height: 225px" />
Page({
statechange(e) {
console.log('live-player code:', e.detail.code)
},
error(e) {
console.error('live-player error:', e.detail.errMsg)
}
})