教程:播放多天录制的内容Tutorial: Playback of multi-day recordings

本教程是连续视频录制 (CVR) 教程的补充教程。This tutorial builds up on the continuous video recording (CVR) tutorial. 在本教程中,你将了解如何使用 Azure 媒体服务 API 从云端播放多天连续录制的视频内容。In this tutorial, you will learn how to use Azure Media Service APIs to playback a multi-day continuous video recording from the cloud.

对于公共安全等方案,此功能很有用。在这些方案中,需要持续数天(或数周)用摄像机录制内容,且偶尔需要观看录制内容的特定部分。This is useful for scenarios such as public safety, where there is a need to maintain a recording of the footage from a camera for multiple days (or weeks), and there is an occasional need to watch specific portions of that footage.

本教程介绍如何:The tutorial shows you how to:

  • 运行示例应用,了解如何浏览多天录制的内容Run the sample app that demonstrates how you can browse the contents of a multi-day recording
  • 查看相应录制内容的选定部分View selected portions of that recording

建议的读前准备Suggested pre-reading

建议通读以下文档页:It is recommended that you read through the following documentation pages:


  • 完成 CVR 教程Complete the CVR tutorial. 尽管本教程和教程:连续视频录制中讨论的相关 API 适用于 5 分钟或更长时间的录制,但建议录制 5 个小时甚至更长时间的视频。While this tutorial and the relevant APIs discussed in Tutorial: Continuous video recording apply to recordings that are 5 minutes or longer, it is recommended that you record 5 hours worth of video, if not more. 长时间的录制可以最好地演示用于浏览录制内容的 API。The APIs used to browse recordings are best demonstrated with long recordings.
  • 建议在教程:连续视频录制仍在运行的时候,运行本教程,也就是说,仍然在云中录制视频。We recommend that you run this tutorial while the Tutorial: Continuous video recording is still running – that is, you are still recording video to the cloud.

运行示例Run the sample

CVR 教程期间将创建媒体服务帐户。As part of the CVR tutorial, you would have created a Media Service account. 对于本教程,需要具有对该帐户的完整 API 访问权限。For this tutorial, you will need to have complete API access to that account. 可以按照获取访问媒体服务 API 的凭据中的步骤来创建服务主体。You can use the steps in Get credentials to access Media Services API to create a service principal. 应能够从 Azure 门户获取如下所示的 JSON 块:You should be able to get a JSON block from the Azure portal that looks like this:

    "AadClientId": "<<INSERT_AZURE_AD_APP_ID_HERE>>",
    "AadTenantDomain": "<<YOUR_TENANT_DOMAIN>>",
    "AadTenantId": "<<YOUR_TENANT_ID>>",
    "AccountName": "<<YOUR_ACCOUNT_NAME>>",
    "Location": "<<YOUR_REGION_NAME>>",
    "ResourceGroup": "<<YOUR_RESOURCE_GROUP>>",
    "SubscriptionId": "<<YOUR_SUBSCRIPTION_ID>>",
    "ArmAadAudience": "https://management.core.chinacloudapi.cn",
    "ArmEndpoint": "https://management.chinacloudapi.cn"

