How to fix this issue - failed to execute postmessage on domwindow the target origin provided?

To fix this issue - failed to execute postmessage on domwindow the target origin provided

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://companyName--c.visualforce.com') does not match the recipient window's origin ('https://companyName--c.ap3.visual.force.com').
I've developed an Aura, and it also loads a VF page. In order to generate the VF page link I used the following line of the code and split it:
var hostname = [removed].hostname;
However, the hostname value is varying between the production environment and the Sandboxes.
Sandbox environment: https://companyName--c.visualforce.com
Production environment: https://companyName--c.instanceName.visual.force.com

I developed the code based on the Sandboxes, now facing the error in loading the VF page inside production org. How to fix this issue in production?

By the way, the domain URL structure will be changed and enforced at Summer 22" release. So, at that time you might need to refactor your code accordingly. Reference: Enhanced Domains