集成微短剧方案-iOS

本文介绍iOS端集成微短剧项目的操作步骤。

源码说明

源码下载

如需获取源码详情,请提交方案咨询

环境要求

类别

要求

开发环境

Xcode 14.0 及以上版本,推荐使用最新正式版本。

系统版本

iOS 9.0以上版本的真机。

CocoaPods

CocoaPods 1.9.3 及以上版本。

前提条件

您已获取音视频终端SDK的播放器的License授权证书和License Key,获取的详细步骤请参见申请License8DCDA3B8-4BF9-43FD-A91D-4CEB8A5A5C93.png

跑通Demo

  1. 获取Demo源码后,进入Example目录。

  2. 打开Podfile文件,将播放器SDK的依赖版本更新为最新版本。版本号请参见iOS播放器SDK

  3. 进入Example目录,执行pod install --repo-update,自动安装所需的SDK依赖。

  4. 打开工程文件AlivcPlayerDemo.xcworkspace,在Signing & Capabilities中修改Team和Bundle Identifier。

    1. Team是用户添加的开发者Apple ID。

    2. Bundle Identifier也就是包id。

    image

  5. 将上述步骤中获取的License授权证书放到Example/目录下,并修改文件名为license.crt。并打开Example/Info.plist文件,在字段AlivcLicenseKey的值中填写在上述步骤中获取的LicenseKey。

  6. 在真机上编译并运行Demo。

集成组件

以下是 AUIShortVideoList 组件的使用方法及其对外接口的详细介绍,旨在实现短视频列表播放功能。

集成准备

  1. 接入已授权播放器的音视频终端SDK License。

    具体操作,请参见iOS端接入License

  2. 将AUIFoundationAUI基础组件、AUIShortVideoList短视频列表基础播放组件、AUIPlayer.podspec框架配置文件三个模块拷贝到您项目工程中。

  3. 配置Podfile。

    # Pod Example
    install! 'cocoapods', :deterministic_uuids => false
    source 'https://github.com/CocoaPods/Specs.git'
    
    platform :ios, '9.0'
    
    target 'Your ProjectName' do
      # 选取的SDK类型
      # 播放器SDK及版本,建议使用最新版本,详情参考官网:https://help.aliyun.com/zh/vod/developer-reference/release-notes-for-apsaravideo-player-sdk-for-ios
      pod "AUIPlayer/AliPlayerSDK_iOS", :path => "../"
      # 您可以根据自己的业务去调整使用的SDK,增加自己要使用的SDK;或者修改 AUIPlayer.podspec 中 AliPlayerSDK_iOS 版本
    #  pod "AUIPlayer/AliVCSDK_Standard", :path => "../"
      
      # AUI基础组件(必需)
      pod "AUIFoundation/All", :path => "../AUIBaseKits/AUIFoundation"
    
      # 短剧列表播放组件
      pod "AUIPlayer/AUIPlayerKits", :path => "../"
      
      # 可自定义第三方库版本
      pod 'SDWebImage', '5.18.1'
    end
    
    post_install do |installer|
      installer.pods_project.build_configurations.each do |config|
          config.build_settings['CLANG_WARN_DOCUMENTATION_COMMENTS'] = 'NO'
          config.build_settings['CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER'] = 'NO'
      end
    end

    请根据您项目中实际存放依赖库的路径进行相应修改。

    说明

    如果您项目中所使用的第三方库版本与当前源码依赖的版本存在冲突,请以项目中所使用的版本为准。

  4. 项目配置。

    如果您的项目是Swift工程,并且需要使用Objective-C的第三方库,您必须在项目的Build Settings中配置Bridging Header,以确保Swift能够正确访问并使用AUIShortVideoList模块中的Objective-C的接口。

    • 设置Bridging Header。

      在项目的 Build Settings 中找到 SWIFT_OBJC_BRIDGING_HEADER 设置,并将其指向您的桥接头文件。示例路径如下:

      <YourProjectName>/<YourProjectName>-Bridge-Header.h
    • 引入Objective-C接口。

      在桥接头文件中,确保引入需要暴露给 Swift 的 Objective-C 接口,示例如下:

      #import "AUIShortVideoList.h"

      您可以参考AUIShortVideoList模块中的AUIPlayer-Bridging-Header.h文件,获取更多示例和指导。

  5. 编译与运行。

    完成配置后,请编译并运行项目,以确保AUIShortVideoList组件已被正确集成。

