如何在ajax中启用cors?

时间:2015-03-24 10:35:48

标签: c# asp.net ajax cors

我正在尝试从以下主机网址test.domain.com/test2.aspx/BindDatatable调用数据,但是我在控制台窗口中不断收到404响应和以下消息:

错误消息:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://test.domain.com/test2.aspx. This can be fixed by moving the resource to the same domain or enabling CORS

我在主机(url)文件的web.config文件中添加了以下cors标头:

<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="origin" />
<add name="Access-Control-Request-Method" value="POST" /> 
<add name="Access-Control-Allow-Headers" value="content-type, accept" /> 
</customHeaders>
</httpProtocol>
</system.webServer>

它还包含test2.aspx.cs背后的以下web方法:

[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
[WebMethod()]
public static string BindDatatable()
{
    DataTable dt = new DataTable();
    List<UserDetails> details = new List<UserDetails>();

    using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["#####"].ConnectionString))
    {
        using (SqlCommand cmd = new SqlCommand("######", con))
        {
            con.Open();
            SqlDataAdapter da = new SqlDataAdapter(cmd);
            da.Fill(dt);
            foreach (DataRow dtrow in dt.Rows)
            {
                UserDetails user = new UserDetails();
                user.Name= dtrow["###"].ToString();
                user.Loan = dtrow["###"].ToString();
                user.Evnt = dtrow["###"].ToString();
                details.Add(user);
            }
        }
    }
     JavaScriptSerializer serializer = new JavaScriptSerializer();
     return serializer.Serialize(details);
}

从corsTest.aspx调用的ajax函数

   $(document).ready(function () {
    $.support.cors = true;
    $.ajax({
        type: "Post",
        crossDomain: true,
        contentType: "application/json; charset=utf-8",
        url: "http://wwww.test.domain.com/test2.aspx/BindDatatable",
        data: "{}",
        dataType: "json",
        success: function (data) {
            alert(data.toSource());
            console.log(data);
            var myData = JSON.parse(data.d)
             for (var i = 0; i < myData.length; i++) {
                 $("#tbDetails").append("<tr><td>" + myData[i].Name + "</td><td>" + myData[i].Loan + "</td><td>" + myData[i].Evnt + "</td></tr>");                    
            }
        },
        error: function (result) {
            alert("Error");
        }
    });
});

我不确定,我还想进一步更新以使其发挥作用。我还需要在text2.aspx页面的head标签中定义cors标头。

提前感谢任何进一步的反馈/指导。

2 个答案:

答案 0 :(得分:0)

检查远程方法是否可用。如果允许连接特定端口,请检查托管服务的服务器的防火墙。如果未阻止输出端口,也请检查您的机器。

启用cors的另一种方法是在服务器端建立连接。 例如,您可以向远程方法添加服务引用,并在本地项目的服务器端使用该方法。然后在客户端上,您只需要调用解决方案中的本地方法,而不必在客户端上启用cors。

答案 1 :(得分:0)

我今天遇到了类似的情况,所以分享我的解决方案,希望它可以帮助某人。我使用jsonp从跨域获取数据。举个例子,如果可以访问BindDatatable()中的test2.aspx.cs方法,那么我们可以修改json对象以jsonData({..your json..})之类的格式返回。通过使用jsonData()包装方法,jsonp可以在ajax调用期间读取它,如:

var url = "http://wwww.test.domain.com/test2.aspx/BindDatatable";
    $.ajax({
                url: url,
                dataType: 'jsonp',
                jsonpCallback: 'jsonData',
                success: function (response) {
                    console.log('callback success: ', response);
                },
                error: function (xhr, status, error) {
                    console.log(status + '; ' + error);
                }
            });

否则,如上面的帖子所示,您可以在自己的应用程序corsTest.aspx.cs中创建一个函数,并通过它在C#中访问跨域链接并返回json,如下所示:

$.ajax({
    type: "Post",
    contentType: "application/json; charset=utf-8",
    url: "/corsTest.aspx/BindDatatableTest",
    dataType: "json",
    .
    .
    error: function (result) {
        alert("Error");
    }
});

在corsTest.aspx.cs中定义函数,如:

private string BindDatatableTest()
{
    JavaScriptSerializer serializer = new JavaScriptSerializer(); 
    string url = "http://wwww.test.domain.com/test2.aspx/BindDatatable";
    WebClient wc = new WebClient();        
    ServicePointManager.Expect100Continue = false;
    ServicePointManager.MaxServicePointIdleTime = 2000;
    string json = wc.DownloadString(url);
    object jsonData = new
    {
          jsonFinal = jsonD
    };

    return Content(serializer.Serialize(jsonData), "application/json");
}

此外,为了调用跨域url,您必须将以下代码添加到web.config:

<system.net>
    <settings>
      <httpWebRequest useUnsafeHeaderParsing="true" />
    </settings>
  </system.net>