{"id":7147,"date":"2020-07-20T02:29:06","date_gmt":"2020-07-20T06:29:06","guid":{"rendered":"https:\/\/www.jitendrazaa.com\/blog\/?p=7147"},"modified":"2020-07-20T02:29:06","modified_gmt":"2020-07-20T06:29:06","slug":"salesforce-integration-with-nodejs-based-applications-using-canvas","status":"publish","type":"post","link":"https:\/\/www.jitendrazaa.com\/blog\/salesforce\/salesforce-integration-with-nodejs-based-applications-using-canvas\/","title":{"rendered":"Salesforce Integration with Nodejs based applications using Canvas"},"content":{"rendered":"\n

Salesforce provides many ways to integrate with external systems like SOAP, Rest, Bulk API, User Interface API and so on. One of useful way to integrate any existing web applications with Salesforce is using Canvas.<\/p>\n\n\n\n

For sake of this post, I’m using Nodejs application and complete source code can be found here<\/a> , on my Github repository<\/a>. It can be deployed on Heroku easily, however I used my local computer to run canvas. That also proves point that integration is happening via Browser and therefore canvas application can be hosted on premise and not necessarily on DMZ layer<\/a>.<\/p>\n\n\n\n

Step 1 : Create Connected App in Salesforce<\/h3>\n\n\n\n

Enable OAuth in Connected app and provide any Callback URL. Canvas app does not use callback URL however we DO NEED scope. <\/p>\n\n\n\n

Next step would be enabling canvas app itself connected app along with locations where we would be using it. <\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n\n\n\n\n

Step 2 : Wrap Canvas Connected App in Visualforce<\/h3>\n\n\n\n

In this post, we will host canavs app in Visualforce page and then add Visualforce page on Account page. LWC still odes not support Canvas app and I’m not huge fan of Aura , so VF fits the bill for quick demo.<\/p>\n\n\n\n

Visualforce Source Code<\/p>\n\n\n

\n<apex:page standardController="Account">\n    <apex:canvasApp applicationName="Localhost_Connected_App" \n        height="2000px" width="750px"\/>\n<\/apex:page>\n<\/pre><\/div>\n\n\n
For more advance control & granular capability, we can inject Lifecycle class in Canvas app, full documentation can be found in canvas developer guide here<\/a>. Below source code I’ve used in video demo<\/p>\n\n\n
\n\/**\n * Sample Apex class to show case Canvas Life Cycle class demo\n *\/\npublic with sharing class CanvasDemoAppLifeCycle \n    implements Canvas.CanvasLifecycleHandler {\n\n        public Set<Canvas.ContextTypeEnum> excludeContextTypes(){\n            Set<Canvas.ContextTypeEnum> excluded = new Set<Canvas.ContextTypeEnum>();\n    \n            \/\/ Code goes here to add items to excluded list\n            \/\/ that should be excluded from Context data\n    \n            return excluded;\n        }\n    \n        public void onRender(Canvas.RenderContext renderContext) {   \n            \/\/ Get the Application and Environment context from the RenderContext\n            Canvas.ApplicationContext app = renderContext.getApplicationContext();\n            Canvas.EnvironmentContext env = renderContext.getEnvironmentContext();\n\n            if (false){ \n                throw new Canvas.CanvasRenderException('This is sample error message');\n            } \n\n            Set<String> fields = new Set<String>{'*','Name'};\n            \/\/env.addEntityFields(fields);  \n        }\n    }\n<\/pre><\/div>\n\n\n
\n