在完成AUIShortVideoList组件的集成准备后,您可以直接将以下代码复制到项目中以进行使用。

使用方法

以下提供两种方式,来初始化和推送AUIShortVideoListViewController,以便快速实现功能运行:

  • 使用UINavigationController进行跳转。

    Objective-C示例

    // 创建视频信息数组
    NSArray<AUIShortVideoInfo *> *videoInfoList = [[NSArray alloc] init];
    // 初始化 AUIShortVideoListViewController,传入视频数据
    AUIShortVideoListViewController *vc = [[AUIShortVideoListViewController alloc] initWithData:videoInfoList];
    // 使用 UINavigationController 推送新视图控制器
    [self.navigationController pushViewController:vc animated:YES];

    Swift示例

    // 创建视频信息数组
    let info = Array<AUIShortVideoInfo>() // 添加数据源
    // 初始化 AUIShortVideoListViewController,传入视频数据
    let vc = AUIShortVideoListViewController(data: info)
    // 使用 UINavigationController 推送新视图控制器
    self.navigationController?.pushViewController(vc, animated: true)
  • 使用模态(Modal)跳转。

    Objective-C示例

    // 创建视频信息数组
    NSArray<AUIShortVideoInfo *> *videoInfoList = [[NSArray alloc] init];
    // 初始化 AUIShortVideoListViewController,传入视频数据
    AUIShortVideoListViewController *vc = [[AUIShortVideoListViewController alloc] initWithData:videoInfoList];
    // 设置模态展示样式(可选)
    vc.modalPresentationStyle = UIModalPresentationFullScreen;
    // 以模态方式展示新视图控制器
    [self presentViewController:vc animated:YES completion:nil];

    Swift示例

    // 创建视频信息数组
    let info = Array<AUIShortVideoInfo>() // 添加数据源
    // 初始化 AUIShortVideoListViewController,传入视频数据
    let vc = AUIShortVideoListViewController(data: info)
    // 设置模态展示样式
    vc.modalPresentationStyle = .fullScreen // 可选,根据需求设置样式
    // 以模态方式展示新视图控制器
    self.present(vc, animated: true, completion: nil)

您还可以通过实现AUIShortVideoDataProviderDelegate委托来注册数据回调,从而自定义加载视频数据。

获取数据

数据结构

AUIShortVideoList 组件使用的数据结构为NSArray<AUIShortVideoInfo *>,其中AUIShortVideoInfo为存储视频信息的数据类,其数据结构如下:

字段

类型

释义

备注

videoId

int

视频唯一id

用于唯一标识每一个视频。

url

String

视频源地址

您可以自定义视频源格式,如MP4/M3U8等。

coverUrl

String

视频封面图

author

String

视频作者

title

String

视频标题

type

String

视频类型

参考VideoType枚举,视频源或者广告。

组件初始化

为了确保AUIShortVideoList组件正常运行,请在初始化AUIShortVideoListViewController 时,传入 NSArray<AUIShortVideoInfo *>数据源。以下是示例代码:

Objective-C示例

// 在当前视图控制器中创建视频信息数组并初始化控制器
NSArray<AUIShortVideoInfo *> *videoInfoList = [[NSArray alloc] init];
AUIShortVideoListViewController *vc = [[AUIShortVideoListViewController alloc] initWithData:videoInfoList];
// 使用 UINavigationController 推送新视图控制器
[self.navigationController pushViewController:vc animated:YES];

Swift示例

// 在当前视图控制器中创建视频信息数组并初始化控制器
let info = [AUIShortVideoInfo]() // 添加数据源
let vc = AUIShortVideoListViewController(data: info)
// 使用 UINavigationController 推送新视图控制器
self.navigationController?.pushViewController(vc, animated: true)

自定义数据加载

