Tip #531: CRM, SPA and CORS walk into a bar

If you wanted to access your CRM from the javascript using web services, the only option until CRM 2016 was to wrap your script as a webresource. That way script is hosted in the same domain as CRM and “rides” authenticated session of your browser. External pages were no go because of the Cross-Origin Resource Sharing (CORS) issues.

CRM 2016 has CORS enabled so now you can create awesome things like single-page applications (SPA) that securely talk to CRM. I thought of putting some cool code together but, as usual, Jim “That’s Mr SDK for you” Daly was the first off the blocks with an SPA sample for CRM.

The most tedious part is authentication but now it’s an absolute breeze with the release of ADAL for javascript. Kilolines of code are now reduced to (simplified version, of course):

  window.config = {
      tenant: "contoso.onmicrosoft.com",
      clientId: "ef46083a-abba-dead-beef-4aafd81a93f5",
      postLogoutRedirectUri: 
           "http://contoso.com/crmspa.html",
      endpoints: { orgUri: 
           "https://contoso.crm.dynamics.com" },
      cacheLocation: 'localStorage', 
  };
  var ac = new AuthenticationContext(config);
  ac.login();
  ac.acquireToken(config.endpoints.orgUri, talkToCRM);

Detailed documentation is available, of course, from the Jim’s team. If you’re thinking of reusing your old code, that’s a no go, unfortunately, as CORS is only supported for Web API and not SOAP or OData v2.

5 thoughts on “Tip #531: CRM, SPA and CORS walk into a bar

  1. With CORS, your web app on one domain can freely communicate with your API on another domain and this HTML5 feature allows one site to access another site’s resources despite being under different domain names.

  2. Jaco says:

    I am really happy about this, but have not been able to get it running with CRM 2016 online trail instance I kicked off in O365.

    I keep on running into the following error via ADAL :

    ADAL error occurred: AADSTS50001: The application named mycrminstance.crm4.dynamics.com was not found in the tenant named mycrminstance.com. This can happen if the application has not been installed by the administrator of the tenant or consented to by any user in the tenant. You might have sent your authentication request to the wrong tenant.

    From debugging I could see that the

    authContext.acquireToken(organizationURI, retrieveAccounts) —>
    With in this function in the ADAL.js
    I found that
    var token = this.getCachedToken(resource); –>returns null

    It moves unto this area:
    if (this._getItem(this.CONSTANTS.STORAGE.FAILED_RENEW)) {
    this.info(‘renewToken is failed for resource ‘ + resource + ‘:’ + this._getItem(this.CONSTANTS.STORAGE.FAILED_RENEW));
    callback(this._getItem(this.CONSTANTS.STORAGE.FAILED_RENEW), null);
    This is were the Asyn call fails.

    Any ideas or suggestions

    • Jaco, have you tried reaching out to the community with your issue? As you’d appreciate, we have quite limited resources to assist with the troubleshooting right here on this site. Looking at the error message, it seems that either AAD domain is not configured correctly or you are using incorrect name for the resource. Also, have you registered your application in AAD?

  3. I know CORS, Why not try heroku with php is work fine to me =D

Leave a Reply

Your email address will not be published. Required fields are marked *