使用 jquery 在 ASP.net 中使用 WCF Rest Service答案

【问题标题】：Consume WCF Rest Service in ASP.net using jquery使用 jquery 在 ASP.net 中使用 WCF Rest Service
【发布时间】：2013-03-02 06:06:54
【问题描述】：

我正在尝试使用 jquery 在 asp.net 项目中使用 wcf rest api。为此我已经做到了：

创建了一个WCF Rest服务源代码，可以从here下载。
创建了一个 ASP.Net 项目以使用 jquery 使用该 restAPI。源代码here。

在单击按钮的 ASP .Net 项目中，我试图调用 REST 服务。但是每次我遇到两个问题时：

在 TestHTML5.js 中调用 var jsondata = JSON.stringify(request); 会引发错误，提示“Microsoft JScript 运行时错误：'JSON' 未定义”
当我按下忽略时，它会继续向 WCF Rest API 调用，但它总是返回错误（未找到）函数。 Rest API 永远不会被调用。

提前感谢大家的帮助。

回答： 解决方案和源链接可以在这个link上找到。

【问题讨论】：

您测试的是什么浏览器和浏览器版本？ JSON 对象在 IE7 中不可用
我使用的是 IE9。 Windows 8 中的 IE10 不会发生同样的问题。它可以正常工作（没有 Json 错误）。
确保您的页面没有以怪异模式呈现，也没有以compability mode 呈现。如果您想支持这些操作模式，那么 Sharrooz 的建议应该可行。看答案here
是的，第一个问题现在似乎可以正常工作了。我在 Windows 8 中切换到 IE10。我仍在为第二个问题苦苦挣扎，您对此有什么想法吗？

标签： asp.net-mvc wcf

【解决方案1】：

我查看了您提供的示例代码，问题是您违反了same origin policy restriction。您不能执行跨域 AJAX 调用。在您的示例中，服务托管在 http://localhost:35798 上，而 Web 应用程序在 http://localhost:23590 上调用它，这是不可能的。您必须在同一个 ASP.NET 项目中同时托管服务和调用应用程序。您似乎已尝试使用 ($.support.cors = true;) 在客户端启用 CORS，但您的服务不支持 CORS。

在调用页面 (TestHTML5.htm) 中看到的另一个问题是，您已经包含了两次 jquery（一次是缩小版，一次是标准版本），并且您在 jquery 之后包含了您的脚本 (TestHTML5.js)。您应该修复您的脚本引用。还有一个问题是以下行 <script type="text/javascript"/> 无效。

所以首先修复你的标记（我已经删除了你在标记中的所有 CSS 噪音，以便专注于重要部分）：

<!DOCTYPE html>
<html dir="ltr" lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>SignUp Form</title>
    <script type="text/javascript" src="../Scripts/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="../Scripts/TestHTML5.js"></script>
</head>
<body>
    <button id="Send" onclick="testHTML5OnClick();">
        Send Me ID!
    </button>
</body>
</html>

然后在您的TestHTML5.js 中，您也可以稍微清理一下。例如，您的服务正在侦听以下 url 模式 json/{id} 并仅接受 GET 动词，而您正在尝试使用不可能的 POST。除此之外，您还尝试使用对 GET 动词没有任何意义的 JSON.stringify 方法。您应该简单地将 id 作为您在服务中定义的 url 部分的一部分发送。

function testHTML5OnClick() {
    var id = 5;
    var url = "../RestServiceImpl.svc/json/" + id;
    var type = 'GET';
    callLoginService(url);
}

function callLoginService(url, type) {
    $.ajax({
        type: type,
        url: url,
        success: serviceSucceeded,
        error: serviceFailed
    });
}

function serviceSucceeded(result) {
    alert(JSON.stringify(result));
}

function serviceFailed(result) {
    alert('Service call failed: ' + result.status + '' + result.statusText);
}

【讨论】：

完美解释达林。它有魔力:-) 点对点解释得很好。我对这一切都很陌生，因此有所有这些故障。等我完成实验后，我可能会回来和你一起检查更多的东西。现在非常感谢您提供我正在寻找的确切内容。
嗨 Darin，一个简单的问题是，如果我们托管一个基于 WCF 的 REST API 并且有另一个使用简单 HTML5 和 jquery 的应用程序（可能在 java 或任何其他平台中），可以他们没有从这个 WCF RIA 中受益吗？
由于您的 WCF REST 服务正在处理 XML 和 JSON 等可互操作格式，因此从其他平台使用它绝对没有问题。
好的.. 那么在这种情况下，如果说我正在托管我的 WCF 服务，说 localhost:35798 并且我有另一个应用程序说一个纯 HTML5 站点并想使用 jquery 查询这个 WCF 服务，那么如何我应该这样称呼吗？假设 HTML 网站是一个完全不同的项目。请原谅我提出这些愚蠢的问题，因为我是这个 ASP 和 HTML 的新手。
这是不可能的，因为您无法执行跨域 AJAX 调用。有几个解决方法涉及在您的 REST 服务端启用 JSONP（而不是 JSON）或 CORS。

【解决方案2】：

你添加了这个引用吗？

script type="text/javascript" src="../../json.js"></script>

我有同样的问题，搜索我得到this 和这个result

【讨论】：

谢谢，我在 win7 中使用 IE9 时遇到的 IE10 (Windows 8) 问题似乎可以正常工作。但是，您是否知道似乎更麻烦的第二个问题。感谢大家提前帮助