Apex Code Development You need to sign in to do that
Don't have an account?
Daniel Puza How should a Lightning component communicate with a loaded Canvas App?
We are developing a custom Lightning component that contains a Canvas App which loads our external site inside of the Lightning component.
Is it possible, and if so what are some recommended ways to communicate between the Lightning component and the loaded Canvas App site? (NOT the parameters passed in to load the canvas app initially.)
For instance, we would like a button in the Lightning component to trigger an action inside the loaded Canvas App.
It seems that various methods of communicating are restricted by Lightning Locker etc. I found documentation for various methods of event raising and handling but all I've tried have been without success. It seems possible they're only for communicating from Lightning component to Lightning component, or from canvas app to canvas app (or Visualforce), but not Lightning component to canvas app.
https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/events_component.htm
https://developer.salesforce.com/docs/atlas.en-us.platform_connect.meta/platform_connect/canvas_app_events.htm
I was able to send a message from the canvas app to the lightning component using this "non-standard, probably unsupported technique", but not the other way around.
https://salesforce.stackexchange.com/a/161621/49367
Is it possible, and if so what are some recommended ways to communicate between the Lightning component and the loaded Canvas App site? (NOT the parameters passed in to load the canvas app initially.)
For instance, we would like a button in the Lightning component to trigger an action inside the loaded Canvas App.
It seems that various methods of communicating are restricted by Lightning Locker etc. I found documentation for various methods of event raising and handling but all I've tried have been without success. It seems possible they're only for communicating from Lightning component to Lightning component, or from canvas app to canvas app (or Visualforce), but not Lightning component to canvas app.
https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/events_component.htm
https://developer.salesforce.com/docs/atlas.en-us.platform_connect.meta/platform_connect/canvas_app_events.htm
I was able to send a message from the canvas app to the lightning component using this "non-standard, probably unsupported technique", but not the other way around.
https://salesforce.stackexchange.com/a/161621/49367
<iframe aura:id="vfFrame" src="{!'https://' + v.vfHost + '/apex/myvfpage'}"/>Then I am able to use postMessage (https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage)/addEventListener (https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener) to communicate between the lightning component and the wrapper Visualforce page. And can use publish (https://developer.salesforce.com/docs/atlas.en-us.platform_connect.meta/platform_connect/canvas_app_vf_publish_code_example.htm)/subscribe (https://developer.salesforce.com/docs/atlas.en-us.platform_connect.meta/platform_connect/canvas_app_vf_subscribe_code_example.htm) to pass the event between Visualforce and the canvas app.
Another approach that works is using SignalR on our external app to trigger the communication. Had to work through some configuration for CORS, but got a proof of concept working that way too.
Tried to accomplish the same thing with CometD. I thought it could be a little cleaner than SignalR because it’s built in to Salesforce and there is some Salesforce documentation on it. However, I haven’t been able to get the CometD approach to work. The Salesforce side is throwing CORS errors, even though I have the connection included in the Salesforce CORS/CSP whitelist. I set up the CORS configuration in IIS and got SignalR working, but I don’t know what else I can configure in Salesforce to allow the same thing with CometD and CORS, or if it’s even possible. According to this (https://developer.salesforce.com/docs/atlas.en-us.chatterapi.meta/chatterapi/extend_code_cors.htm), only these Salesforce technologies support CORS.
All Answers
Greetings!
Seems like this can be achieved by firing an event.So,can you please check the below thread for more information:
https://salesforce.stackexchange.com/questions/131245/how-to-fire-an-event-from-a-canvas-app-to-a-lightning-component
Kindly let me know if it helps you and close your query by marking it as best answer so that it can help others in the future.
Warm Regards,
Shirisha Pathuri
It doesn't work. (Maybe it used to, but I assume that Lightning Locker prevents this now.) It fails at the very first line, since outerIframe is null. As I would expect. Lightning Locker prevents accessing DOM elements from other Lightning components.
var outerIframe = document.querySelector('.forceCanvasApp iframe');<iframe aura:id="vfFrame" src="{!'https://' + v.vfHost + '/apex/myvfpage'}"/>Then I am able to use postMessage (https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage)/addEventListener (https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener) to communicate between the lightning component and the wrapper Visualforce page. And can use publish (https://developer.salesforce.com/docs/atlas.en-us.platform_connect.meta/platform_connect/canvas_app_vf_publish_code_example.htm)/subscribe (https://developer.salesforce.com/docs/atlas.en-us.platform_connect.meta/platform_connect/canvas_app_vf_subscribe_code_example.htm) to pass the event between Visualforce and the canvas app.
Another approach that works is using SignalR on our external app to trigger the communication. Had to work through some configuration for CORS, but got a proof of concept working that way too.
Tried to accomplish the same thing with CometD. I thought it could be a little cleaner than SignalR because it’s built in to Salesforce and there is some Salesforce documentation on it. However, I haven’t been able to get the CometD approach to work. The Salesforce side is throwing CORS errors, even though I have the connection included in the Salesforce CORS/CSP whitelist. I set up the CORS configuration in IIS and got SignalR working, but I don’t know what else I can configure in Salesforce to allow the same thing with CometD and CORS, or if it’s even possible. According to this (https://developer.salesforce.com/docs/atlas.en-us.chatterapi.meta/chatterapi/extend_code_cors.htm), only these Salesforce technologies support CORS.