除了直接传递数据数组,您也可以通过实现AUIShortVideoDataProviderDelegate协议来自定义数据加载:

  • 通过代理初始化组件(建议在初始化时实现数据代理)

    Objective-C示例

    // 在当前视图控制器中初始化控制器,传入数据提供者
    AUIShortVideoListViewController *videoListVC = [[AUIShortVideoListViewController alloc] initWithDataProvider:self];
    // 使用 UINavigationController 推送新视图控制器
    [self.navigationController pushViewController:videoListVC animated:YES];

    Swift示例

    // 在当前视图控制器中初始化控制器,传入数据提供者
    let videoListVC = AUIShortVideoListViewController(dataProvider: self)
    // 使用 UINavigationController 推送新视图控制器
    self.navigationController?.pushViewController(videoListVC, animated: true)
  • 实现AUIShortVideoDataProviderDelegate协议,以自定义数据加载和刷新:

    @protocol AUIShortVideoDataProviderDelegate <NSObject>
    @required
    - (void)loadData:(id _Nullable)controller; //加载数据
    @optional
    - (void)refreshData:(id _Nullable)controller;//刷新数据(可选)
    @end    

更新数据列表

当获取到视频数据后,使用以下接口更新ViewController中的数据列表:

追加数据
/**
* @brief 将新的视频数据追加到当前视频列表中。
*
* @param videoInfoList 新的视频数据列表,可以为空。
*                      当提供的数据列表不为空时,这些数据将被追加到现有的视频列表的末尾。
*                      如果提供为空的数据列表,则不对当前列表进行任何修改。
*/
- (void)appendVideoInfoList:(NSArray<AUIShortVideoInfo *> * _Nullable)videoInfoList;
重置数据
/**
* @brief 重置当前的视频列表为指定的新视频数据列表。
*
* @param videoInfoList 新的视频数据列表,可以为空。
*                      将当前的视频列表替换为提供的数据列表。
*                      如果提供为空的数据列表,将清空当前视频列表。
*/
- (void)resetVideoInfoList:(NSArray<AUIShortVideoInfo *> * _Nullable)videoInfoList;

获取数据示例

您可以通过网络请求和数据转换两种方式来获取NSArray<AUIShortVideoInfo *>数据源,示例如下:

  • 网络请求

    Objective-C示例

    //请求额外数据 AUIShortVideoListConstants.defaultVideoInfoListURL 为请求URL ,您可以尝试将其替换为自己的请求地址URL
    - (void)loadData:(id)controller {
        __weak typeof(self) weakSelf = self;  // 弱引用 self
        [AUIShortVideoListDataManager requestVideoInfoList:AUIShortVideoListConstants.defaultVideoInfoListURL completed:^(NSArray<AUIShortVideoInfo *> * _Nullable data, NSError * _Nullable error) {
            if (error) {
                __strong typeof(weakSelf) strongSelf = weakSelf; // 强引用 self
                [AVToastView show:[NSString stringWithFormat:@"Unable to retrieve short video list, error: %@", error.localizedDescription]
                            view:strongSelf.view
                        position:AVToastViewPositionMid];
                return;
            }
    
            // 调用相应子视图控制器的 appendVideoInfoList: 方法
            if (controller && [controller respondsToSelector:@selector(appendVideoInfoList:)]) {
                [controller appendVideoInfoList:data];
            }
        }];
    }

    Swift示例

    // 请求额外数据 AUIShortVideoListConstants.defaultVideoInfoListURL 为请求URL ,您可以尝试将其替换为自己的请求地址URL
    func loadData(_ controller: Any?) {
        weak var weakSelf = self  // Weak reference to self
        AUIShortVideoListDataManager.requestVideoInfoList(AUIShortVideoListConstants.defaultVideoInfoListURL) { (data: [AUIShortVideoInfo]?, error: Error?) in
            if let error = error {
                guard let strongSelf = weakSelf else { return } // Strong reference to self
                AVToastView.show("Unable to retrieve short video list, error: \(error.localizedDescription)", view: strongSelf.view, position: .mid)
                return
            }
    
            if let myController = controller as? AUIShortVideoListViewController {
                // 成功转型,使用 myController
                if  myController.responds(to: #selector(myController.appendVideoInfoList(_:))) {
                    myController.appendVideoInfoList(data)
                }
            }
        }
    }
  • 数据转换

    Objective-C示例

    // 将字典数组转换为视频信息模型数组
    NSArray<NSDictionary *> *responseArray = (NSArray<NSDictionary *> *)responseObject;
    NSMutableArray<AUIShortVideoInfo *> *videoInfoArray = [NSMutableArray arrayWithCapacity:responseArray.count];
    for (NSDictionary *dict in responseArray) {
        // 初始化 AUIShortVideoInfo 模型对象并添加到数组中
        AUIShortVideoInfo *videoInfo = [[AUIShortVideoInfo alloc] initWithDict:dict];
        [videoInfoArray addObject:videoInfo];
    }

    Swift示例

    let responseArray = responseObject as? [[AnyHashable : Any]]
    var videoInfoArray = [AnyHashable](repeating: 0, count: responseArray?.count ?? 0) as? [AUIShortVideoInfo]
    for dict in responseArray ?? [:] {
        guard let dict = dict as? [AnyHashable : Any] else {
                continue
        }
        // 初始化 AUIShortVideoInfo 模型对象并添加到数组中
        let videoInfo = AUIShortVideoInfo(dict: dict)
        videoInfoArray?.append(videoInfo)
    }

