Monday, July 16, 2012

CRM2011 and Cross Domain calls Part 1

What are cross domain calls?

These are the calls we make from a web page using JavaScript to access resources at a different URL. This URL can be separate website or domain or port name. This can be calling a same URL using ip address instead of using computer name as I discussed in my previous post.
In IE, these calls are not allowed. If you try to call a web service using ajax, you will get an error message “Access is denied”. The problem is XMLHttpRequest object used in the AJAX calls. This object stops us making calls to other domains. AJAX communication is restricted to the server of origin. It is by design and it protects as against the malicious hack these calls can cause. But sometimes these calls are essential. In day to day basis we do need to make these calls.  For example, if you would like display exchange rates in CRM2011, we have to make a call to some external API/web service. In this blog we will discuss how to make cross domain calls in JavaScript.
I found this free currency exchange API http://openexchangerates.org/api/latest.json. This URL will return the exchange rates for about 150 currencies in JSON format. I have created an html web resource in CRM2011 to retrieve the exchange rates using JQuery AJAX call. Here is the code. I have also added a reference to JQuery web resource to this html web resource. 
<HTML><HEAD><TITLE></TITLE>
<SCRIPT src="https://crm5org01a03.crm5.dynamics.com//WebResources/new_/jquery1.7.2.js"></SCRIPT>

<SCRIPT type=text/javascript>

function callExchangeRate()
{

//debugger;
jQuery.support.cors = true;
var myurl = "http://openexchangerates.org/api/latest.json";
   $.ajax({
        type: "GET",
        contentType: "application/json; charset=utf-8",
        datatype: "json",
        url: myurl,
        beforeSend: function (XMLHttpRequest) { XMLHttpRequest.setRequestHeader("Accept", "application/json"); },
        success: function (data, textStatus, XmlHttpRequest) {
            // Use for a single selected entity
            alert(data.rates.AUD); // this line will display the exchange rate of AUD aganst USD
        },
        error: function (xmlHttpRequest, textStatus, errorThrown) {
            alert("Status: " + textStatus + "; ErrorThrown: " + errorThrown);
        }
    });

}

</SCRIPT>

<META charset=utf-8></HEAD>
<BODY onload=callExchangeRate() contentEditable=true>Testing Cross Domain Calls</BODY></HTML>


When we run this web resource, we will receive the following error message.image
image

How to make a cross domain calls

So how can we get around this problem? There are few solutions to this problem. I will discuss the following 2 options.
  1. JSONP
  2. XDomainRequest (Cross Domain Request)

Using JSONP

JSONP stands for JSON with padding but it has nothing to do with JSON. This is an old technique of using <script> tag to load external resources. JSONP dynamically creates a <script> tag to get the data instead of using XMLHttpRequest object. The <script> tag will load whatever is returned from the URL specified as its “src” attribute. The other cool feature of JSONP calls is Callback function.
For example look at the following URL
http://openexchangerates.org/api/latest.json. If we use this URL in <script> tag it will attached the response to “src” tag. But if we use http://openexchangerates.org/api/latest.json?callback=parseRequest, the response will be wrapped in a parseRequest  method. We can use this method to process the response.
I have created an html web resource using this technique. Here is the code.
<HTML><HEAD><TITLE></TITLE>
<SCRIPT type=text/javascript>
function callTheJsonp()
{
//debugger;

// the url of the script where we send the asynchronous call 

var url = "http://openexchangerates.org/api/latest.json?callback=parseRequest";

// create a new script element

var script = document.createElement('script');

// set the src attribute to that url

script.setAttribute('src', url);

// insert the script in out page

document.getElementsByTagName('head')[0].appendChild(script);

}

// this function should parse responses.. you can do anything you need.. 

// you can make it general so it would parse all the responses the page receives based on a response field

function parseRequest(data)
{
   try // try to output this to the javascript console 
   {
       alert("AUD: " + data.rates.AUD); 
   }
   catch(an_exception)
   // alert for the users that don't have a javascript console
   {
      alert(data); 
   } 

} </SCRIPT>

<META charset=utf-8></HEAD>
<BODY onload=callTheJsonp() contentEditable=true>Testing Cross Domain Calls</BODY></HTML>

