I have a Lightning Component which I'm trying to add to a Lightning App to be run under Salesforce1.
The Lightning Component has an iframe which loads a VisualForce page.
<aura:component implements="flexipage:availableForAllPageTypes" access="global"> <div> <iframe aura:id=‘someFrame’ /> </div> </aura:component>
Then the controller/helper does this:
component.find('someFrame').getEelement().src = window.location.origin + '/apex/' + namespace + '/somePage';
And later on the component and page talk to each other using window.postMessage.
This works perfectly inside a community, but once I'm trying to load it in Salesforce1, I'm getting an error saying:
Exception: DOMException: Blocked a frame with origin "https://[domain]--[namespace].visual.force.com" from acessing a cross-origin frame.
I understand the error, it basically means the page in the frame has a different domain than the one you called it from (unless I'm mistaken?) - and technically that's true, because the Lightning Component, when running under Salesforce1, has the url of "https://[domain].lightning.force.com/".
The code inside sort of loads, but it won't run properly + the value of window.frameElement is null, as if the page is not actually inside an iframe (I assume that it's because the connection is broken on the cross origin).
My problem is that when I set the src of the iframe, I set it to this very same domain (of the Lightning Component), because in the component's context, window.location.origin equals "https://[domain].lightning.force.com". Once I address the VisualForce page using this url, it seems to be redirected to the problematic one and so it fails on the different origin.
I've tried hardcoding the urls, tried making the page 'available for mobile', neither seemed to help.
Is there some way to prevent the page from redirecting so that it won't fail on x-origin? or is there maybe some other way to embed the VF page inside the Lightning Component and allow them to talk to each other?