Any way to make API call from Lightning Component and NOT use an Apex controller?

Question

I currently have some inline Visualforce pages on our Case page layout that retrieve case-related data from webservices on our corporate network using jQuery and AJAX, format it, and display it so that our Support reps have more data to troubleshoot cases with (data that doesn't live in Salesforce).

I'm starting to investigate Lightning Components as a way for us to write a next generation case management application (for desktops, not for mobile) and totally customize it for our specific needs.

However, I hit a snag yesterday when I found out that as part of the Lightning CSP/LockerService, making API calls from Lightning Components is restricted, unless you go through a server-side Apex controller. This would be difficult to do, because I doubt I could get the database or webservice punched through the corporate firewall and exposed to Salesforce.

So...is there ANY way right now to make API calls from Lightning Components and NOT go through an Apex controller?

If there's absolutely no way to do this (and a feature to do this isn't coming soon), is using Visualforce to serve up a SPA using another framework the next best option?

Any ideas appreciated - thanks!

Answer 1

Use this documentation article as guideline.

By default, you can’t make calls to third-party APIs from client-side code. Add a remote site as a CSP Trusted Site to allow client-side component code to load assets from and make API requests to that site’s domain.

The Lightning Component framework uses Content Security Policy (CSP), which is a W3C standard, to control the source of content that can be loaded on a page. Lightning apps are served from a different domain than Salesforce APIs, and the default CSP policy doesn’t allow API calls from JavaScript code. You change the policy, and the content of the CSP header, by adding CSP Trusted Sites.

So you just need to add your destination as CSP Trusted Site.

However, you can't use native Lightning components to perform callouts to remote sites, you still need jQuery or equivalent libraries to make $.ajax calls.

Answer 2

Currently there is no supported way to make client side callout from lightning components .You will have to go through apex controller to make this happen .

There is definitely future possibility to allow this .We will have to wait for this and locker is supposed to enable this feature .

The next bet is ofcourse to use any JS framework like ReactJs or AngularJs and build a SPA app .You will build your controller so that its reusable when you finally want to migrate to actual component based model

Also use SLDS CSS framework if you have flexibility in styling so that its easier to keep it consistent with the new Lightning UI .

Using Angular or React you should be able to use XHR client side callout provided you have configured Remote Site Settings .

Answer 3

what you can do is create a visualforce page, that acts like a bridge to make callouts. Put this page in your component as an iframe with 0 pixels. Using postMessage to communicate with the visualforce page, this page will make the callout. Then your lightning component will listen for the response.