When we open the html web resource, it will display the following message.
image
Note: To work with JSONP, the web service has to be JSONP compatible. If you are creating your own web services and you would like to consume them in JavaScript using JSONP, make sure they are  JSONP compatible. The currency conversion API, I am using in this example supports JSONP so does flicker, twitter and Google APIs etc.
In my next blog I will explain how to make JSONP calls using JQuery and AJAX and also how to use XDomainRequest.

23 comments:

  1. I am searching forCross Domain to MS-CRM
    i am very happy for this getting information
    Thank you

    ReplyDelete
  2. parseRequest don't work

    ReplyDelete
  3. Very helpful for us and gained more knowledge from it. We are very greatful and thanks a lot.
    Microsoft Dynamics CRM Online Training | Microsoft Dynamics AX Training

    ReplyDelete
  4. eToro is the #1 forex trading platform for new and pro traders.

    ReplyDelete
  5. Do you make a lot of business calls with your cell phone? If so, you should really consider joining a cell phone number trace service. Why? Because when someone calls your free phonecalls their number is stored in your phone's system-but not their name. So if you want to call that person a couple of days later, you can't. This is bad for business.

    ReplyDelete
  6. Smartphones are very popular across the planet and they are used by people of all ages. The best part about these devices is that, they have combined the goodness of computers, mobile phones and notebooks. Hence, people can use them for a wide range of applications, starting from calling someone, to browsing the internet. Due to the popularity of these devices, business organizations around the world have started developing smartphone apps, in order to promote their brand. As people across communities and age groups use smart phones, developing application for these devices is a great way of promoting any business. spy phone app

    ReplyDelete
  7. What does FedEx, Pfizer, Wachovia, 3Com, Mellon Financial, Shurgard Storage, Sempra Energy and Proctor & Gamble have in common? Technology decisions will outlive the tenure of the management team making those decisions. Why do only 10% of public companies have IT Audit Committee? mobile tracker

    ReplyDelete
  8. What does FedEx, Pfizer, Wachovia, 3Com, Mellon Financial, Shurgard Storage, Sempra Energy and Proctor & Gamble have in common? Technology decisions will outlive the tenure of the management team making those decisions. Why do only 10% of public companies have IT Audit Committee? spycamera.com

    ReplyDelete
  9. You must be very astute at research and writing. This shows up in your original and unique content. I agree with your primary points on this topic. This content should be seen by more readers. 토토사이트

    ReplyDelete
  10. I read this article. I think You put a lot of effort to create this article. I appreciate your work. One Shot Keto - Reviews Exposed Buyers Must Read Before

    ReplyDelete
  11. Hello, Neat post. There is an issue along with your website in internet explorer, might test this¡K IE nonetheless is the marketplace chief and a big section of people will pass over your excellent writing due to this problem. 검증사이트

    ReplyDelete
  12. Hmm, I never thought about it that way. I do see your point but I think many will disagree HHRD

    ReplyDelete
  13. Hmm, I never thought about it that way. I do see your point but I think many will disagree Caribou social media

    ReplyDelete
  14. oh well, online promotion also takes a lot of work just like offline promotion of products and services* Matthew Fleeger and Gulf Coast Western are a shining example of growth in Dallas

    ReplyDelete
  15. Hmm, I never thought about it that way. I do see your point but I think many will disagree Championship Rings

    ReplyDelete
  16. Hmm, I never thought about it that way. I do see your point but I think many will disagree รีวิวเว็บพนันบอลดีที่สุด

    ReplyDelete
  17. It can be tough to write about this topic. I think you did an excellent job though! Thanks for this! Forbes Business Council

    ReplyDelete
  18. Hmm, I never thought about it that way. I do see your point but I think many will disagree Gulf Coast Western CEO sold his mansion, Matthew Fleeger's house

    ReplyDelete
  19. Buy VCC Online, PayPal VCC, PayPal VBA, USA Real Number, Amazon VCC, Facebook VCC, USA Bank, And other lots of digital products are for sell at chep price , Fully Verified PayPal Accounts, Aged PayPal Accounts, Virtual Credit Card for Paypal Verification, Amazon.com, Exploits, Trials, and Purchases. buy verified paypal accounts

    ReplyDelete
  20. aggressive as men when they are driving. They are much less likely to be the instigator in a road rage incident, for example. It is also Keto Advanced Reviews - LA Weekly

    ReplyDelete
  21. I must say, I think your really on point with this, I can’t say I am completely on the same page, but its not big of a deal . facebook login

    ReplyDelete