Skip to main content

I’m trying to raise an event from a Skuid page hosted in Visual Force to a Lightning Component that’s hosted in the Skuid page in a iFrame, like so:


!(https://us.v-cdn.net/6032350/uploads/attachments/RackMultipart20180829-111823-jep9nn-Edit_Page CareOnlineAccountQBOTab SeanClone_inline.jpg “Image: https://d2r1vs3d9006ap.cloudfront.net/s3\_images/1748942/RackMultipart20180829-111823-jep9nn-Edit\_Page\_\_CareOnlineAccountQBOTab\_\_SeanClone\_inline.jpg?1535581732”)


But no matter what I seem to try the LC doesn’t seem to be hearing the event. I tried a point & click publish with scope set to include LC’s on the Tab’s Actions but no dice. I also tried using a snippet but same results.


I know there are several configurations where this will work such as Skuid pages hosted in LC’s, but what about the other way around?


Thanks

So, the Lightning Component is embedded in a Visualforce Page that is being loaded into Skuid via an iframe? That is not supported out of the box, although it is possible. Is there a reason you’re loading the Lightning Component in a Visualforce Page in an iframe, vs just loading Lightning Out directly in the Skuid Page? This can be done via JavaScript, and I think that if you do this, the Lightning Component will hear the event.


Basically you just need to do the following (assuming that you already have a Lightning Application and Lightning Component properly configured for Lightning Out (https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/lightning_out.htm)



  1. Add a JavaScript Resource with Resource Type “External” to load the Lightning Out library, from the relative URL: ">lightning/lightning.out.js




  2. Add a JavaScript Resource with Record Type “Inline (Component)” that instantiates your desired Lightning Out Component, whose content should be something like this


    var element = arguments 0];$Lightning.use(“c:MyLightningOutApp”, // name of the Lightning app function() { $Lightning.createComponent( “c:FooBar”, // top-level Lightning component of your app { }, // attributes to set on the component when created elemente0], // insert the lightning component inside the Skuid custom component’s DOM element function(cmp) { // callback when component is created and active on the page } ); }, “https://acme.lightning.force.com”, // Your Lightning domain skuid.utils.userInfo.sessionId // Access Token);





Thanks the detailed response, but I’m getting what looks like a cross site script error when I try this:

Failed to load https://zzz.lightning.force.com/c/QBOUsageHistory_App.app?aura.format=JSON&aura.format=JSON&aura.formatAdapter=LIGHTNING_OUT: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘https://zzz–c.cs9.visual.force.com’ is therefore not allowed access.

Any idea? Also, I haven’t run across this technique in the documentation. Is it in there anywhere?

View our Community Site Map

Nintex Community Sitemap
Terms & ConditionsCookie settings