J'essaie de faire communiquer deux applications React en envoyant des messages contenant des objets stringifiés.

Le parent (http://localhost:3000) envoie le message via postMessage comme ceci :

    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) ne reçoit pas le message, du moins pas immédiatement (je dois attendre l'actualisation logicielle de réaction pour afficher le journal).

La première erreur renvoyée est :

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