集成FAQ

播放黑屏等异常情况

请检查您的SDK License配置,详情请参见iOS端接入License

编译运行出现报错

如果您的项目中已包含相同的第三方库,请调整AUIPlayer.podspec文件中该第三方库的版本,以确保兼容性并避免发生冲突。

错误“Sandbox: rsync.samba(56557) deny(1) file-read-data”

配置BuildSetting中的Use Script SandBoxing为NO。

搭建场景

AUIShortVideoList组件支持低代码集成,适用于多种场景。您可以基于此组件构建短视频列表的场景化功能。请参考AUIPlayerScenes中的示例,例如AUIShortDramaList(短剧剧场场景化模块)和 AUIShortDramaFeeds(短剧Feeds流场景化模块)。

短剧剧场场景

概述

AUIShortDramaList是短剧剧场场景化模块,基于AUIShortVideoList组件实现。模块提供了剧场详情页和推荐页,并且支持一二级页面嵌套和播放器实例共享。

场景集成

说明

在进行短剧剧场场景搭建之前,请确保已完成AUIShortVideoList组件的集成准备。

  1. 将AUIShortDramaList模块拷贝到您项目工程中。

  2. 配置Podfile。

    在项目的Podfile中添加对AUIShortDramaList模块的引用和依赖。示例配置如下:

    # Pod Example
    install! 'cocoapods', :deterministic_uuids => false
    source 'https://github.com/CocoaPods/Specs.git'
     
    platform :ios, '9.0'
     
    target 'Your ProjectName' do
       
    # 短剧场景(包含剧场/Feed流)两个模块,可单独集成。
    pod "AUIPlayer/AUIPlayerScenes", :path => "../"
    # 短剧剧场场景
    # pod "AUIPlayer/AUIPlayerScenes/AUIShortDramaList", :path => "../"
    end
     
    post_install do |installer|
      installer.pods_project.build_configurations.each do |config|
          config.build_settings['CLANG_WARN_DOCUMENTATION_COMMENTS'] = 'NO'
          config.build_settings['CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER'] = 'NO'
      end
    end

    请根据您项目中实际存放依赖库的路径进行相应修改。

    说明

    如果您项目中所使用的第三方库版本与AUIShortDramaList源码依赖的版本存在冲突,请以项目中所使用的版本为准。

  3. 项目配置。

    如果您的项目是Swift工程,并且需要使用Objective-C的第三方库,您必须在项目的Build Settings中配置Bridging Header,以确保Swift能够正确访问并使用AUIShortDramaList模块中的Objective-C的接口。

    • 设置Bridging Header。

      在项目的 Build Settings 中找到 SWIFT_OBJC_BRIDGING_HEADER 设置,并将其指向您的桥接头文件。示例路径如下:

      <YourProjectName>/<YourProjectName>-Bridge-Header.h
    • 引入Objective-C接口。

      在桥接头文件中,确保引入需要暴露给 Swift 的 Objective-C 接口,示例如下:

      #import "AUIShortDramaList.h"

      您可以参考AUIShortVideoList模块中的AUIPlayer-Bridging-Header.h文件,获取更多示例和指导。

  4. 编译与运行。

    完成配置后,请编译并运行项目,以确保AUIShortDramaList组件已被正确集成。

使用方法

