从jQuery调用WCF服务有什么问题？

Question

This function is wired up to the click event of a button:

function BlahBlahBlahWCFXML() { 
    varType = "POST"; 
    varUrl = "http://123.123.123.123/NameOfService.svc/GetStuffById"; 
    varData = '{"stuffId": "' + 12345678-abcd-9012-3456-abcdefghjkl' + '"}'; 
    varContentType = "application/json; charset=utf-8";  
    varDataType = "xml";  
    varProcessData = true; 
    CallService(); 
} 

That function then calls this one:

//Generic function to call AXMX/WCF  Service         
function CallService()  
{ 
        $.ajax({ 
            type        : varType, //GET or POST or PUT or DELETE verb 
            url         : varUrl, // Location of the service 
                    cache       : false, 
            data        : varData, //Data sent to server 
            contentType : varContentType, // content type sent to server 
            dataType    : varDataType, //Expected data format from server 
            processdata : varProcessData, //True or False 
            success     : function(msg) {//On Successfull service call 
            ServiceSucceeded(msg);                     
            }, 
            error: ServiceFailed// When Service call fails 
        }); 
} 

When I try to run the sample, I get the following in Google Chrome's developer tools, console window:

Failed to load resource: the server responded with a status of 400 (Bad Request) XMLHttpRequest cannot load http://123.123.123.123/NameOfService.svc/GetStuffById . Origin null is not allowed by Access-Control-Allow-Origin.

The service is working fine and I'm currently calling it from webforms and console apps. GetStuffById is the method I want to call. It accepts a string (GUID in this case) as a parameter and returns a string.

The service is a WCF service and is configured to return a SOAP message. I'd prefer JSON but that's another issue for another question some other day.

Any ideas what's going on here? Thanks!

UPDATE #1 - I changed the POST to a GET. Still no-go.

Answer 1

Looking at your code:

1. All the variables inside BlahBlahBlahWCFXML are not accessible to CallService() .
2. varData 's value has extra ' (single quote). If the GUID is a constant value you can do away with the string concatenation and simply write:
   varData = '{"stuffId": "12345678-abcd-9012-3456-abcdefghjkl"}';
   However, if GUID is a variable, generate the GUID somewhere else and just put the variable here instead:
   varData = '{"stuffId": "' + varGUID + '"}';

Answer 2

Looks like you're trying to call a WCF SOAP webservice from jQuery. This isn't going to work out of the box. The WCF SOAP service expects a SOAP message to call it--- simply going to the URL isn't going to work. If you insist on WCF there are some extensions for restful WCF which will make this much easier.