ApsaraVideo VOD:Quick start

Step 1: Add the player view

In your ViewController, create an AliPlayerView and add it to your view hierarchy:

AliPlayerView *playerView = [[AliPlayerView alloc] initWithFrame:self.view.bounds];
[self.view addSubview:playerView];

let playerView = AliPlayerView(frame: view.bounds)
view.addSubview(playerView)

You can place the AliPlayerView anywhere in your view hierarchy and set its frame as needed. If you enable full-screen switching, the component automatically handles view hierarchy adjustments.

Step 2: Bind the controller and play

In your ViewController, create the controller, configure the data, and attach the view:

1. Create AliPlayerController.

2. Configure AliPlayerModel (you can use the recommended VidAuth method or the URL source for quick testing).

3. Call configure: and attach:.

4. In dealloc, call destroy to release resources.

#import <AliPlayerKit/AliPlayerKit.h>

@interface VideoPlayerViewController ()
@property (nonatomic, strong) AliPlayerView *playerView;
@property (nonatomic, strong) AliPlayerController *controller;
@end

@implementation VideoPlayerViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    // 1. Create the player view
    self.playerView = [[AliPlayerView alloc] initWithFrame:self.view.bounds];
    [self.view addSubview:self.playerView];

    // 2. Create the player controller
    self.controller = [[AliPlayerController alloc] init];

    // 3. Configure the playback data (VidAuth is recommended)
    VideoSource *source = [VideoSource vidAuthSourceWithVid:@"your_video_id"
                                                  playAuth:@"your_playback_credential"];
    AliPlayerModel *model = [[AliPlayerModel alloc] initWithVideoSource:source];
    model.videoTitle = @"Sample Video";

    // 4. Configure the source and attach the view (playback starts automatically after attachment)
    [self.controller configure:model];
    [self.playerView attach:self.controller];
}

- (void)dealloc {
    // Destroy the player to release resources
    [self.controller destroy];
}

@end

import AliPlayerKit

class VideoPlayerViewController: UIViewController {

    private let playerView = AliPlayerView(frame: .zero)
    private let controller = AliPlayerController()

    override func viewDidLoad() {
        super.viewDidLoad()

        // 1. Create the player view
        playerView.frame = view.bounds
        view.addSubview(playerView)

        // 2. Configure the playback data (VidAuth is recommended)
        let source = VideoSource.vidAuthSource(withVid: "your_video_id", playAuth: "your_playback_credential")
        let model = AliPlayerModel(videoSource: source)
        model.videoTitle = "Sample Video"

        // 3. Configure the source and attach the view (playback starts automatically after attachment)
        controller.configure(model)
        playerView.attach(controller)
    }

    deinit {
        // Destroy the player to release resources
        controller.destroy()
    }
}

VideoSource *source = [VideoSource urlSourceWithUrl:@"https://example.com/video.mp4"];

Step 3 (Optional): Handle the back button

If you need to customize the player's back button behavior, you can use the onBackPressed callback:

__weak typeof(self) weakSelf = self;
self.playerView.onBackPressed = ^{
    [weakSelf.navigationController popViewControllerAnimated:YES];
};

playerView.onBackPressed = { [weak self] in
    self?.navigationController?.popViewController(animated: true)
}

This callback is only triggered when the player is not in full-screen mode. In full-screen mode, the back button exits full-screen instead. If you do not set this callback, the player attempts a default navigation action (pop or dismiss) via the responder chain.

Step 4 (Optional): Custom configuration

To inject custom SDK configurations, such as the buffering strategy and Referer, before the player is ready, use onPlayerConfigBlock:

model.onPlayerConfigBlock = ^(id<MediaPlayer> player) {
    // Executed before `prepare`. You can access the underlying player instance for custom configuration.
    // For example, set the buffering strategy, Referer, or use `setOption`.
};

model.onPlayerConfigBlock = { player in
    // Executed before `prepare`. You can access the underlying player instance for custom configuration.
}

Step 1: Select a scene module

Scene modules, located in the PlayerKitScenes directory, are imported via CocoaPods subspecs. The available modules include:

Step 2: Launch the scene page

After integrating a scene module, you can launch the corresponding scene page in one of two ways:

Method 1: Direct instantiation (recommended)

Each scene module provides an independent ViewController, which can be directly instantiated and navigated to via UINavigationController :

#import "SceneLongVideoViewController.h"

// Navigate to the long-form video scene
SceneLongVideoViewController *vc = [[SceneLongVideoViewController alloc] init];
[self.navigationController pushViewController:vc animated:YES];

// Navigate to the long-form video scene
let vc = SceneLongVideoViewController()
navigationController?.pushViewController(vc, animated: true)

The corresponding ViewController for each scene is as follows:

Method 2: Schema routing

The scene module supports starting the corresponding playback scene by using the Schema protocol. The demo project provides the AppSchemaRouter routing utility class, which can automatically discover and navigate to the corresponding scene by using a Schema URL:

#import "AppSchemaRouter.h"

// Navigate to the long-form video scene via schema
[AppSchemaRouter navigateToSchema:@"playerkit://scenes/longvideo" fromViewController:self];

// Navigate to the long-form video scene via schema
AppSchemaRouter.navigate(toSchema: "playerkit://scenes/longvideo", from: self)

The corresponding schema address for each scene is as follows:

Long-form video

SceneLongVideoViewController demonstrates the standard integration process for the component layer:

// Initialize the AliPlayerKit playback components
- (void)setupPlayerKit {
    // 1. Create the player component view
    self.playerView = [[AliPlayerView alloc] initWithFrame:self.view.bounds];
    [self.view addSubview:self.playerView];

    // Optional: Set the back button callback
    __weak typeof(self) weakSelf = self;
    self.playerView.onBackPressed = ^{
        [weakSelf.navigationController popViewControllerAnimated:YES];
    };

    // 2. Create the player component controller
    self.playerController = [[AliPlayerController alloc] init];

    // 3. Configure the player component data
    VideoSource *source = [VideoSource vidAuthSourceWithVid:@"your_video_id" playAuth:@"your_playback_credential"];
    AliPlayerModel *model = [[AliPlayerModel alloc] initWithVideoSource:source];
    model.videoTitle = @"Long Video";

    // 4. Configure the source and attach the controller to the view (playback starts automatically after attachment)
    [self.playerController configure:model];
    [self.playerView attach:self.playerController];
}

Live streaming

SceneLiveViewController demonstrates the usage of the URL source and live streaming scenario type:

VideoSource *source = [VideoSource urlSourceWithUrl:liveUrl];
AliPlayerModel *model = [[AliPlayerModel alloc] initWithVideoSource:source];
model.videoTitle = @"Live Stream";
model.sceneType = SceneTypeLive;  // Set the scene type to live

[self.playerController configure:model];
[self.playerView attach:self.playerController];

Playlist

ScenePlaylistViewController demonstrates an advanced usage of SingletonLifecycleStrategy and PlayerNotificationDelegate to implement continuous playback:

// Use the singleton lifecycle strategy to reuse the player instance
self.lifecycleStrategy = [SingletonLifecycleStrategy sharedInstance];
self.currentController = [[AliPlayerController alloc] initWithLifecycleStrategy:self.lifecycleStrategy];

// Register a notification for playback completion to trigger continuous playback
[self.currentController addNotificationDelegate:self];

// PlayerNotificationDelegate callback
- (void)playerDidCompletion {
    [self playNextVideo];  // The current video finished playing; play the next one automatically
}