用普通 HTML video 标签加 MP4 播放十秒的循环短片没问题,但很快就会行不通。大文件在慢速网络下会卡顿,各浏览器支持的格式不一,而且每次有人点击播放,你自己的网站主机都要为流量付费。嵌入式播放器则完全相反:文件存放在 FileHost.net,视频流会根据观众的网络自动调整,你的页面只需包含一个小小的 iframe。
播放基于 Video.js 播放器,采用 HLS 流媒体。观众可使用全屏、倍速菜单、播放、快进快退、音量、静音和全屏的键盘快捷键、可调暗页面的影院模式,以及上传后自动生成的时间轴悬停缩略图。字幕可以 SRT 文件形式添加,支持 45 种语言,如果你愿意,播放器还可以默认开启某条字幕轨道。
所有者可以设置嵌入宽度和高度、添加自己的徽标、选择启动画面或封面图,高级版还可更改播放器颜色以匹配网站风格。高级用户可以在后台连接 VAST 广告标签或弹窗设置。
以下内容均对照播放器代码核实,不是愿望清单。
分段传输让播放快速启动、拖动流畅,即使是长视频也一样。
可按语言加载 SRT 字幕轨道,在播放器中随时开启,也可默认开启字幕。
倍速菜单和键盘控制涵盖播放、快进快退、音量、静音、全屏和影院模式。
调暗周围页面,让视频成为焦点,再按一个键即可切换回来。
悬停缩略图在处理视频时生成,观众无需盲目拖动就能找到想看的片段。
可添加徽标、选择封面、设置嵌入尺寸,高级版还能自定义播放器颜色。
这是仪表盘生成的代码结构。请将代码替换为你自己视频的公开 ID。
<iframe width="600" height="480" src="https://filehost.net/e/YOUR_CODE" scrolling="no" frameborder="0" allowfullscreen="true"></iframe>一个小容器即可在任何屏幕宽度下保持 16:9 比例。将其添加到样式表中,并在里面使用同样的 iframe。
<div style="position:relative;aspect-ratio:16/9;max-width:100%">
<iframe src="https://filehost.net/e/YOUR_CODE"
style="position:absolute;inset:0;width:100%;height:100%;border:0"
allowfullscreen="true"></iframe>
</div>iframe 与你自己的脚本相互隔离,不会拖慢页面布局,也不会与主题冲突,但搜索引擎会将视频视为属于被嵌入的地址。请在你自己的页面上配上描述性标题、简短文字摘要和文字稿,让内容仍能获得排名。当视频位于首屏下方时,请为 iframe 添加设为 lazy 的 loading 属性。
由于繁重的处理工作都在别处完成,流量激增时你的主机费用也不会上涨。这对使用共享主机的小型网站来说是最实际的好处。
通过嵌入播放器产生的播放量与观看页按相同费率计入收益,一篇热门文章就能自负盈亏。你还可以在播放器内投放自己的 VAST 广告;投放自有广告期间产生的流量来自高级版流量,固定价格为每 TB 2 美元。在据此制定商业计划之前,请先阅读收益规则。
如果播放器显示为空白框,请检查你的页面是否通过内容安全策略屏蔽了第三方框架。如果字幕没有出现,请确认字幕轨道已添加到正确的视频,并且是 SRT 格式。如果页面在手机上显示异常,请用上面的自适应容器替换固定的宽度和高度。
从网盘类服务嵌入,往往只有笨拙的预览框。看看各播放器有何不同。