Click here to Skip to main content
13,150,471 members (33,864 online)
Click here to Skip to main content
Add your own
alternative version


28 bookmarked
Posted 3 May 2010

Making Cross Domain jQuery AJAX Calls

, 3 May 2010
Rate this:
Please Sign up or sign in to vote.
Making Cross Domain jQuery AJAX Calls

Today's web browsers do not allow web pages to make cross-domain Ajax calls. By this, I mean that if you are at and try to make an Ajax call (a call using the XmlHttpRequest object), the browser would not allow this to happen. Why? For security purposes that I cannot currently name.

However, at some point, you get to a project where you're interfacing this third-party site that needs to talk to your main site, or some other similar situation where the only way you're going to get the data you need from point a to point b is with some JavaScript magic. Here is how to accomplish it.

How to Get/Post Data using jQuery/JavaScript (JSONP)

The short answer: it's not Ajax at all, its JSONP. Yes, JSONP is not Ajax. I just learned this today. Like I said earlier, browsers do not allow XHR/Ajax cross-browser requests. JSONP avoids this by making a request for a script file-- no Ajax at all. Let me explain:

  1. Instead of accessing the XHR object, the browser first creates a new script tag to inject into the HTML DOM
  2. The script tag's URL is set to the URL you're looking to get/post (using HTTP GET) data to
  3. The script tag is injected into the page, causing...
  4. The request is sent to the server, even if it's cross-domain
  5. The server returns the data in the form of a JavaScript function call
  6. The browser receives the data and executes the function call

jQuery Code

//use a get to post a querystring value via HTTP GET to an webhandler
     //really no need to do anything here, we're just posting data
     //but this will output success

ASP.NET Generic Handler/webhandler Code

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;

namespace jsonp_test
    /// <summary>
    /// Summary description for $codebehindclassname$
    /// </summary>
    [WebService(Namespace = "")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class get_post : IHttpHandler
        public void ProcessRequest(HttpContext context)
            string callback = "";
                if (!string.IsNullOrEmpty(context.Request["callback"]))
                    if (!string.IsNullOrEmpty(context.Request["var1"]))
                    callback = context.Request["callback"];

                    context.Response.Write(callback + "({ \"return\": \"Success\" })");
            catch (Exception exc)
                //hopefully this error doesn't contain any quotes... you know?
                context.Response.Write(callback + "({ \"return\": \"" + exc.Message + "\" })");

        private void SaveData(string value)
            //do something with the var1 posted to us

        public bool IsReusable
                return false;

So what we effectively have here is the setup for ASP.NET cross domain Ajax calls using jQuery.

How to Do Cross-domain Calls to Others' Servers: YQL

What if you need to do a get, but don't have the ability to make the page it's posting to return a JSONP response? Using YQL is a great way to achieve this.

YQL is a way to query the internet like it is a database. For example, one could easily run:

select * from html where url=""

and receive a JSONP return containing all of the site's HTML. You could also do the following:

select * from html where url=""

and HTTP GET values to the server. YQL does not allow this to happen on any area of any site that is blocked by the robots.txt file. Here's the full example code:

//feel free to add querystring vars to this
var myurl="";
//make the call to YQL 
            //this data.results[0] is the return object you work with, 
            //if you actually want to do something with the returned json
          } else {
            var errormsg = 'Error: could not load the page.';
            //output to firebug's console
            //use alert() for other browsers/setups


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Chief Technology Officer
United States United States
Pittsburgh-based developer.

You may also be interested in...


Comments and Discussions

QuestionHow to POST data ??? Pin
Thandermax11-May-10 7:59
memberThandermax11-May-10 7:59 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web03 | 2.8.170924.2 | Last Updated 3 May 2010
Article Copyright 2010 by micahs
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid