Jquery – Calling wcf rest service from jquery doesn’t work

jqueryjsonrestwcf

I have written a really simple wcf rest service which seems to work fine when I make requests to it through fiddler but I cannot get it to work when calling it from JQuery.

Service:

[ServiceContract]
public interface IService1
{
    [OperationContract]
    [WebInvoke(Method = "POST",
                UriTemplate = "customers/{regionId}",
                ResponseFormat = WebMessageFormat.Json
    )]
    Customer[] GetCustomers(String regionId);
}

[DataContract]
public class Customer
{
    [DataMember]
    public Guid Id { get; private set; }

    [DataMember]
    public String Name { get; private set; }

    public Customer(Guid id, String name)
    {
        Id = id;
        Name = name;
    }
}

public class Service1 : IService1
{        
    public Customer[] GetCustomers(String regionId)
    {
        return new[]
               {
                   new Customer(Guid.NewGuid(), "john"),
                   new Customer(Guid.NewGuid(), "pete"),
                   new Customer(Guid.NewGuid(), "ralph")                       
               };
    }
}

I can make requests to this service via fiddler and it returns the expected json. However, when I try and call it with JQuery ajax via the firebug console it always fails. Here is the call:

$.ajax({
type: "POST",
data: "{}",
url: "http://127.0.0.1:8081/json/customers/1",
contentType: "application/json; charset=utf-8",
dataType: "json",
success:function(res)
{
alert('success');
},
error: function(xhr)
{
alert('failed: '+xhr.responseText);
}
});

I always get the failed alert and the responseText is always blank. Any ideas would be greatly appreciated.

Best Answer

When you say "via Fiddler" do you mean "using Fiddler's request builder" or do you mean "with Fiddler running?"

Question: What URL is your website running on? You cannot generally make XHR requests to different servers (or ports, in FF) using XHR.

Related Topic