从 Azure 媒体播放器获取视频宽度和高度答案

【问题标题】：Get Video Width and Height from Azure Media Player从 Azure 媒体播放器获取视频宽度和高度
【发布时间】：2022-01-03 03:26:40
【问题描述】：

我有视频从 Azure 媒体服务流式传输，并且正在使用 Azure 媒体播放器 API 在我的网页中呈现。

我不提前知道视频的尺寸是多少（它们会有所不同）。我的问题是，当我播放视频时，如果我没有创建具有正确比例的视频元素以匹配视频，则视频周围会出现黑色边框（在顶部/底部或左/右）。例如，请参见下图，注意视频左右两侧的黑色大边框。我想获取视频大小，以便更正尺寸并消除边框。

Azure 媒体播放器 API 似乎说我可以得到 videoWidth 和 videoHeight。但我不确定（在 Javascript 中）从哪个对象获取这些值。

在下面的脚本中，当我 console.log player 对象时，我看不到 videoWidth 或 videoHeight 作为播放器对象的一部分。

let myOptions = {
    controls: true,
    autoplay: true,
    logo: { enabled: false }
};
myPlayer = amp(video, myOptions, () => {
    console.log(myPlayer);
});
myPlayer.src([{
    src: "<manifestURL>",
    type: "<type>"
}]);

以下屏幕截图是记录的内容。除非我遗漏了什么，否则我看不到 videoWidth 或 videoHeight 值。

非常感谢任何帮助。

【问题讨论】：

我没有测试，所以我把它作为评论，videoWidth/videoHeight 是函数，你也应该在准备好的处理程序中使用this 关键字，例如。 amp(video, options, () => console.log(this.videoWidth()).
谢谢，你说得对，videoWidth 是一个函数，我不知道我在想什么......但是当我使用this 时它不起作用。使用myPlayer.videoWidth() 对我有用。如果您发布为答案，我会将其标记为正确。

标签： javascript html5-video azure-media-services azure-media-player

【解决方案1】：

其实videoWidth/videoHeight是函数。

您还应该在就绪处理程序中使用this 关键字。

例如：

amp(video, options, () => console.log(this.videoWidth())

【讨论】：