WCF4 REST与Jquery的跨域问题
我的WCF REST服务目标是.NETFramework4。我正在使用WebScriptEndPoint的标准端点和基本身份验证 当我使用Jquery使用这个服务时,当我在同一个服务应用程序中使用该页面时,它可以正常工作。http://localhost. 但如果我使用不同的web应用程序使用此服务,即。http://localhost:20984 它不起作用。 当我尝试时,小提琴手就会出现http://localhost/WebHttpBindTest/JSONAPIDemo.aspx 但当我尝试使用web应用程序时WCF4 REST与Jquery的跨域问题,wcf,wcf-client,Wcf,Wcf Client,我的WCF REST服务目标是.NETFramework4。我正在使用WebScriptEndPoint的标准端点和基本身份验证 当我使用Jquery使用这个服务时,当我在同一个服务应用程序中使用该页面时,它可以正常工作。http://localhost. 但如果我使用不同的web应用程序使用此服务,即。http://localhost:20984 它不起作用。 当我尝试时,小提琴手就会出现http://localhost/WebHttpBindTest/JSONAPIDemo.aspx 但当我
GET http://localhost/WebHttpBindTest/Service.svc/GetData?value=fdsafa&callback=jsonp1337264499382&_=1337264533468 HTTP/1.1
Accept: application/javascript, */*;q=0.8
Referer: http://localhost:20984/WebSite1/Demo.htm
Accept-Language: en-US
User-Agent: Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)
Accept-Encoding: gzip, deflate
Host: localhost
Connection: Keep-Alive
查看使用web app页面发送时缺少授权标头
看起来这是跨域问题。我确实启用了跨域脚本访问,即
这是服务合同:
[ServiceContract]
public interface IService
{
[WebGet(ResponseFormat = WebMessageFormat.Json)]
[OperationContract]
string GetData(string value);
}
WEB.Config
JQuery表单:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="Base64.js" type="text/javascript"></script>
<script src="jquery.min.js" type="text/javascript" language="javascript"></script>
<script type="text/javascript">
var Type;
var Url;
var Data;
var ContentType;
var DataType;
var ProcessData;
function CallService(successfn,auth) {
var addHeaders = function (xhr) {
xhr.setRequestHeader("Authorization", auth);
};
$.ajax({
type: Type, //GET or POST or PUT or DELETE verb
url: Url, // Location of the service
data: Data, //Data sent to server
contentType: ContentType, // content type sent to server
dataType: DataType, //Expected data format from server
processdata: ProcessData, //True or False
beforeSend: addHeaders,
success: function (msg) {//On Successfull service call
successfn(msg);
},
error: ServiceFailed// When Service call fails
});
}
function make_base_auth(user, pass) {
var tok = user + ':' + pass;
var hash = Base64.encode(tok);
return "Basic " + hash;
}
function getUrl() {
var auth = make_base_auth('user', 'password');
Type = "GET";
Url = "http://localhost/WebHttpBindTest/Service.svc/GetData?value=" + $('#txtCode').val();
ContentType = "text/json; charset=utf-8";
DataType = "jsonp";
ProcessData = true;
CallService(ServiceSucceeded,auth);
}
function ServiceSucceeded(result) {
var resultObject = null;
if (DataType == "jsonp") {
if (Url.indexOf(".asmx/") > 0) {
resultObject = result.d;
}
else {
$("#div1").html("Result:" + result);
}
}
}
function ServiceFailed(result) {
alert('Service call failed: ' + result.status + '' + result.statusText);
Type = null; Url = null; Data = null; ContentType = null; DataType = null; ProcessData = null;
}
</script>
</head>
<body>
<div id="container">
<h1>JSON API Demo</h1>
<div>
<p>Type Something: <input type="text" id="txtCode" />
<button type="submit"value="submit" id="btnGetUrl" onclick="getUrl()">Get</button>
</div>
<br /><br />
<center><div id="div1" style="font-size:larger"></div> </center>
</div>
</body>
</html>
如果希望通过jQuery访问端点,则应使用标准端点,而不是。WebScript端点应仅用于使用ASP.NET AJAX框架的客户端。如果要通过jQuery访问端点,应使用标准端点,而不是。WebScript端点应仅用于使用ASP.NET AJAX框架的客户端。感谢您的响应。我甚至尝试使用标准端点,仍然存在相同的问题。如果在服务(即localhost)中使用带有的页面,则会收到响应。但如果我从webapplication使用它,即local:20984,则没有响应。如果我查看Fiddler,它不会从web应用程序附加授权头。我甚至尝试禁用webscriptendpoint对localhost和localhost:20984都有效的服务的授权。但是webHttpEndpoint不适用于localhost:20984,即web应用程序Carlos,感谢您花时间写一篇文章。我将试着用这个感谢来回应。我甚至尝试使用标准端点,仍然存在相同的问题。如果在服务(即localhost)中使用带有的页面,则会收到响应。但如果我从webapplication使用它,即local:20984,则没有响应。如果我查看Fiddler,它不会从web应用程序附加授权头。我甚至尝试禁用webscriptendpoint对localhost和localhost:20984都有效的服务的授权。但是webHttpEndpoint不适用于localhost:20984,即web应用程序Carlos,感谢您花时间写一篇文章。我要试着用这个
<system.serviceModel>
<serviceHostingEnvironment aspNetCompatibilityEnabled="true"/>
<services>
<service name="Service" behaviorConfiguration="auth">
<endpoint address="" kind="webScriptEndpoint" contract="IService" />
</service>
</services>
<standardEndpoints>
<webScriptEndpoint>
<standardEndpoint crossDomainScriptAccessEnabled="true">
</standardEndpoint>
</webScriptEndpoint>
</standardEndpoints>
<behaviors>
<serviceBehaviors>
<behavior name="auth">
<serviceAuthorization serviceAuthorizationManagerType="BasicAuth.BasicAuthorization, BasicAuth" />
</behavior>
</serviceBehaviors>
</behaviors>
</system.serviceModel>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="Base64.js" type="text/javascript"></script>
<script src="jquery.min.js" type="text/javascript" language="javascript"></script>
<script type="text/javascript">
var Type;
var Url;
var Data;
var ContentType;
var DataType;
var ProcessData;
function CallService(successfn,auth) {
var addHeaders = function (xhr) {
xhr.setRequestHeader("Authorization", auth);
};
$.ajax({
type: Type, //GET or POST or PUT or DELETE verb
url: Url, // Location of the service
data: Data, //Data sent to server
contentType: ContentType, // content type sent to server
dataType: DataType, //Expected data format from server
processdata: ProcessData, //True or False
beforeSend: addHeaders,
success: function (msg) {//On Successfull service call
successfn(msg);
},
error: ServiceFailed// When Service call fails
});
}
function make_base_auth(user, pass) {
var tok = user + ':' + pass;
var hash = Base64.encode(tok);
return "Basic " + hash;
}
function getUrl() {
var auth = make_base_auth('user', 'password');
Type = "GET";
Url = "http://localhost/WebHttpBindTest/Service.svc/GetData?value=" + $('#txtCode').val();
ContentType = "text/json; charset=utf-8";
DataType = "jsonp";
ProcessData = true;
CallService(ServiceSucceeded,auth);
}
function ServiceSucceeded(result) {
var resultObject = null;
if (DataType == "jsonp") {
if (Url.indexOf(".asmx/") > 0) {
resultObject = result.d;
}
else {
$("#div1").html("Result:" + result);
}
}
}
function ServiceFailed(result) {
alert('Service call failed: ' + result.status + '' + result.statusText);
Type = null; Url = null; Data = null; ContentType = null; DataType = null; ProcessData = null;
}
</script>
</head>
<body>
<div id="container">
<h1>JSON API Demo</h1>
<div>
<p>Type Something: <input type="text" id="txtCode" />
<button type="submit"value="submit" id="btnGetUrl" onclick="getUrl()">Get</button>
</div>
<br /><br />
<center><div id="div1" style="font-size:larger"></div> </center>
</div>
</body>
</html>