webslides / WebSlides

Create HTML presentations in seconds —
https://webslides.tv/
MIT License
6.21k stars 587 forks source link

postMessage error message #116

Open coldes opened 6 years ago

coldes commented 6 years ago

...does anyone know how to resolve this console error when adding YouTube Videos Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('<URL>') does not match the recipient window's origin ('<URL>').

Antonio-Laguna commented 6 years ago

Hey, @coldes that doesn't have to do much with WebSlides but could you show me how are you using the YouTube API and loading the videos, please?

coldes commented 6 years ago

...yes am aware that it is not a webslides issue as such, as googling for this error message seems to indicate if there is a difference between http & https - my dev server is https - plus I did not mention error message refers to https://s.ytimg.com/yts/jsbin/www-widgetapi-vflmgpyWO/www-widgetapi.js Line 99, which I have copied/expanded

h.B = function(a) {
    a.id = this.g;
    a.channel = "widget";
    a = xa(a);
    var b = this.b;
    var c = Ba(this.a.src);
    b = 0 == c.indexOf("https:") ? [c] : b.a ? [c.replace("http:", "https:")] : b.c ? [c] : [c, c.replace("http:", "https:")];
    if (!this.a.contentWindow) throw Error("The YouTube player is not attached to the DOM.");
    for (c = 0; c < b.length; c++) try {
        this.a.contentWindow.postMessage(a, b[c])
    } catch (d) {
        if (d.name && "SyntaxError" == d.name) Ha(d, "WARNING");
        else throw d;
    }
};
function bb(a) {
    return (0 == a.search("cue") || 0 == a.search("load")) && "loadModule" != a
}

re how I am implementing is [sample video from webslide demo

<div class="wrap">
    <div class="youtube video">
        <iframe allowfullscreen="1" data-youtube-id="dmkwb2KfLW8" frameborder="0" height="360" id="widget4" name="widget4" src="https://www.youtube.com/embed/dmkwb2KfLW8?modestbranding=1&amp;rel=0&amp;origin=https%3A%2F%2F <MYURL> &amp;enablejsapi=1&amp;widgetid=3" title="YouTube video player" width="640"></iframe>
    </div>
</div>

Anyway, all works, just hate seeing console error messages - btw, thanks for the quick response

Antonio-Laguna commented 6 years ago

Try to remove the origin parameter from the url and see how it goes

coldes commented 6 years ago

...my bad - the previous html I copied from dev tools console - my actual html I am using is <div data-youtube data-youtube-id="dmkwb2KfLW8" data-autoplay data-no-controls</div> which means I have no way of removing the origin parameter because it is auto generated

coldes commented 6 years ago

....fyi same console message in https://webslides.tv/demos/media#slide=31