What is the correct architectural pattern for cross domain REST call in AngularJS?

Question

I've created an AngularJS service that is hitting the Salesforce REST API directly from the client. However, I haven't been able to get it working due to same origin restrictions. Even when accessing non authenticated REST services and trying both $http, $http.json and Ajax. I've also tried lots of combinations of Json, Jsonp etc.

Given that I've had so many issues I'm thinking that my general approach is incorrect. Perhaps I need to setup a proxy server for this? My backend is Firebase so I don't currently have my own server.

I don't believe that the Salesforce API supports CORs and I cannot change that.

Here is an example of what I tried using $http and Ajax.

return $http.jsonp('https://na1.salesforce.com/services/data/',{

headers: {

    'Content-type': 'application/json', 'Accept': 'application/json'

}}). 

                success(function (data, status, headers, config) {

                    callback(data);

                    console.debug(data.json);

                }).

                error(function (data, status, headers, config) {

                    console.debug("getVersions: failed to retrieve data: "+eval(data));

                });

$.ajax({

              url: 'https://na15.salesforce.com/services/data',

          type: "GET",

              dataType: "jsonp",

              beforeSend: function(xhrObj){

                                  xhrObj.setRequestHeader("Content-Type","application/json");

                                  xhrObj.setRequestHeader("Accept","application/json");

                                  xhrObj.setRequestHeader("X-Requested-With", "XMLHttpRequest");

                              },

              success: function (data) {

                  console.debug(data);

                  callback(data);

              },

              error: function(data) {

              }

          });

Answer 1

For this, you'll have to go into Remote Settings within SalesForce then go to CORS and then whitelist the domain name...

I had the same issue and it seemed to have resolved the issue.

Do you want to build a career in Salesforce? Enroll in this Salesforce certification course to start your journey!