Due to the limited documentation out there for the BETA Lightning Out functionality I am posting my code for others to benefit.
Please note that after extensive research I have come to the conclusion that off platform functionality is broken, but executing the code from within a naked VF page should work. The issue is that the bootstrapping process does not adjust the URLs for the dynamically loaded scripts and styles sheets - the JS assumes it is still run from within a SF org domain. A case with SF has been filled but if I am incorrect on my conclusion please comment.
Even if one patches the script/style URLs loading at runtime further errors manifest from withing aura_prod.js
Salesforce's 'Lighting Out' Example
Prior to using the below code ensure you have wrapped your lighting component into an App, setup a connected App, and CORS whitelisted your domain - afterwards copy and paste the below into your HTML file to be served from a server.
... <div id='lightning'></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script src="https://<REMOVED>.lightning.force.com/lightning/lightning.out.js"></script> <script> sAccessToken = location.hash.match(/access_token=([^&]*)/) ? location.hash.match(/access_token=([^d]*)/)[1] : null; sInstanceURL = location.hash.match(/instance_url=([^&]*)/) ? decodeURIComponent(location.hash.match(/instance_url=([^&]*)/)[1]) : null; if (sAccessToken == null) { window.location.href = 'https://login.salesforce.com/services/oauth2/authorize?display=popup&response_type=token&client_id=<YOUR CONNECTED APP'S SECRET KEY>&redirect_uri=https://localhost' } //debugger; $Lightning.use( "c:LightningOutTaxonomyLoader" ,function() { $Lightning.createComponent( "c:OrchestraCMS_Sample_Multi_Content_By_Taxonomy_Loader" ,{ ComponentHeading: 'Header', <MORE ATTRIBUTES HERE> } ,"lightning" ,function(cmp) { //do some stuff debugger } ); } ,sInstanceURL ,sAccessToken ); </script> ......
Comments
Post a Comment