流媒体技术世界——分享技术,增值服务
如何为VOD点播配置字幕?
Wowza Stream Engine 4支持VOD点播的隐藏字。它可以从各种来源视频流以及基于文件的内容源接收字幕数据,并将其转化为合适的格式为包括Apple HTTP Live Streaming (Apple HLS)、Adobe HTTP Dynamic Streaming (Adobe HDS)以及 RTMP协议在内VOD流媒体提供字幕。

注意:需要Wowza Media Server® 3.5.0 及更高版本。

内容



简介
支持的输入源
支持的输出
支持的字幕转换

它是如何工作的?
TTML 的例子
SRT 的例子
WebVTT 的例子
SCC 的例子

配置
配置 Application.xml
配置 TimedTextProviders.xml

支持的播放器

播放
使用JW Player播放器
使用Flowplayer播放器
使用Apple iOS 终端
在Apple iOS终端上用HTML网页播放
设置的字幕文件

故障排查
用TimedText属性参数调试


简介



隐藏字幕有很多不同的数据来源,在流媒体输出时,每一个流媒体播放协议需要在流中嵌入不同数据格式的隐藏字幕。 Wowza Media Server的直播流隐藏字幕功能支持以下输入和输出格式。了解更多Wowwza产品细节

支持的输入格式

  • 嵌入到VOD文件中的字幕:
    • 3GPP/MPEG-4 Timed Text tracks
    • 将CEA-608字幕作为SEI数据嵌入一个视频流轨道中。这种字幕数据在输出时会被直接透传出去。
      注意: 只有基于Apple iOS系统的播放器支持将SEI数据解释为CEA-608字幕;因此,只有这类播放器才能展现这种字幕。
      注意: iOS 播放器不支持多字节的语言。

  • 在外部文件定义的字幕:

支持的输出格式(可以从任何输入格式转换)

  • CEA-608格式的SEI数据,在Apple HLS (Cupertino) VOD 点播流中,可以将器嵌入到一个视频轨道中
  • onTextData事件,适用于Adobe HDS (San Jose) 和 RTMP VOD 点播流


下面的表格对Wowza Stream Engine 4支持的输入到输入的格式转换功能进行了总结:

支持的字幕格式转化

Outputs ˃
Inputs ˅
Apple HLS (Cupertino)
(CEA-608 in video)
RTMP
(onTextData)
Adobe HDS (San Jose)
(onTextData)
Embedded 3GPP tracks
Embedded CEA-608 no no
TTML file
SRT file
WebVTT file
SCC file

在Wowza Stream Engine 4的后续版本中,将增加更多的输入输出格式。

它是如何工作的?



Wowza Stream Engine 4 通过VODTimedTextProviders 支持VOD点播中的隐藏字幕。每一个provider都知道如何将来自不同类型的字幕数据源做为timed text嵌入到Wowza的 generic timed text 数据模型。 Wowza Stream Engine 4 包括了针对嵌入到3GPP/MPEG-4中的字幕以及外部文件形式的字幕的providers。 可以在一个Wowza的vod应用中配置接收字幕源时需要的provider(要了解更多,请阅读配置)。 注意,3GPP provider 是"enabled" 它配置文件中已经默认包含对它的配置。

TTML 例子

