[Bug] Overlay cross domains

[bozzelliandrea]

What happened?

When using the overlay functions with matomo and a website in a different domain, the left sidebar with views data is blocked on loading status.

Possible Bug Solution
testing locally and also in a production environment, the issue seems with the connection between child iframe and overlay parent.

a possible fix could be added using js window.postMessage() api, here it is a tested implementation

plugins/Overlay/notifyParentIframe.twig

<script type="text/javascript">
  const messageData = {
    eventName: "notifyParentIFrameEvent",
    data: window.location.hash.substring(1),
  };
  // Sending the message, starting the parent notification event
  piwikWindow.postMessage(messageData, "*");
</script>

plugins/Overlay/javascripts/Piwik_Overlay.js

function handleApiRequests() {
    window.addEventListener(
      "message",
      function(event) {
       // handle parent event
        if (event.data.eventName === "notifyParentIFrameEvent") {
          const currentUrl = event.data.data;
          // evaluate if move the code inside setCurrentUrl (tested approach)function or call the function (maybe scope error)
        }
        //...
    )
  //...
}

/js/piwik.js

function isOverlaySession(configTrackerSiteId) {
        windowAlias.parent.postMessage("requestUrl", "*");
  
        var windowName = "Matomo_Overlay";
  
        // regex refactor to been able to read params in different order
        const regex = /[?&](idSite|period|date|segment)=([^&#]+)/g;
        const matches = {};
        let match;

        while ((match = regex.exec(windowAlias.location)) !== null) {
            matches[match[1]] = decodeURIComponent(match[2]);
        }

        if (matches) {
          // check idsite
          var idsite = matches["idSite"];
  
          if (idsite !== String(configTrackerSiteId)) {
            return false;
          }
  
          // store overlay session info in window name
          var period = matches["period"],
            date = matches["date"],
            segment = matches["segment"];
  
          if (!segment) {
            segment = "";
          } else if (segment.indexOf("&segment=") === 0) {
            segment = segment.substr("&segment=".length);
          }
  
          windowAlias.name = windowName + "###" + period + "###" + date + "###" + segment;
        }
  
        // retrieve and check data from window name
        var windowNameParts = windowAlias.name.split("###");
  
        return windowNameParts.length === 4 && windowNameParts[0] === windowName;
      }

What should happen?

Matomo render the iframe and then the sidebar with views data.

How can this be reproduced?

Go to [Matomo URL]
-> Log In
-> Select a website
-> Left side menu, click Behaviour
-> Click and open Pages
-> Find some views filtering by date and website
-> Click the Open Page Overlay button (second image button for single page url in standard matomo)

Matomo version

5.2.0

PHP version

8

Server operating system

Linux

What browsers are you seeing the problem on?

No response

Computer operating system

MacOS

Relevant log output

Validations

• Read our Contributing Guidelines.
• Follow our Security Policy.
• Check that there isn't already an issue that reports the same bug to avoid creating duplicates.
• The provided steps to reproduce is a minimal reproducible of the Bug.