Question

I am trying to call external web service, its work fine in chrome, but not in firefox and IE. In chrome, it returns 'true', but in firefox, it returns '0 error', it here is my complete code…

 <script type="text/javascript" src="js/jquery-1.3.1.min.js"></script>
<script type="text/javascript">

    $(document).ready(function () {
        $("#btnCall").click(function (event) {
            var campaignid = 1000007;
            var r_source_id = 1000008;
            var parameters = "{'CompanyName': '" + document.getElementById('txtCompanyName').value + "', 'name': '" + document.getElementById('txtName').value + "', 'title': '', 'email':'" + document.getElementById('txtEmail').value + "', 'phone':'" + document.getElementById('txtPhoneNo').value + "', 'web_url':'', 'no_of_emp':'0', 'c_Currency_id':'100', 'r_source_id':'" + r_source_id.toString() + "', 'industry_ID':'1', 'city':'', 'country_ID':'" + document.getElementById('ddlCountry').value + "', 'cur_solution':'','pur_timeline':'','comments':'', 'year_sell_erp':'2013', 'support':'', 'bpgroup_ID':'1', 'C_Campaign_ID':'" + campaignid.toString() + "', 'R_STATUS_ID':'1000033', 'C_Region_ID':'100', 'CreatedBy':'1000012', 'salesrep_id':'1000012', 'ad_org_id':'1000001', 'ad_client_id':'1000001', 'UpdatedBy':'100', 'AccessKey':'caff4eb4fbd6273e37e8a325e19f0991'}";
            $.ajax({
                type: "POST",
                url: "http://cloudservice.softwareonthecloud.com/service.asmx/SetLead",
                data: parameters,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                async: false,
                success: function (msg) {
                    AjaxSucceeded(msg);
                },
                error: AjaxFailed
            });
        });
    });
    function AjaxSucceeded(result) {
        alert(result.d);
    }
    function AjaxFailed(result) {
        alert(result.status + ' ' + result.statusText);
    }  
</script>

Here is I have upload this function URL for testing

Answer 1

You are getting this error cause you are trying to call a web service on another domain. This violates the Same origin policy. This is a security limitation. Most older browsers will deny such requests.

You will need to setup Cross-Origin Resource Sharing if you want to access a different domain the webservice in javascript.

Cross-origin resource sharing (CORS) is a mechanism that allows a web
page to make XMLHttpRequests to another domain. Such “cross-domain”
requests would otherwise be forbidden by web browsers, per the same
origin security policy. CORS defines a way in which the browser and
the server can interact to determine whether or not to allow the
cross-origin request

If you have access to the webservice code, you can enable CORS requests at the server.
Enable cors is a good resource. Here is some explaination on cors

On IIS 7, you need to set a few custom headers in your web.config.

<system.webserver>
 <httpprotocol>
  <customheaders>
   <add name="Access-Control-Allow-Origin" value="*" />
   <add name="Access-Control-Allow-Headers" value="Content-Type" />
  </customheaders>
 </httpprotocol>
</system.webserver>

Here are the steps for IIS6

Security Note: For an example here, I have allowed all requests to the server. You may want to limit this to selected domains if you are serving sensitive data.

WCF based requests too can be inspected via the WebOperationContext.Current.IncomingRequest and appropriate headers can be sent out.

CORS requests are not supported on older browsers. You can see the full browser compatibility list here

If you must support older browsers, or cannot change the webservice, you can always host a webservice proxy on your server. You send the request to your server, and your server requests the data from the original webserivce. This works fine, cause it does not violate the cross origin policy. A simple http handler can server as the proxy on your server.

Here is what a sample http handler proxy to a REST webservice would look like:

public void ProcessRequest(HttpContext context) {
  WebClient myClient = new WebClient(); 

  //Fetch response on your server
  string response = myClient.DownloadString("http://example.com/webservice/webMethod");

  // Send response to your javascript.
  context.Response.Write(response);
}

You could then call this handler as required from javascript.