下面的例子展现了一个简单的TTML文件。这个文件(sample.ttml) 要和对应的VOD文件(sample.mp4)放在同一个内容目录下。 注意,除非你在客户端中配置了wowzacaptionfile参数的URL,否则这个TTML文件必须采用和VOD内容文件相同的名字,不同的仅仅是扩展名。
<?xml version='1.0' encoding='UTF-8'?>
<tt xmlns='http://www.w3.org/ns/ttml' 
    xmlns:tt='http://www.w3.org/ns/ttml' 
    xmlns:ttm='http://www.w3.org/ns/ttml#metadata' 
    xmlns:tts='http://www.w3.org/ns/ttml#styling' 
    xmlns:ttp='http://www.w3.org/ns/ttml#parameter' 
    xml:lang='eng'>
  <head>
    <ttm:title>Sample caption file</ttm:title>
    <metadata>
      <ttm:title>sampleTitle</ttm:title>
      <ttm:desc>This a sample TTML file.</ttm:desc>
      <ttm:copyright>Public Domain</ttm:copyright>
    </metadata>
    <styling>
      <style xml:id='backgroundStyle' 
             tts:fontFamily='proportionalSansSerif' 
             tts:fontSize='1.5c' 
             tts:textAlign='center' 
             tts:origin='0% 90%' 
             tts:extent='100% 8%' 
             tts:backgroundColor='rgba(0,0,0,0)' 
             tts:displayAlign='center'/>
      <style xml:id='speakerStyle' 
             style='backgroundStyle' 
             tts:color='white' 
             tts:textOutline='0px 1px' 
             tts:backgroundColor='transparent'/>
    </styling>
    <layout>
      <region xml:id='speaker' style='speakerStyle' tts:zIndex='1'/> 
      <region xml:id='background' style='backgroundStyle' tts:zIndex='0'/>
    </layout>
  </head>
  <body>
    <div> 
    <p region='speaker' begin='00:00:00' end='00:00:031'>Caption 1 at 00:00:00</p>  
    </div>
    <div> 
    <p region='speaker' begin='00:00:05' end='00:00:08'>Caption 2 at 00:00:05</p>  
    </div>
    <div> 
    <p region='speaker' begin='00:00:10' end='00:00:13'>Caption 3 at 00:00:10</p>  
    </div>
    <div> 
    <p region='speaker' begin='00:00:15' end='00:00:18'>Caption 4 at 00:00:15</p>  
    </div>
  </body>
</tt>
SRT 例子

下面的例子展现了一个简单的SRT文件。这个文件(sample.srt) 要和对应的VOD文件(sample.mp4)放在同一个内容目录下。 注意,除非你在客户端配置了wowzacaptionfile参数的URL,否则这个SRT文件必须采用和VOD内容文件相同的名字,不同的仅仅是扩展名。
1
00:00:00,000 --> 00:00:3,000
SRT (0)

2
00:00:05 --> 00:00:08.000
English (5)

3
00:00:10,000 --> 00:00:15,
SRT (10)

4
00:00:20,000 --> 00:00:24,400
Text at 20 seconds
WebVTT 例子

下面的例子展现了一个简单的WebVTT 文件。 这个文件(sample.webvtt) 要和对应的VOD内容文件(sample.mp4)放在同一个内容目录下。 除非你在客户端配置了wowzacaptionfile 参数的URL,否则这个WebVTT文件必须采用和VOD内容文件相同的名字,不同的仅仅是扩展名。
WEBVTT

0
00:00:04.000 --> 00:00:09.500
First cue

1
00:00:10.000 --> 00:00:15.000
Lorem

2
00:00:25.000 --> 00:00:30.500
ipsum

3
00:01:05.500 --> 00:01:25.501
Fourth caption
SCC 例子

下面的例子展现了一个简单的SCC文件。这个文件(sample.scc)要和对应的VOD内容文件(sample.mp4)放在同一个内容目录下。 除非你在客户端配置了wowzacaptionfile参数的URL,否则这个SCC文件必须采用和VOD内容文件相同的名字,不同的仅仅是扩展名。
Scenarist_SCC V1.0

00:00:01:09	9420 1370 9723 d04f d020 4fce 2043 c1d0 5449 4fce d380 94d0 9723 d04f d020 4fce 20c1 cec4 204f 4646 2054 c845 20d3 4352 4545 ceae 9420 942c 942f 9420 1370 97a2 54c8 45d9 20c1 5245 20d5 d345 c420 5749 54c8 20d0 524f c752 c1cd d380 94d0 97a2

00:00:02:27	5749 54c8 20cd d54c 5449 d04c 4520 43c8 c152 c143 5445 52d3 ae80
Note: Support for SCC files was added to Wowza Media Server 3.6.

配置



配置Application.xml