您可以将短剧剧场ViewController页面直接提供给外部进行跳转,具体调用逻辑可参考以下示例。

Objective-C示例

- (void)openShortDramaList {
    AUIShortDramaListViewController *vc = [[AUIShortDramaListViewController alloc] init];
    [self.navigationController pushViewController:vc animated:YES];
}

Swift示例

func openShortDramaList() {
    let vc = AUIShortDramaListViewController()
    navigationController?.pushViewController(vc, animated: true)
}

获取数据

AUIShortDramaList 模块使用的数据结构为NSMutableArray<AUIShortDramaInfo *>,其中 AUIShortDramaInfo 为存储短剧剧集的数据类,其数据结构如下:

字段

类型

释义

备注

dramaId

NSInteger

剧集唯一id

title

NSString *

剧集标题

cover

NSString *

剧集封面

firstDrama

AUIShortVideoInfo *

剧集首集

firstDrama为 dramas 中的第一集

dramas

NSMutableArray<AUIShortVideoInfo *> *

剧集列表

可作为 AUIShortVideoList 模块的数据源

您可以通过网络请求或数据转换这两种方式,获取最终的NSMutableArray<AUIShortDramaInfo *>数据源:

  • AUIShortDramaListViewController代码中提供了获取数据的代码示例。该类实现了 AUIShortVideoDataProviderDelegate数据请求代理接口,提供了以下两种主要方法:

    @protocol AUIShortVideoDataProviderDelegate <NSObject>
    @required
    - (void)loadData:(id _Nullable)controller; //加载数据
    @optional
    - (void)refreshData:(id _Nullable)controller; // 刷新数据(可选)
    @end
  • 通过AUIShortDramaListDataManager中提供的requestDramaInfoList方法进行网络请求,以获取最终的NSMutableArray<AUIShortDramaInfo *>数据源。获取的数据会存储在内部的dramaInfoList对象中,用于后续的视图展示和处理。

短剧Feeds流场景

概述

AUIShortDramaFeeds是短剧 Feeds 流场景化模块,基于AUIShortVideoList组件实现。模块提供了Feeds流TAB页,支持TAB页嵌套以及上下左右滑动播放,实现了播放器实例共享。

场景集成

说明

在进行短剧 Feeds 流场景搭建之前,请确保已完成AUIFoundation基础组建和AUIShortVideoList组件的集成准备。

  1. 将AUIShortDramaFeeds模块拷贝到您项目工程中。

  2. 配置Podfile。

    在项目的Podfile中添加对AUIShortDramaFeeds模块的引用和依赖。示例配置如下:

    # Pod Example
    install! 'cocoapods', :deterministic_uuids => false
    source 'https://github.com/CocoaPods/Specs.git'
     
    platform :ios, '9.0'
     
    target 'Your ProjectName' do
       
    # 短剧场景(包含剧场/Feed流)两个模块,可单独集成。
    pod "AUIPlayer/AUIPlayerScenes", :path => "../"
    # 短剧Feeds流场景
    # pod "AUIPlayer/AUIPlayerScenes/AUIShortDramaFeeds", :path => "../"
    end
     
    post_install do |installer|
      installer.pods_project.build_configurations.each do |config|
          config.build_settings['CLANG_WARN_DOCUMENTATION_COMMENTS'] = 'NO'
          config.build_settings['CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER'] = 'NO'
      end
    end

    请根据您项目中实际存放依赖库的路径进行相应修改。

    说明

    如果您项目中所使用的第三方库版本与AUIShortDramaFeeds源码依赖的版本存在冲突,请以项目中所使用的版本为准。

  3. 项目配置。

    如果您的项目是Swift工程,并且需要使用Objective-C的第三方库,您必须在项目的Build Settings中配置Bridging Header,以确保Swift能够正确访问并使用AUIShortDramaFeeds模块中的Objective-C的接口。

    • 设置Bridging Header。

      在项目的 Build Settings 中找到 SWIFT_OBJC_BRIDGING_HEADER 设置,并将其指向您的桥接头文件。示例路径如下:

      <YourProjectName>/<YourProjectName>-Bridge-Header.h
    • 引入Objective-C接口。

      在桥接头文件中,确保引入需要暴露给 Swift 的 Objective-C 接口,示例如下:

      #import "AUIShortDramaFeeds.h"

      您可以参考AUIShortVideoList模块中的AUIPlayer-Bridging-Header.h文件,获取更多示例和指导。

  4. 编译与运行。

    完成配置后,请编译并运行项目,以确保AUIShortDramaFeeds组件已被正确集成。

