将 postMessage 从父级用于 iframe 时出现原始错误（无法在“DOMWindow”上执行“postMessage”）

问：

我正在尝试通过发送包含字符串化对象的消息来使两个 React 应用程序进行通信。

父级 （http://localhost:3000） 通过如下方式发送消息：postMessage

    let iframe = document.querySelector("iframe")

    useEffect(() => {
        if (!!localStorageObject && !!iframe) {
            iframe?.contentWindow?.postMessage(localStorageObject, "http://localhost:3001")
        }
    }, [localStorageObject, iframe])

    // ...file and start of return

   <iframe
       style={{minHeight: window.outerHeight, width: '100%', border: "none"}}
       referrerPolicy="strict-origin-when-cross-origin"
       src={myUrlWithParams}
       title="App"
       allow="clipboard-write"
       id={"iframe"}
   />

iFrame （http://localhost:3001） 没有收到消息，至少不会立即收到（我必须等待 react 软刷新才能显示日志）。

首先抛出的错误是：

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