[install-dir]/conf/Application.xml 文件的<TimedText> 部分允许配置隐藏字幕的"providers"以及对应的功能。 可以在其中定义下面的providers:

  • vodcaptionprovidermp4_3gpp. 从MP4文件的3GPP轨道(codecID "tx3g")中读取字幕数据。这个选项在Application.xml 问价中默认被包含了。
  • vodcaptionproviderttml. 从与VOD内容文件在一起(同目录下的同名文件,只是扩展名不同)的TTML格式的字幕文件中读取字幕数据。
  • vodcaptionprovidertsrt. 从与VOD内容文件在一起(同目录下的同名文件,只是扩展名不同)的SRT格式的字幕文件读取字幕数据。
  • vodcaptionprovidertwebvtt. 从与VOD内容文件在一起(同目录下的同名文件,只是扩展名不同)的WebVTT格式的字幕文件读取字幕数据。
  • vodcaptionprovidertscc. 从与VOD内容文件在一起(同目录下的同名文件,只是扩展名不同)的SCC格式的字幕文件读取字幕数据。

<TimedText>
    <!-- VOD caption providers (separate with commas): vodcaptionprovidermp4_3gpp, vodcaptionproviderttml, vodcaptionproviderwebvtt, vodcaptionprovidersrt, vodcaptionproviderscc -->
    <VODTimedTextProviders>vodcaptionprovidermp4_3gpp</VODTimedTextProviders>

    <!-- Properties for TimedText -->
    <Properties>
    </Properties>		
</TimedText>
多个timed text providers可以按如下的例子设置:
<TimedText>
    <!-- VOD caption providers (separate with commas): vodcaptionprovidermp4_3gpp, vodcaptionproviderttml, vodcaptionproviderwebvtt, vodcaptionprovidersrt, vodcaptionproviderscc -->
    <VODTimedTextProviders>vodcaptionprovidermp4_3gpp, vodcaptionproviderttml,vodcaptionproviderwebvtt,  vodcaptionprovidersrt, vodcaptionproviderscc</VODTimedTextProviders>

    <!-- Properties for TimedText -->
    <Properties>
    </Properties>        
</TimedText>
配置 TimedTextProviders.xml

默认的TimedTextProviders配置应该足以满足大部分隐藏字幕使用场景的需求,在正常情况下,你不用做任何修改。要了解更多关于Timed Text Provider的配置,请阅读Wowza相关技术文档中的Wowza Streaming Engine配置参考

支持的播放器



  • iOS 播放器 在启用设备的隐藏字幕功能后,可以从Apple HLS (Cupertino)流媒体的CEA-608信息获取字幕并显示在屏幕上。
  • JW Player播放器 当使用合适的字幕插件后,就可以从RTMP流中获取字幕并显示在界面上。要了解更多,请阅读使用JW Player 播放RTMP流.
  • Flowplayer播放器 当使用合适的字幕和流媒体插件后,可以从RTMP以及Adobe HDS (San Jose) 流中获取字幕并显示在界面上。要了解更多,请阅读使用Flowplayer播放RTMP和Adobe HDS/San Jose流.


播放



注意:要播放你自己的内容,将它拷贝到[install-dir]/content 文件夹下,并替换下面例子URL中的sample.mp4文件名。

注意: 要采用VOD文件之外的字幕文件,按如下说明进行:
  1. 将同名的TTML (.ttml)、SRT (.srt)、或SCC (.scc) 字幕文件也放在[install-dir]/content 文件夹下,并确认和VOD文件名相同(例如,sample.ttmlsample.mp4). 这允许对应的VODTimedTextProvider 找到字幕文件并将其作为字幕嵌入到当前播放流中
  2. 根据你的字幕文件类型,在你的Application.xml文件中定义合适的VODTimedTextProvider。要了解更多,请阅读配置 Application.xml.

注意:每一个播放器可能有自己的用户控制,用来启用或禁用字幕的展现以及字幕的语言选择。

使用JW Player 播放RTMP流


