postMessage跨域失败

Question

在http://localhost:8081中用iframe嵌套http://localhost:8080

<template>
    <div class="system-content-wrapper active1" :style="!hideSwipe?'width: calc(100% - 25px);':null">
        <iframe class="iframe-wrapper" ref="iframe" id="iframe" name="iframe" src="http://localhost:8080"></iframe>
    </div>
</template>

---

http://localhost:8081发送数据

postMessage() {
    var obj = window.frames['iframe'];
    obj.postMessage("123", "http://localhost:8080")
}

---

http://localhost:8080接受数据

window.addEventListener('message', function (event) {
  console.log(event.origin);
  // if (event.origin != 'http://localhost:8081') return;
  console.log('received response:  ', event.data);
}, true);

---

控制台报错

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('http://localhost:8080') does not match the recipient window's origin ('http://localhost:8081').

---

response data未定义

---

求解，是我用法不对还是postMessage不支持跨域？

Answer 1

obj.postMessage("123", "*")

看看

Answer 2

obj.postMessage

obj是接收方的引用

top.postMessage

Answer 3

data是undefined解决了么？

Answer 4

data是undefined解决了么？