Introduction to ApsaraVideo Player SDK for web - ApsaraVideo VOD

You can integrate ApsaraVideo Player SDK for web into your web applications. The software development kit (SDK) provides video playback for live streaming and video-on-demand (VOD) scenarios. This topic describes the features of ApsaraVideo Player SDK for web and its browser compatibility.

Overview

ApsaraVideo Player SDK for web uses the <video> tag of HTML5 (H5) to play videos in web applications. The SDK is compatible with multiple browsers, such as Chrome and Safari, to ensure consistent video playback across various platforms. When used with ApsaraVideo Live and ApsaraVideo VOD, ApsaraVideo Player SDK for web also supports features such as hotlink protection, encrypted playback for copyrighted videos, and quality monitoring.

License upgrade

Starting December 1, 2024, you must obtain a license to use ApsaraVideo Player SDK for web V2.28.0 and later. For instructions, see Manage licenses. If you use a version earlier than 2.28.0, you are not affected by this change. However, we recommend that you upgrade to the latest version to receive more comprehensive services and support.

Supported protocols

VOD scenarios

The following table describes the VOD playback protocols and encoding formats supported by the ApsaraVideo Player SDK for web.

Video encoding format	Video protocol	Audio file format	Audio coding format
H.264	MP4 FLV HLS	MP3	AAC
H.265 Note To play H.265-encoded video streams, you must first fill out a form to apply for a license. Some browsers do not support H.265 video playback. Enabling H.265 video playback increases traffic consumption and startup latency.	MP4 FLV HLS	-
H.266 Note To play H.266-encoded video streams, you must first fill out a form to apply for a license. Some browsers do not support H.266 video playback. Enabling H.266 video playback increases traffic consumption and startup latency.	MP4	-

Live streaming scenarios

The following table describes the live streaming playback protocols and encoding formats supported by the ApsaraVideo Player SDK for web.

Video encoding format	Video protocol	Audio coding format	Audio file format
H.264	HLS, FLV, RTS, DASH	AAC	-
H.265	HLS, FLV (codecId=12)
H.266	HLS, FLV

The following table describes the benefits and limits of each live streaming protocol.

Live streaming protocol	Advantage	Disadvantage	Latency
HLS	High browser compatibility.	High latency.	> 10s
FLV	Supports high-concurrency scenarios and is more suitable for native apps.	Browsers must be integrated with ApsaraVideo Player SDK for web for playback.	1s to 3s
RTS	Performs well in poor network conditions. Videos can be played smoothly even with a packet loss rate of 30%.	Browsers must be integrated with ApsaraVideo Player SDK for web for playback.	< 1s
DASH	Adaptive bitrate.	High latency.	> 10s

Browser compatibility

Desktop browser compatibility

Important

To play FLV and HLS videos on desktop browsers, you must enable cross-domain access.

Browser	MP4	FLV	HLS	MP3
Chrome	✓	34 and later	34 and later	✓
Firefox	✓	49 and later	49 and later	✓
Edge	✓	✓	✓	✓
Opera	✓	✓	✓	✓
Safari	✓	8 and later	8 and later	✓

Mobile browser compatibility

Note

ApsaraVideo Player SDK for web does not support FLV video playback on mobile devices.

Table 1. H5 browser compatibility on Android

Browser	HLS	MP4	MP3	FLV
Chrome	34 and later	✓	✓	×
Firefox	49 and later
WeChat	✓
Edge	✓
Opera	✓

Table 2. H5 browser compatibility on iOS

Browser	HLS	MP4	MP3	FLV
Chrome	34 and later	✓	✓	×
Firefox	49 and later
WeChat	✓
Edge	✓
Opera	✓
Safari	8 and later

Feature compatibility

Feature	Desktop	Mobile	How to set
Full-screen playback	By default, videos are not played in full screen.	By default, videos are played in full screen. Different settings are required for different scenarios. Note You cannot disable automatic full-screen playback in Safari on devices with iOS versions earlier than 10. When playing videos in non-full-screen mode, adjust the video size based on the aspect ratio of the transcoded video resolution to avoid black bars.	Full-screen settings
Autoplay	The restriction comes from the browser, not from ApsaraVideo Player SDK for web. Autoplay is restricted in Safari 11 and later on macOS High Sierra. Autoplay is restricted in Chrome 55 and later.	Disabled by default. Special settings are required to enable it. Note Some browsers and WebViews may allow autoplay. This is common in Android systems.	Autoplay
Volume adjustment	Supported	Because the `video.volume` property is read-only in iOS and some Android systems, the `getVolume` and `setVolume` methods provided by ApsaraVideo Player SDK for web do not work on iOS and some Android systems.	Volume adjustment
Playback speed	Supported	Some mobile browsers do not support playback speed adjustment, such as WeChat on Android.	Playback speed
HLS standard encrypted video playback	Chrome FireFox Safari Edge	Supported	How to play an encrypted video
Alibaba Cloud proprietary HLS encryption Note For security reasons, Alibaba Cloud proprietary cryptography does not support debugging with real encrypted videos.	Chrome FireFox Safari Edge Note Some third-party browsers forcibly hijack the player. This disables Alibaba Cloud proprietary cryptography and causes playback failure. In this case, use HLS standard encryption or DRM encryption.	Supported on browsers in iOS 14 and later. Note To enable support for iOS versions earlier than 17.1, you must deploy an additional player plugin script. This script is applicable only to the Safari browser. Other browsers, such as WeChat, DingTalk, and QQ Browser, cannot be used due to system limitations. You can guide users to play the video in the Safari browser. For more information, see Deployment instructions for the proprietary encryption plugin on iOS versions earlier than 17.1. Supported on most browsers on the Android platform. Note Because some browsers hijack video playback, the following browsers are known to not support playback of videos that are encrypted with Alibaba Cloud proprietary cryptography: UC Browser, Quark, and Baidu. You can guide users to play the videos in other browsers.	How to play an encrypted video
Playback of DRM-encrypted live streams	Windows Chrome Opera FireFox Edge macOS Chrome Safari FireFox Opera Edge	iOS Chrome Safari Android Chrome on Android 10 and later Edge	How to play an encrypted video
Playback of DRM-encrypted VOD streams	Windows Chrome Opera FireFox Edge macOS Chrome Safari FireFox Opera Edge	iOS Chrome Safari Android Chrome on Android 10 and later Edge	How to play an encrypted video