JW Player 6不用任何插件就可以播放RTMP流中的隐藏字幕。下面推荐的一个基本的例子在playlist对象的file参数中设置了完整的RTMP播放URL:
    <div id="mediaplayer" ></div>
    <script type="text/javascript">
        jwplayer("mediaplayer").setup({
            playlist: [{
                file: 'rtmp://localhost:1935/vod/mp4:sample.mp4',
                title: 'sample.mp4',
            }],
            width: 854,
            height: 480,
        });
    </script>
JW Player 5 也可以播放RTMP流中的隐藏字幕(前提是你要使用Longtail的 JWPlayer5 字幕插件)。 你可以在JW Player的配置中启用这个插件:在你的Web页面中将它包含在jwplayer()plugins申明中,如下所示:
    <div id="mediaplayer" ></div>

    <script type="text/javascript">
        jwplayer("mediaplayer").setup({
            width: 854,
            height: 480,
            file: 'mp4:sample.mp4',
            streamer: 'rtmp://localhost:1935/vod',
            flashplayer: 'jwplayer/player.swf',
            plugins: {
                "jwplayer/captions.swf": {}
            }
        });
    </script>
因为JW Player 基于Flash,如果你在本地运行它(上面的例子),你必须将让Flash有权限访问jwplayer/文件夹(在Flash窗口上右键> 全局设置 > 高级 > 信任本地设置)。

使用Flowplayer播放RTMP流和Adobe HDS/San Jose流


当采用合适的插件时,Flowplayer可以播放RTMP流和Adobe HDS streams流中的隐藏字幕。

对于RTMP流,需要采用下面的Flowplayer插件:

  • rtmp. 支持RTMP流协议
  • content. 定义content字段,在这个内容中嵌入了隐藏字幕,它可能被展现在屏幕的顶部也有可能展现在下一屏。
  • captions. 展现content字段中的隐藏字幕。

你可以在Flowplayer的配置中启动这个插件:在你的WEB页面中调用flowplayer()的时候,将它们声明在plugins 中,如下所示:
<script type="text/javascript">
    flowplayer("flowplayer", "flowplayer/flowplayer-3.2.15.swf", {
    clip: {
        provider: 'rtmp',
        autoPlay: false,
        autoBuffering: false,
        scaling: 'fit',
        url: 'mp4:sample.mp4',
        },
    plugins: {
        // streaming plugin configuration
        rtmp: {
            url: "flowplayer/flowplayer.rtmp-3.2.11.swf",
            netConnectionUrl: 'rtmp://localhost:1935/vod'
        },

        captions: {
            url: 'flowplayer/flowplayer.captions-3.2.9.swf',
            captionTarget: 'content'
        },
        content: {
            url:'flowplayer/flowplayer.content-3.2.8.swf',
            bottom: '15%',
            width: '80%',
            height: 55,
            backgroundColor: 'transparent',
            backgroundGradient: 'none',
            border: 0,
            opacity: .90,
            textDecoration: 'outline',
            style: {
                'body': {
                    fontSize: '18',
                    fontFamily: 'Verdana, Arial, Helvetica',
                    fontWeight: 'bold',
                    textAlign: 'center',
                    color: '#ffff00'
                    }
                }
            }
        },
    logo: { 
        url: ''
        },
    }
);
</script>
对于Adobe HDS (San Jose) 流,需要采用下面的Flowplayer插件:

  • f4m. 用于解析Adobe F4M manifest文件中的media URL。
  • httpstreaming. 用于支持Adobe HDS (San Jose) 流协议。
  • content. 定义content 字段,在这个内容中嵌入了隐藏字幕,它可能被展现在屏幕的顶部也有可能展现在下一屏。
  • captions. 展现contentz中的隐藏字幕。