接下来,在 Visual Studio 代码中,打开 src/ams-asset-player。Next, in Visual Studio code, open src/ams-asset-player. 该文件夹包含本教程所需的文件。This folder contains the necessary files for this tutorial. 打开 appsettings.json 文件,然后将其内容复制到新文件 appsettings.development.json 中。Open the appsettings.json file, and copy its contents into a new file, appsettings.development.json. 对新创建的 appsettings.development.json 进行以下编辑:Make the following edits to the newly created appsettings.development.json:

  "AMS" : {
    "subscriptionId" : "Use value of SubscriptionId above",
    "resourceGroup" : "Use value of ResourceGroup above",
    "accountId" : "Use value of AccountName above",
    "aadTenantId" : "Use value of AadTenantId above",
    "aadClientId" : "Use value of AadClientId above",
    "aadSecret" : "Use value of AadSecret above"
  1. 在 Visual Studio Code 中,打开“扩展”选项卡(或按 Ctrl+Shift+X),然后搜索“Azure IoT 中心”。In Visual Studio Code, open the Extensions tab (or press Ctrl+Shift+X) and search for Azure IoT Hub.

  2. 右键单击并选择“扩展设置”。Right click and select Extension Settings.


  3. 搜索并启用“显示详细消息”。Search and enable "Show Verbose Message".


  4. 单击左侧的“运行”图标(或按 Ctrl+Shift+D),以打开要运行的可用应用程序:Click the Run icon on the left (or Ctrl+Shift+D) to bring up the available applications to run:

    显示在 Visual Studio Code 中选择了运行项的菜单的屏幕截图。

  5. 从下拉框中选择 AMS 资产播放器应用程序,如下所示,然后按 F5 开始调试。Select the AMS Asset Player application from the drop down box, as shown below, and hit F5 to start debugging.

    屏幕截图显示在 Visual Studio Code 中选择了“AMS 资产播放器”的菜单。

该示例应用程序将构建并启动默认浏览器应用,然后打开 AMS 资产播放器页面。The sample application will build and launch your default browser app, and open up the AMS Asset Player page.


根据浏览器上的安全设置,你可能会看到一条警告消息。Depending on the security settings on your browser, you may see a warning message. 由于该网页在本地运行,因此可以选择忽略该警告。Since the web page is running locally, you can choose to ignore the warning.

AMS 资产播放器会提示输入媒体服务资产的名称。The AMS Asset Player prompts you to enter the name of a Media Service asset. 应使用在教程:连续视频录制中用于录制视频的资产的名称。You should use the name of the Asset that you used for recording video in Tutorial: Continuous video recording.

键入资产名称并点击提交后,播放器代码将加载流式处理 URL。Upon typing the asset name and hitting submit, the player code will load the streaming URL. 有关详细信息,请参阅操作指南:播放录制内容For more information, see How-to-Guide: Playback of recordings. 如果按之前的建议操作,也就是当前仍在录制资产,播放器会检测到这一情况,并尝试提示播放到录制视频的最新部分。If, as recommended, you are still recording to the asset, the player will detect that, and attempt to cue the playback to the most recent part of the recorded video. 可以在播放器的左上方看到时间戳(以 UTC 为单位)。You can see the timestamp (in UTC) at the top left of the player. 在下面的屏幕截图中,请注意“实时”按钮的选择方式。In the screenshot below, note how the "Live" button is selected.


在播放器的右侧,可以看到用于浏览存档的控件。On the right side of the player, you can see the controls to browse the archive. 此控件中的年份、月份和日期使用操作指南:播放录制内容中记录的 availableMedia API 进行填充。The years, months, and dates in this control are populated using the availableMedia API documented in How-to-Guide: Playback of recordings. 如果 CVR 教程已运行了数个小时,在将日期扩展后,会看到如下所示的结果:When you expand the day, if you have let the CVR Tutorial run for several hours, you will see a result like this:


本教程中的视频源的源是 MKV 文件。The source for the video feed in the tutorial is an MKV file. RSTP 模拟器(请参阅 Live555 媒体服务器)进行到文件末尾时,会结束流传输。When the RSTP simulator (see Live555 Media Server) reaches the end of the file, it ends the stream. 媒体图中的 RTSP 源节点检测到此情况并重新建立连接,然后视频继续播放。The RTSP source node in the media graph detects this and re-establishes the connection, and the video resumes. 在每次文件的结束与重新连接之间,录制的存档内容中会产生一个间隔,该间隔在 availableMedia 结果中显示为新条目。In between each such end of file and reconnect, there is a gap in the recorded archive, which shows up as a new entry in availableMedia results.


单击列表中的任何一项时,应用程序都会使用相应的筛选器创建流 URL,例如 https://{hostname}/{locatorId}/content.ism/manifest(format=mpd-time-csf,startTime=YYYY-MM-DDTHH:MM:SS)。When you click on any one entry in the list, the application creates a streaming URL with the appropriate filter, such as https://{hostname}/{locatorId}/content.ism/manifest(format=mpd-time-csf,startTime=YYYY-MM-DDTHH:MM:SS). 播放器将加载此 URL,并在预期的 startTime 时间开始播放。The player will load this URL and playback will commence at the desired startTime.

或者可以通过页面底部的控件来使用特定的开始时间和结束时间。Alternatively, you can use specific start and end times, via the controls at the bottom of the page. 可以参考右侧列出的 availableMedia 调用的结果,来了解可以设置哪些开始时间和结束时间值。You can use the results of the availableMedia call, as listed on the right-hand side, as a guide to the allowed values of start and end times. 有关 startTime 和 endTime 筛选器的详细约束,请参阅操作指南:播放录制内容The detailed constraints on the startTime and endTime filters are documented in How-to-Guide: Playback of recordings. 选择时间值后,单击“提交”后,应用程序将加载播放器,其中包含流 URL,例如: https://{hostname}/{locatorId}/content.ism/manifest(format=mpd-time-csf,startTime=YYYY-MM-DDTHH:MM:SS,endTime= YYYY-MM-DDTHH:MM:SS) 播放将从预期的 startTime 开始播放。After selecting the time values, upon clicking on Submit, the application will load the player with a streaming URL like: https://{hostname}/{locatorId}/content.ism/manifest(format=mpd-time-csf,startTime=YYYY-MM-DDTHH:MM:SS,endTime= YYYY-MM-DDTHH:MM:SS) Playback will commence at the desired startTime.

后续步骤Next steps

将基于事件的视频录制到云中并从云中播放Event-based video recording to cloud and playback from cloud