从jQuery调用支持AJAX的WCF服务

时间:2012-10-15 22:59:29

标签: wcf jquery jquery-mobile

我正在使用PhoneGap和jQuery Mobile开发移动应用程序。我的目标是创建一个Web服务,使客户端(移动)能够查询数据库。

经过一番研究,我发现AJAX Enabled Services可能就是我想要的。 所以,我首先创建了一个支持AJAX的WCF服务,现在我只添加了以下方法:

[OperationContract]
[WebInvoke(Method = "POST", RequestFormat = WebMessageFormat.Json)]
public string GetString()
{
    return "Hello there";
}

我的web.config看起来像这样:

<configuration>
    <system.web>
        <compilation debug="true" targetFramework="4.0" />
    </system.web>

    <system.serviceModel>
        <behaviors>
            <endpointBehaviors>
                <behavior name="WebApplication1.MobileServiceAspNetAjaxBehavior">
                    <enableWebScript />
                </behavior>
            </endpointBehaviors>
        </behaviors>
        <serviceHostingEnvironment aspNetCompatibilityEnabled="true"
            multipleSiteBindingsEnabled="true" />
        <services>
            <service name="WebApplication1.MobileService">
                <endpoint address="" behaviorConfiguration="WebApplication1.MobileServiceAspNetAjaxBehavior"
                    binding="webHttpBinding" contract="WebApplication1.MobileService" />
            </service>
        </services>
    </system.serviceModel>
</configuration>

完成此项服务后,我使用以下方法从客户端致电:

$.ajax({
    type: "POST",
    url: "http://localhost:11634/MobileService.svc/GetString",
    contentType: "application/json",
    data: "{}",
    dataType: "json",
    success: function (result) {
    $("#textbox").text(result);
    },        
    error: function (textStatus) {
        alert(textStatus);
    }
});

调用服务时,我收到以下错误[object Object]。你能指导一下我做错了什么以及我是否正在使用合适的技术吗?

3 个答案:

答案 0 :(得分:1)

正如Tariqulazam正确地指出[对象]不是错误而是响应对象。要访问数据,您可以将代码修改为:

success: function (result) {     
    var data = result.d
    $("#textbox").text(data);     
},

如果您想查看教科书示例,以下内容看起来就像是使用WCF Web服务的jQuery代码的一个很好的示例:

Consuming WCF service using jQuery

希望这有帮助!

答案 1 :(得分:0)

由于您没有传递参数,我会改为将其更改为GET调用,并删除ajax调用的数据部分。您返回的方式也是XML格式,将响应格式更改为JSON

    [OperationContract]
    [WebGet(UriTemplate = "/GetString", RequestFormat = WebMessageFormat.Json)]
    public string GetString()
    {
        return "Hello there";
    }

$.ajax({     
    type: "GET",     
    url: "http://localhost:11634/MobileService.svc/GetString",     
    contentType: "application/json",     
    dataType: "json",     
    success: function (result) {     
    $("#textbox").text(result);     
    },             
    error: function (textStatus) {     
        alert(textStatus);     
    }     
});

答案 2 :(得分:0)

你需要包装你的     $ .ajax({...}) 在函数调用中。这就是所谓的特定行动。