你可以在Flowplayer的配置中启用这些插件:在你的WEB页面中调用flowplayer()时声明这些plugins,如下所示:
<script type="text/javascript">
    flowplayer("flowplayer", "flowplayer/flowplayer-3.2.15.swf", {
    clip: {
        url: 'http://localhost:1935/vod/mp4:sample.mp4/manifest.f4m',
                urlResolvers: ['f4m'],
        provider: 'httpstreaming',
        autoPlay: true,
        autoBuffering: false,
        scaling: 'fit',
    },
    plugins: {
        // streaming plugin configuration
        f4m: { 
            url: "flowplayer/flowplayer.f4m-3.2.9.swf" 
        },
        httpstreaming: {
            url: "flowplayer/flowplayer.httpstreaming-3.2.9.swf"
        },
        captions: {
            url: 'flowplayer/flowplayer.captions-3.2.9.swf',
            captionTarget: 'content'
        },
        content: {
            url:'flowplayer/flowplayer.content-3.2.8.swf',
            bottom: '15%',
            width: '80%',
            height: 55,
            backgroundColor: 'transparent',
            backgroundGradient: 'none',
            border: 0,
            opacity: .90,
            textDecoration: 'outline',
            style: {
                'body': {
                    fontSize: '18',
                    fontFamily: 'Verdana, Arial, Helvetica',
                    fontWeight: 'bold',
                    textAlign: 'center',
                    color: '#ffff00'
                    }
                }
            }
        },
    logo: { 
        url: ''
        },
    }
);
</script>

使用Apple iOS 设备播放Apple HLS/Cupertino流


在Safari浏览器中访问下面的URL:
http://[wowza-ip-address]:1935/vod/mp4:sample.mp4/playlist.m3u8
注意: 你也可以在一台运行Mac OS X Snow Leopard 10.6及以上版本系统的计算上用Safari浏览器或QuickTime 10播放这个流。


播放嵌入在Apple iOS (Cupertino/Apple HTTP Live Streaming)设备上一个HTML网页中的视频


用Safari浏览器访问下面的URL。例如:
http://[website]/index.html
这个HTML页面应该使用<video> 标签定义视频源,如下所示:
<video src="[wowza-ip-address]:1935/vod/mp4:sample.mp4/playlist.m3u8" controls>

设置一个自定义的字幕文件


通常情况下,Wowzz将使用[install-dir]/content文件夹下与VOD内容文件相同文件名的字幕文件(只是扩展名不同)。 但是你可以在客户端设置使用一个自定义的、不同文件名的字幕文件。例如, 你可以hls的url中用一个参数来指定用哪个字幕文件名,你首先在Application.xml中启用vodcaptionproviderttml,然后在url中加入wowzacaptionfile参数,如下:
http://[wowza-ip-address]:1935/vod/mp4:sample.mp4/playlist.m3u8?wowzacaptionfile=otherFile.ttml
注意,这是你依然可以在URL中使用字幕语言选择参数,但只有这个字幕文件会被解析用来判断可用的字幕语言。

故障排查



用于Debug的一些TimedText参数


下面的例子展示了一些可以定义在Application.xml文件的Application/TimedText/Properties中的几个基本的debug参数,它们可以输出一些有用的log信息:
        <!-- Properties for TimedText -->
        <Properties>
            <Property>
                <!-- Enable/disable logging regarding caption language selection -->
                <Name>debugVODCaptionLanguageSelection</Name>
                <Type>Boolean</Type>             
                <Value>true</Value>
            </Property>
            <Property>
                <!-- Enable/disable logging regarding caption provider determination for a given VOD asset -->
                <Name>debugVODCaptionProviderDetermination</Name>
                <Type>Boolean</Type>             
                <Value>true</Value>
            </Property>
            <Property>
                <!-- Enable/disable logging regarding caption companion file determination for a given VOD asset -->
                <Name>debugVODCaptionFileDetermination</Name>
                <Type>Boolean</Type>             
                <Value>true</Value>
            </Property>
        </Properties>
你可以在Closed captioning configuration reference for video on demand streaming中找到完整的Timed Text配置参数信息.

匿名用户
评论

我们的地址


北京市朝阳区管庄西里建基商务楼423室


邮编:100024

关于我们


北京联方信科信息技术有限责任公司


官网:www.ttstream.com

联系我们


王经理:phone


柳经理:phone

京ICP备14033868号-2