使用方法

您可以将短剧Feeds流ViewController页面直接提供给外部进行跳转,具体调用逻辑可参考以下示例。

Objective-C示例

- (void)openShortDramaFeeds {
    AUIShortDramaFeedsViewController *vc = [[AUIShortDramaFeedsViewController alloc] init];
    [self.navigationController pushViewController:vc animated:YES];
}

Swift示例

func openShortDramaFeeds() {
    let vc = AUIShortDramaFeedsViewController()
    navigationController?.pushViewController(vc, animated: true)
}

获取数据

AUIShortDramaFeeds 模块使用的数据结构为NSArray<AUIShortVideoInfo *>,其中 AUIShortVideoInfo 为存储视频信息的数据类该数组包含多个 AUIShortVideoInfo 实例,每个实例代表一个视频的信息。如需了解更详细的内容,建议查阅 AUIShortVideoList 组件的完整文档。

核心功能介绍

本组件功能使用阿里云播放器SDK,通过多个播放器实例(AliPlayer)+ 预加载(MediaLoader)+ 预渲染的方式进行实现,使用了预加载、预渲染、HTTPDNS、加密播放等核心能力,在播放延迟、播放稳定性及安全性方面大幅提升观看体验。具体介绍参考进阶功能

预加载

通过滑动窗口策略,动态启停视频的预加载任务。SDK底层基于网络状态智能调节任务优先级,以确保正播放视频和即将播放视频可以获得更多的网络资源,显著提升视频秒开率,减少播放卡顿。即使在快速滑动视频时,仍然可以获得流畅的播放体验。更多信息,请参见预加载

预渲染

使用预渲染的方式,在后台提前渲染后续视频的首帧,减少黑屏的出现,让播放更加丝滑。音视频终端 SDK和播放器SDK从6.16.0版本开始增添了对强制预渲染功能的支持。更多信息,请参见预渲染

多实例播放器池

实现了全局共享的播放器实例池,可以灵活配置实例数。通过优化 API 调用和线程资源管控,确保在线程管理、CPU利用、内存占用等方面达到性能最优、资源最省,使性能和体验达到最佳平衡。通过性能优化,减少了滑动过程中的耗时操作,减少滑动卡顿,让播放体验更加丝滑。

HTTPDNS

HTTPDNS可以提供更快速和稳定的DNS解析服务,通过替换传统DNS解析,可以减少DNS解析时间,提高视频播放的加载速度和稳定性,从而提升用户的观看体验。音视频终端SDK和播放器SDK从6.12.0版本开始无需手动开启HTTPDNS。更多信息,请参见HTTPDNS

视频加密

微短剧场景的视频通常为1~3分钟的MP4格式视频,音视频终端SDK和播放器SDK从6.8.0版本开始支持MP4私有加密播放能力,为微短剧场景的视频提供安全保障支撑。更多信息,请参见阿里云视频加密(私有加密)

经私有加密的MP4格式视频,需满足以下条件,才可正常播放:

  • 经私有加密的MP4视频传给播放器播放时,业务侧(App侧)需要为视频URL追加etavirp_nuyila=1,例如:原视频URL为https://example.aliyundoc.com/test.mp4,则需要传给播放器播放的视频URL为https://example.aliyundoc.com/test.mp4?etavirp_nuyila=1

  • App的License对应的uid与产生私有加密MP4的uid是一致的。

如何校验私有加密视频是否正确,以私有加密的视频URL为例说明如下:

  • meta信息里面应带有AliyunPrivateKeyUri的tag。

  • ffplay不能直接播放。

H265自适应播放

当播放H265流硬解失败且已设置H264备流时,实现自动降级播放H264备流;若未设置H264备流,则自动降级为H265软解播放。更多信息,请参见H265自适应播放

自适应ABR

播放器SDK支持多码率自适应HLS、DASH视频流,通过调用播放器的selectTrack方法切换播放的码流,可以实现网络自适应切换视频清晰度的功能。更多信息,请参见自网络自适应切换