14

I'm programming developer tools and an IDE. Right now, my code is based on Visualforce and JavaScript. As described here, I would like to convert most of my API callouts form APEX to JavaScript.

Also I would like to shift my development form Visualforce to Lightning. But API access seems to be a challenge: How to call a Salesforce REST URL from Lightning Component?

CSP is blocking the access and I'm not clear about the future perspective on this.

MartyC. found a workaround, which bypasses this limitation via APEX. But if my understanding of Dougs answer is correct, this path is open unintentionally and is likely to be closed in the future:

The lightning application separate domain also uses a special lightning session ID that does not have direct API access. The fact that you can currently provide indirect access to a fully API capable session ID is a great example of why our content security policy is currently so restrictive. Leaking an API said back to the client in a way that malicious JavaScript can easily steal is precisely why we have things locked down so tightly today.

So as a consequence Lightning Apps can best case try to get indirect API access. If the API access is turned off on purpose for security reasons, indirect mechanisms could also count as "hacks" and might be prevented later.

Are there any plans to open up Lightning API access in the near future?

16

We are still working out the details of this type of access - there are multiple reasons we have this in place today:

  • security as discussed in my other posts/answers
  • performance: direct access via arbitrary XHR client code cannot take advantage of the scarce resource (connections) management infrastructure provided by Lightning's Action Service. We've had significant challenges in this area within Salesforce because our native container and web content do not share a common scarce resource layer
  • offline support: the offline, occasionally connected, and locally served speed capabilities in S1 and other Lightning based applications is based on Action Service, Storage Service, and the upcoming Data Service. Going "around" these services is going to bite most projects at some point and we're really trying to future proof things and save everyone a ton of grief

One thing we are looking into is providing a thin XHR proxy that is build on top of the Action Service, Storage Service, etc. I've personally been working on this concept as a plugin for AngularJs's $http API - would let you use Angular's $http API and get the Lightning Components Action Service benefits simultaneously! Same idea for Sencha Ext/Touch with a DataProxy implemented on top of ActionService.

  • Thanks Doug, this sounds promising. So for now apps with focus on reading and writing metadata should perhaps better wait. If something comes up to test or to contribute, let us know. Would really like to port CodeFusion to Lightning. – Uwe Heim Mar 6 '15 at 9:51
  • 2
    Hi @doug, it has been a while since you posted about $http. Any update on such service being planned? Thanks. – singularity May 24 '17 at 23:09
-2

It's now possible to call external API using Javascript from within Salesforce Lightning.

Start by going to Setup → CSP Trusted Sites and adding your trusted site.

Which in this example is: https://api.postcodes.io/

Then use an approach like this:

({
    postcodeSearch : function(component, postcode) {
        var url = 'https://api.postcodes.io/postcodes/' + postcode;
        this.makeAjaxRequest(component, url);
    },
    callAjax : function(method, url, async, callback) {
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function(component) {
            if (xmlhttp.readyState == 4 ) {
                callback.call(this, xmlhttp);
            }
        };

        xmlhttp.open(method, url, async);
        xmlhttp.send();
    },
    makeAjaxRequest : function(component, url) {
        this.callAjax("GET", url, true,
                      function(xmlhttp){
                          if (xmlhttp.status == 200) {
                              console.log(xmlhttp.responseText);
                          }
                          else if (xmlhttp.status == 400) {
                              console.log("makeAjaxRequest: 400 Error");
                          }else {
                              console.log("makeAjaxRequest: Error");
                          }
                      }
                     );
    }
})

If you get a CORS error, you can can go to:

Setup > CORS > Newthen enter an origin URL pattern

Use CORS to Access Salesforce Resources from Web Browsers

Cross-Origin Resource Sharing (CORS) enables web browsers to request resources from origins other than their own (cross-origin). For example, using CORS, JavaScript code at https://www.example.com could request a resource from https://www.salesforce.com. To access supported Salesforce APIs, Apex REST resources, and Lightning Out from JavaScript code in a web browser, add the origin serving the code to a Salesforce CORS whitelist.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.