如何从asp.net webservice检索json数据到普通html。 [英] How to retrieve json data from asp.net webservice to plain html.

问题描述

您好，

我正在尝试从asp.net webservice获取数据到HTML。

最初我在我的localhost中预先发布了webservice，它返回一个json格式化串。

从webservice检索json数据时，浏览器阻止响应并显示一条消息：--->



跨源请求被阻止：同源策略禁止在http：// localhost：55619 / WebService_DataCounter.asmx / Indus_Gadget_Data读取远程资源。这可以通过将资源移动到同一域或启用CORS来解决。 Indus_Gadget_Data .....



这是我在webservice中的代码

Hello,
I am trying to get data from asp.net webservice to html.
Initially i have pre published webservice in my localhost, it returns a json formated string.
While retrieving json data from webservice, the browsers blocks response and shows a message:--->

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:55619/WebService_DataCounter.asmx/Indus_Gadget_Data. This can be fixed by moving the resource to the same domain or enabling CORS. Indus_Gadget_Data.....

here is my code in webservice

[WebMethod]
      public DataTable Indus_Gadget_Data()
      {
          dt = new DataTable();
          dt = process_indus_gadget_data.Indus_Gadget_Processing();
          dt.TableName = "All Sites data";
          System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
          List<overallstatics> details = new List<overallstatics>();
          details.Clear();
          if (dt.Rows.Count > 0 && dt != null)
          {
              foreach (DataRow dr in dt.Rows)
              {
                  OverallStatics user = new OverallStatics();
                  user.SiteName = dr[0].ToString();
                  user.EB = dr[1].ToString();
                  user.DG = dr[2].ToString();
                  user.LS = dr[3].ToString();
                  user.DC = dr[4].ToString();
                  details.Add(user);
              }
          }
         return serializer.Serialize(details);
      }

现在用于html数据检索

now in html data retrieving

<script type="text/javascript">
     document.onload = init();
     function init() {
         Get_Indus_Widget();
     }
     function Get_Indus_Widget() {
         $.ajax({
             type: "POST",
             url: "http://192.168.0.108:55619/WebService_DataCounter.asmx/Indus_Gadget_Data",
         // url: "WebService1.asmx/Indus_Gadget_Data",
             data: "{}",
             headers: { 'Access-Control-Allow-Origin': '*' },
             crossDomain: true,
             contentType: "application/json",
             dataType: "json",
             beforeSend: function (xhr) {
                 xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
             },
             headers: {
                 'Access-Control-Allow-Origin': '*'},
            // jsonp: "mycallback",
             //crossDomain: true,
            // jsonpCallback: 'jsonCallback',
             success: function (data) {
                 for (var i = 0; i < data.d.length; i++) {
                     $("#tbDetails").append("<tr><td>" + data.d[i].SiteName + "</td><td>" + data.d[i].EB + "</td><td>" + data.d[i].DG + "</td><td>" + data.d[i].LS + "</td><td>" + data.d[i].DC + "</td></tr>");
                 }
             },
             error: function (result) {
                 alert("Error");
             }
         });
     }


 </script>

推荐答案

.ajax（{
type： POST，
url： http://192.168.0.108:55619/WebService_DataCounter.asmx/Indus_Gadget_Data ，
// url：WebService1.asmx / Indus_Gadget_Data，
data ： {}，
header：{' Access-Control-Allow-Origin'：' *'}，
crossDomain： true ，
contentType： application / json，
dataType： json，
beforeSend： function （xhr）{
xhr.setRequestHeader（ Access-Control-Allow -Origin， *）;
}，
标题：{
' Access-Control-Allow-Origin' ：' *'}，
// jsonp：mycallback，
// crossDomain：true，
// jsonpCallback：'jsonCallback '，
成功：功能（数据）{
for （ var i = 0 ; i< data.d.length; i ++）{

.ajax({ type: "POST", url: "http://192.168.0.108:55619/WebService_DataCounter.asmx/Indus_Gadget_Data", // url: "WebService1.asmx/Indus_Gadget_Data", data: "{}", headers: { 'Access-Control-Allow-Origin': '*' }, crossDomain: true, contentType: "application/json", dataType: "json", beforeSend: function (xhr) { xhr.setRequestHeader("Access-Control-Allow-Origin", "*"); }, headers: { 'Access-Control-Allow-Origin': '*'}, // jsonp: "mycallback", //crossDomain: true, // jsonpCallback: 'jsonCallback', success: function (data) { for (var i = 0; i < data.d.length; i++) {

（ ＃tbDetails）。append（ & lt; tr>< td> + data.d [i] .SiteName + < / td>< td> + data.d [i] .EB + < / td>< td> + data.d [i] .DG + < / td> ;< td> + data.d [i] .LS + < / td> < td> + data.d [i] .DC + < / td>< ; / TR>中）;
}
}，
错误： function （结果）{
alert（ 错误）;
}
}）;
}


< / script >

("#tbDetails").append("<tr><td>" + data.d[i].SiteName + "</td><td>" + data.d[i].EB + "</td><td>" + data.d[i].DG + "</td><td>" + data.d[i].LS + "</td><td>" + data.d[i].DC + "</td></tr>"); } }, error: function (result) { alert("Error"); } }); } </script>

您好我已经编写了代码以便回复代码



你有解析json数据，比如哪个是Bold Line

Hello I Have Write Code For Retrive a Code

You have parse json Data like Which is Bold Line

这篇关于如何从asp.net webservice检索json数据到普通html。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！