【问题标题】:Calling an AJAX Enabled WCF Service from jQuery从 jQuery 调用启用 AJAX 的 WCF 服务
【发布时间】:2012-10-15 22:59:28
【问题描述】:

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

经过一番研究,我发现支持 AJAX 的服务可能正是我所寻找的。 因此,我首先创建了一个支持 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]。您能否指导我做错了什么以及我是否使用了正确的技术?

【问题讨论】:

  • [object Object] 不是错误。你得到了一个 JSON 对象的响应。您需要解析对象以获得所需的值。如果您在成功回调中尝试 result.d,很可能会得到字符串。使用 FireBug 或 HTTPFox 等 HTTP 跟踪工具准确查看您得到的结果。

标签: wcf jquery jquery-mobile


【解决方案1】:

正如 Tariqulazam 正确指出的那样,[Object object] 不是错误,而是响应对象。要访问数据,您可以修改代码以读取:

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

如果你想看一个教科书的例子,下面是一个使用 WCF 网络服务的 jQuery 代码的好例子:

Consuming WCF service using jQuery

希望这会有所帮助!

【讨论】:

  • 我检查了萤火虫来检查我到底得到了什么错误,但我得到了一个NetworkError: 405 Method Not Allowed
  • 嗯,我最好的选择是它是某种跨域问题 - 你的 JavaScript 代码在哪个地址运行?我建议您使用相对 URL 而不是绝对 URL。
【解决方案2】:

你需要包装你的 $.ajax({ ... }) 在函数调用中。这样就调用了特定的操作。

【讨论】:

  • 是的,它被包裹在一个点击函数中。
【解决方案3】:

由于您没有传递参数,因此我会将其更改为 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);     
    }     
});

【讨论】:

  • 我按照你说的做了,但现在我收到以下错误:NetworkError: 405 Method Not Allowed
  • 对不起,我忘了把ajax调用类型也改成“GET”了。
  • 首先,感谢您的帮助。我想你的意思是[WebInvoke(Method = "GET", ResponseFormat = WebMessageFormat.Json)] 。我将 dataType 更改为“jsonp”,但出现新错误SyntaxError: invalid label
  • 不,保留在 WebGet,dataType 应该是 'json' 而不是 jsonp,不知道是不是笔误:)
  • 不,不是。我这样做了,因为我的服务和我的客户端应用程序位于不同的域中。请帮忙!
猜你喜欢
  • 2011-05-29
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-04-27
  • 2014-07-08
相关资源
最近更新 更多