Не удалось выполнить 'postMessage' в 'DOMWindow': несоответствие цели / источника http vs https
Я заранее прошу прощения, потому что меня очень смущает моя проблема. Я действительно в затруднении, потому что это вызывает проблему на моей производственной площадке.
На моем сайте есть проигрыватель javascript, который воспроизводит списки песен, которые можно размещать на youtube, soundcloud или vimeo. Вчера я заметил эту ошибку, которая обычно возникает всякий раз, когда вы пытаетесь загрузить новую песню через «пропуск» с помощью кнопок плеера. Эта ошибка только началась в последний день или два. Я не вижу ничего нового в примечаниях к выпуску youtube api, и эта ошибка возникает при использовании Chrome, Firefox и Safari, поэтому, скорее всего, она не связана с изменением браузера. Что-то, что я использую, изменилось, хотя, поскольку я не выдвигал новый код в течение 18 дней.
Пример списка воспроизведения здесь:http://www.muusical.com/playlists/programming-music
Я думаю, что я выделил способ воспроизвести ошибку, вот шаги:
Слушать песню на YouTube.Перейти к любой другой песне в списке (нажатием кнопок пропуска или прямым нажатием кнопки воспроизведения на элементе строки песни).* Обратите внимание, что если первая песня в списке воспроизведения является песней YouTube, просто переход к другой песне даже без воспроизведения изначально загруженной песни YouTube вызовет ошибку.
По сути, ошибка, кажется, возникает, когда вы загрузили и / или проиграли песню на YouTube и попытаетесь перейти к другой песне.
Дайте мне знать, если вы найдете исключение из этого поведения.
Я вижу эту ошибку в консоли:
Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://www.muusical.com') does not match the recipient window's origin ('http://www.muusical.com').
Я загружаю плеер с использованием API Java YouTube:
new YT.Player('playlist-player', {
playerVars: { 'autoplay': 1, 'fs': 0 },
videoId: "gJ6APKIjFQY",
events: {
'onReady': @initPlayerControls,
'onStateChange': @onPlayerStateChange
}
})
Который производит этот iframe:
<iframe id="playlist-player" frameborder="0" allowfullscreen="1" title="YouTube video player" width="640" height="360" src="https://www.youtube.com/embed/gJ6APKIjFQY?autoplay=1&enablejsapi=1&origin=http%3A%2F%2Fwww.muusical.com"></iframe>
После нажатия пропустить из вышеупомянутой песни YouTube, это то, что я вижу загружен в iframe:
<iframe id="playlist-player" frameborder="0" allowfullscreen="1" title="YouTube video player" width="640" height="360" src=""></iframe>
Я поддерживаю песни YouTube, SoundCloud и Vimeo. Кажется, что как только песня на YouTube загружена, «origin» меняется с http на https. Я не думаю, что необходимо включать методы встраивания для других хостов, так как эта ошибка возникает, даже если весь плейлист - только youtube, и его нет в плейлисте, который состоит только из песен из Soundcloud и Vimeo.
Кроме того, вот как я загружаю JavaScript YouTube:
// Load the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
Пожалуйста, дайте мне знать, если вам нужно, чтобы я что-то прояснил, и заранее спасибо, что посмотрели.