Question

我无法在HTML页面上查看服务器的JSON响应。一旦用户点击按钮，请求就会发送到服务器。通过在javascript中从AJAX进行API调用，我试图显示响应。

这是我的html页面：

这是我使用POSTMAN的回复：

{
  "status": 1,
  "success_Result": {
    "names": [
      {
        "id": 1,
        "name": "text1"
      },
      {
        "id": 4,
        "name": "text2"
      },
      {
        "id": 5,
        "name": "text3"
      }
    ]
  }
}

这是我的javascript：

   $("#search").click(function()
    { 
       $.ajax(
        {
            type: "GET",
            url: "http://localhost:8080/********/1/1/1?start_date=2017-02-10",
            async:true,
            dataType : 'jsonp',
            crossDomain:true,
            contentType: "application/json; charset=utf-8",
            headers: 
            {
                'Access-Control-Allow-Origin': '*',
                'Access-Control-Allow-Headers': 'x-requested-with'
            },
            success: function(result) 
            {
                try 
                {
                    console.log(JSON.stringify(result));
                    alert(result);
                    //$("#display").html(result);
                }
                catch (error) 
                {
                    alert("error found");
                }   
            },   
            error: function(xhr, status, err)
            {
                console.log(err.message);
            }
        });     
    });

Firebug：控制台 我可以点击箭头查看响应。

我尝试在javascript中使用datatype: "json"。我在控制台中得到了这个。我无法在HTML页面中看到任何内容。

   $("#search").click(function()
   { 
     $.ajax(
        {
            type: "GET",
            url: "http://localhost:8080/*******/1/1/1?start_date=2017-02-10",
            async:true,
            dataType : 'json',
            crossDomain:true,
            contentType: "application/json; charset=utf-8",

            success: function(result) 
            {
                try 
                {
                    console.log(JSON.stringify(result));
                    alert(result);
                    //$("#display").html(result);
                }
                catch (error) 
                {
                    alert("error found");
                }   
            },   
            error: function(xhr, status, err)
            {
                console.log(err.message);
            }
        });     
    });

控制台：

我也试过了其他可能的方法......

                // using XMLHttpRequest
            var xhr = new XMLHttpRequest();
            xhr.open("GET", "http://localhost:8080/*******/1/1/1?start_date=2017-02-10", true);
            xhr.onload = function () 
            {
                try 
                {
                    $("#display").html("hello");
                    console.log(xhr.responseText);
                }
                catch (ex) 
                {
                    alert('Error parsing response.');
                }
            };
            try 
            {
                xhr.send();
            }
            catch (ex) 
            {
                alert(ex.message);
            }

控制台： 跨域资源共享，同源策略错误。

我不知道我哪里出错了。如果有人能帮助我，那就太好了。请。

@@@@@@@@@@@ UPDATE @@@@@@@@@@@

我现在根据建议尝试了这段代码，

$.ajax(
        {
            type: "GET",
            url: "http://localhost:8080/*******/1/1/1?start_date=2017-02-10",
            dataType : 'json',
            contentType: "application/json; charset=utf-8",
            success: function(result) 
            {
                try 
                {
                    console.log(JSON.stringify(result));
                    alert(JSON.stringify(result));
                }
                catch (error) 
                {
                    alert("error found");
                }   
            },   
            error: function(xhr, status, err)
            {
                console.log(err.message);
            }
        });

我知道这是我的控制台：

上面的图片中的标题有关于CORS的说法吗？是启用还是禁用？怎么检查??

无法在HTML页面中查看响应

0 个答案: