无法从 ip url 获取 json 数据 [重复]答案

【问题标题】：unable to fetch json data from ip url [duplicate]无法从 ip url 获取 json 数据 [重复]
【发布时间】：2014-07-12 08:57:10
【问题描述】：

嘿，伙计们，我无法获取跨域 json 数据，这是我下面的代码，它不起作用

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery.getJSON demo</title>
  <style>
  img {
    height: 100px;
    float: left;
  }
  </style>
  <script src="js/jquery.min.js"></script>
</head>
<body>

<div id="images"></div>

<script>
(function() {
  var furl= "http://192.168.2.36/gemadmin/display.php?callback=?";
  $.getJSON( furl)
    .done(function( data ) {
      console.log(data);
    });
})();
</script>

</body>
</html>

并且这段代码可以正常工作，因为它只是本地主机

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery.getJSON demo</title>
  <style>
  img {
    height: 100px;
    float: left;
  }
  </style>
  <script src="js/jquery.min.js"></script>
</head>
<body>

<div id="images"></div>

<script>
(function() {
  var furl= "http://localhost/gemadmin/display.php";
  $.getJSON( furl)
    .done(function( data ) {
      console.log(data);
    });
})();
</script>

</body>
</html>

为什么第一个版本不起作用？什么是使它起作用的解决方案？

服务器代码(display.php)

<?php
    include 'config.php';
    $sql = "select * from menu;";
    $result= $mysqli->query($sql);
    $data = $result->fetch_all( MYSQLI_ASSOC );
    header('Content-Type: application/json');
    echo json_encode( $data );
    ?>

答案： 找到答案而不是 $.getJSON() 使用 $.get 并进行 json 解析例子 jQuery.getJSON 演示图像{ 高度：100px；向左飘浮; }

<div id="images"></div>

<script>
(function() {
  var furl= "http://localhost/gemadmin/display.php?callback=?";
  $.get( furl)
    .done(function( data ) {
      var obj = JSON.parse(data);
      console.log(obj);
    });
})();
</script>

</body>
</html>

不要忘记将“callback=?”添加到您的网址

【问题讨论】：

只是因为您访问admin数据，除非您在其他站点登录，否则该请求无效。
您已经找到原因：“我无法获取跨域json数据”。除非您设置适当的 CORS 标头，否则不允许跨域 Ajax 请求。如果您搜索术语“ajax”和“cors”，已经有很多关于此的讨论。

标签： javascript jquery

【解决方案1】：

这样使用

            $.ajax({
                    url: "URL",
                    type: "POST",
                    contentType: "application/json;charset=utf-8",
                    data: JSON.stringify("YOUR JSON"),
                    dataType: "json",
                    success: function (response) {
                        alert(response);
                    },

                    error: function (x, e) {
                        alert('Failed');
                        alert(x.responseText);
                        alert(x.status);
                    }
                });

【讨论】：

【解决方案2】：

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $.getJSON("demo_ajax_json.js",function(result){
      $.each(result, function(i, field){
        $("div").append(field + " ");
      });
    });
  });
});
</script>
</head>
<body>

<button>Get JSON data</button>
<div></div>

</body>
</html>

demo_ajax_json.js

{ 
  "firstName": "John",
  "lastName": "Doe",
  "age": 25
}

一个简单的例子

【讨论】：