未捕获的语法错误：无法在“窗口”上执行“postMessage”：对“postMessage”的调用中的目标源“my_page”无效答案

【问题标题】：Uncaught SyntaxError: Failed to execute 'postMessage' on 'Window': Invalid target origin 'my_page' in a call to 'postMessage'未捕获的语法错误：无法在“窗口”上执行“postMessage”：对“postMessage”的调用中的目标源“my_page”无效
【发布时间】：2014-06-15 21:43:45
【问题描述】：

我有以下脚本

父页面（pair_pixel_filter.php）：

 window.addEventListener("message", function(e) {
            $('#log').append("Received message: " + (e.data));
        }, false);
 $('.photo-upload-btn').click(function(event) {
            event.preventDefault();
            window.open($(this).attr("href"), "popupWindow", "width=600,height=600,scrollbars=yes");
        });

子页面

$.ajax({
            type: 'post',
            url: url,
            data: {
                base64data: dataURL
            },
            success: function(data) {
                window.opener.postMessage(data, "pair_pixel_filter.php");
                window.close(); }
        });

基本上打开一个弹出窗口，然后在弹出窗口上做一些 ajax 并将结果返回给父级。但是从 Child 我收到了这个错误。

未捕获的语法错误：无法在“窗口”上执行“postMessage”：在调用“postMessage”时目标源“pair_pixel_filter.php”无效

【问题讨论】：

标签： javascript jquery cross-browser postmessage

【解决方案1】：

postMessage 的第二个参数是“目标原点”。这是页面所在的域，而不是（php）文件的名称。

它需要是这样的：

window.opener.postMessage(data, "http://example.com");

见：https://developer.mozilla.org/en-US/docs/Web/API/Window.postMessage

【讨论】：

非常正确，我刚刚发现我们需要传递像localhost/abc/mypage.php这样的完整路径
@noobie-php 实际上，javascript 会忽略域之后的任何内容，因此如果主机是 localhost，即使路径不同，目标窗口也会接受它。因此，将http://localhost/abc/mypage.php 作为原点传递将与传递http://localhost 或http://localhost/literally/anything/xyz.php 具有相同的效果。