Медиаплеер Azure (AMP) не работает в Chrome, если файл сценария сохраняется локально

Я сохранил источник примера видео AMP http://amp.azure.net/libs/amp/latest/samples/dynamic_setsource.html и попытался воспроизвести видео. Он работает в IE и Edge, но не в Chrome. если я размещу этот файл, он будет работать. Можете ли вы помочь мне понять, что здесь не так? Вы можете попробовать запустить скрипт в IE Chrome, чтобы увидеть разницу.

<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Skill Cloud</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="http://amp.azure.net/libs/amp/1.7.1/skins/amp-default/azuremediaplayer.min.css" rel="stylesheet">
    <script src="http://amp.azure.net/libs/amp/1.7.1/azuremediaplayer.min.js"></script>
</head>
<body>
    <h1>Skill Cloud</h1>
    <video id="azuremediaplayer" class="azuremediaplayer amp-default-skin amp-big-play-centered" tabindex="0"> </video>
    <script>
        var myOptions = {
            autoplay: true,
            controls: true,
            width: "100%",
            height: "auto",
            poster: ""
        };
        var myPlayer = amp("azuremediaplayer", myOptions);
        myPlayer.src([{ src: "http://amssamples.streaming.mediaservices.windows.net/91492735-c523-432b-ba01-faba6c2206a2/AzureMediaServicesPromo.ism/manifest", type: "application/vnd.ms-sstr+xml" }, ]);
    </script>
    <footer>
        <br />
        <p>© Microsoft Corporation 2016</p>
    </footer>
</body>
</html>

Спасибо

Источник

2 ответа

Когда вы запускаете код локально, Chrome открывает ваш index.html с протоколом file://. Из-за политики безопасности Chrome локальные ресурсы не могут быть загружены, и это препятствует воспроизведению. (Если вы посмотрите на консоль JavaScript, я уверен, что вы увидите похожую ошибку.)

Чтобы обойти это, вы можете использовать IDE, такую ​​как Visual Studio или WebMatrix, которая автоматически настроит для вас локальный веб-сервер, чтобы вы могли получить доступ к своей странице с http://localhost:8000/ или любым другим портом, который вы предпочитаете.

Если вы не хотите использовать VS или WebMatrix, вы также можете использовать простой HTTP-сервер Python. Надеюсь, это поможет и счастливого кодирования:)

Источник

Если вам нужно запустить локально, вы можете просто заменить http на https, не загружая его локально.

Например:

       <link href="https://amp.azure.net/libs/amp/1.7.1/skins/amp-default/azuremediaplayer.min.css" rel="stylesheet">
 <script src="https://amp.azure.net/libs/amp/1.7.1/azuremediaplayer.min.js"></script>

Также необходимо заменить

      myPlayer.src([{ src: "https://amssamples.streaming.mediaservices.windows.net/91492735-c523-432b-ba01-faba6c2206a2/AzureMediaServicesPromo.ism/manifest", type: "application/vnd.ms-sstr+xml" }, ]);

По крайней мере, у меня это работает. Приятного кодирования!

Источник
Другие вопросы по тегам