html - 我的 Azure 媒体服务视频无法在 Azure 媒体播放器中播放

标签 html azure video-streaming media-player azure-media-services

我被要求将视频播放器添加到公司的 Web 应用程序中,以播放来自 Azure 媒体服务的流视频。

使用 Azure 门户和 Azure API,我已经能够加载和发布我们想要演示的视频文件。

我找到了样本herehere展示了在 HTML 页面中设置 Azure 媒体播放器是多么简单。

我将相关位添加到我们的网络应用程序中,播放器出现了,但没有播放任何内容。在 Chrome 中,播放器是空白的。在 IE11 中,播放器显示“无效源”。在 Edge 中,播放器显示“不支持这种类型的视频文件。”。

我将我们视频的 URL 插入 Azure Media Player Demo他们工作得很好。

我使用 Azure 的示例和他们自己的宣传视频创建了精简的 HTML 文件,其中仅包含视频播放器的基础知识。

<!DOCTYPE html>
<html>
    <head>
        <title>Azure Media Player Test</title>
        <link href="//amp.azure.net/libs/amp/1.3.0/skins/amp-default/azuremediaplayer.min.css" rel="stylesheet">
        <script src= "//amp.azure.net/libs/amp/1.3.0/azuremediaplayer.min.js"></script>
    </head>
    <body>
        This sample came from <a href="https://azure.microsoft.com/en-us/blog/announcing-azure-media-player/">https://azure.microsoft.com/en-us/blog/announcing-azure-media-player/</a>
        <br />
        <br />
        <video id="azuremediaplayer" class="azuremediaplayer amp-default-skin amp-big-play-centered" controls autoplay width="640" height="400" poster="" data-setup='{"nativeControlsForTouch": false}' tabindex="0">
            <source src="http://amssamples.streaming.mediaservices.windows.net/91492735-c523-432b-ba01-faba6c2206a2/AzureMediaServicesPromo.ism/manifest" type="application/vnd.ms-sstr+xml" />
            <p class="amp-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video</p>
        </video>
    </body>
</html>

<!DOCTYPE html>
<html>
    <head>
        <title>Azure Media Player Test</title>
        <link href="//amp.azure.net/libs/amp/latest/skins/amp-default/azuremediaplayer.min.css" rel="stylesheet">
        <script src="//amp.azure.net/libs/amp/latest/azuremediaplayer.min.js"></script>
    </head>
    <body>
        This sample came from <a href="http://amp.azure.net/libs/amp/latest/docs/">http://amp.azure.net/libs/amp/latest/docs/</a>
        <br />
        <br />
        <video id="vid1" class="azuremediaplayer amp-default-skin" autoplay controls width="640" height="400" poster="poster.jpg" data-setup='{"nativeControlsForTouch": false}'>
            <source src="http://amssamples.streaming.mediaservices.windows.net/91492735-c523-432b-ba01-faba6c2206a2/AzureMediaServicesPromo.ism/manifest" type="application/vnd.ms-sstr+xml" />
            <p class="amp-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video</p>
        </video>
    </body>
</html>

我得到的结果与我在网络应用程序中得到的结果相同,即空白或“源无效”或“不支持这种类型的视频文件”。

我想我错过了一些基本的东西,但是什么呢?

最佳答案

您是使用网络服务器来托管您编写的代码还是只是在本地运行它?如果您在本地运行它,则如果没有某种形式的网络服务器,则无法在 Chrome 或 Edge 中进行播放。请参阅此答案了解更多详细信息: Azure media player(AMP) not working on chrome if script file is saved locally

关于html - 我的 Azure 媒体服务视频无法在 Azure 媒体播放器中播放,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44056594/

相关文章:

html - 如何计算基于像素的 CSS 转换百分比?

powershell - Azure Powershell Keyvaults - 返回多个 SecretValueText 返回 null

android - 为什么 android 中的 VideoView 从 http 链接加载和播放视频需要花费太多时间?

ios - 通过 NSInputStream 和 NSOutputStream 的视频流

android - Android 中同时播放多个视频文件

html - 设置具有剩余高度的子 div

html - 如何在 wordpress 中居中画廊插件?

html5/css3 : Footer with "position:fixed" glitching

azure - 如何防止在运行 terraform destroy 时删除资源组?

azure - 如何下载Service Fabric证书?