Methods and systems for cross-domain two-way communication by dynamic web content

A system for causing modification of a first webpage from a first domain to enable cross-domain two-way communication, comprising:

• one or more processors, and
• non-transitory memory storing instructions that, when executed by the one or more processors, cause the one or more processors to:
• cause a web browser to load, as part of the first webpage, dynamic content comprising one or more user interface elements;
• cause the web browser to embed an iFrame into the first webpage that contains a second webpage from a second domain different from the first domain, and wherein the one or more user interface elements each share a function with user interface elements of a third webpage, also from the second domain, the user interface elements of the third webpage being native to the third webpage rather than being embedded in any iFrame created by the third webpage;
• cause the web browser to load a script file from within the iFrame;
• subsequent to the embedding of the iFrame and loading the script file into the iFrame, cause the web browser to bind one or more functions defined by the script file to the one or more user interface elements, the one or more functions including the web browser's Window.postMessage( ) functionality;
• cause the web browser to, in response to the user interacting with the one or more user interface elements, use the one or more functions to send a post message to the second domain;
• upon receipt of the post message, update a state of the user interface elements of the third webpage to match a changed state of the one or more user interface elements of the first webpage;
• cause the web browser to receive a message from a server at the second domain using the web browser's Window.addEventListener( ) functionality indicating that a state of the one or more user elements of the third webpage has been further changed through a user interaction on the third webpage;
• and
• in response to the received message, update the one or more user interface elements of the first webpage to match the further changed state of the user interface elements of the third webpage.