HTTP GET没有得到

时间:2014-11-10 13:19:52

标签: json http get

尝试这个但是没有发现

function getWeather() {
$.ajax({
  type: "GET",
  url: "http://api.openweathermap.org/data/2.5/weather?q=London",
    async: false,
    jsonpCallback: 'jsonCallback',
    contentType: "application/json",
    dataType: 'JSON',
    success: function(data)
    {
        $('#jsonp-results').html(JSON.stringify(data));
    },
    error: function(e)
    {
       alert(e.message);
    }

});
return data; //The JSON response whould be in this so that I can take this and can do some operation
}

点击按钮后,它应该返回JSON

<body>
<button onclick="getWeather();">Get Weather</button>
</body>

预期示例JSON:

{"coord":{"lon":-0.13,"lat":51.51},"sys":{"type":1,"id":5168,"message":0.0287,"country":"GB","sunrise":1415603442,"sunset":1415636293},"weather":[{"id":803,"main":"Clouds","description":"broken clouds","icon":"04d"}],"base":"cmc stations","main":{"temp":284.99,"pressure":1003,"humidity":76,"temp_min":283.75,"temp_max":286.15},"wind":{"speed":5.1,"deg":210},"clouds":{"all":75},"dt":1415624678,"id":2643743,"name":"London","cod":200}

我没有犯错误。

修改

从这里给出的片段中尝试了这个:

<!DOCTYPE html>
<html>
<body>
<p id="temp"></p>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script language="javascript" type="text/javascript">
function getWeather() {
  data_Json = {};
  $.ajax({
    url: "http://api.openweathermap.org/data/2.5/weather?q=London",
    dataType: 'JSON',
    success: function(data) {
      //alert(JSON.stringify(data));
      data_Json = data;
      //alert("Weather Report: "+data_Json);
    },
    error: function(e) {
      alert(e.message);
    }
  });
  return data_Json;
}

function temp() {
  //getWeather();
  var obj = JSON.stringify(getWeather());
  //alert("Got"+JSON.stringify(obj));
  //alert(JSON.stringify(getWeather()));
  //document.getElementById("temp").innerHTML = obj.main.temp;
alert("Temp : "+obj);
  }
</script>
</body>
<body>
<button onclick="getWeather();">Get Weather</button>
<button onclick="temp();">Temperature</button>

</body>
</html>

它返回{} 没有返回JSON(在getWeather中定义的返回) 不是温度(在id部分的get元素中)

4 个答案:

答案 0 :(得分:3)

从您的请求中删除contentType,它将正常工作。

由于这是一个跨源请求,因此您无法设置contentType。

以下是您将在控制台中看到的错误 -

XMLHttpRequest无法加载http://api.openweathermap.org/data/2.5/weather?q=London。请求标头字段Access-Control-Allow-Headers不允许使用Content-Type。

同样,语句return data;将失败,因为变量数据在该上下文中不可用。

您可以将以下代码用于您的目的 -

&#13;
&#13;
function getWeather() {
  weatherJson = {};
  $.ajax({
    type: "GET",
    url: "http://api.openweathermap.org/data/2.5/weather?q=London",
    async: false,
    jsonpCallback: 'jsonCallback',
    dataType: 'JSON',
    success: function(data) {
      $('#jsonp-results').html(JSON.stringify(data));
      weatherJson = data;
    },
    error: function(e) {
      alert(e.message);
    }

  });
  return weatherJson;
}
&#13;
&#13;
&#13;

答案 1 :(得分:1)

你的html中确实有一个id =“jsonp-results”的元素吗?

一些简化的提示:

  • 如果您不使用jsonp
  • ,则无需指定jsonp回调
  • 同步调用不好,因为它们会阻止,你应该避免这种情况,甚至不支持跨域调用(你的情况就是如此)

简化示例:

function getWeather() {
  $.ajax({
    url: "http://api.openweathermap.org/data/2.5/weather?q=London",
    dataType: 'JSON',
    success: function(data) {
      $('#jsonp-results').html(JSON.stringify(data));
    },
    error: function(e) {
      alert(e.message);
    }
  });
}


<body>
<button onclick="getWeather();">Get Weather</button>
<div id="jsonp-results"></div>
</body>

评论之后:它确实有效: http://codepen.io/anon/pen/MYgXzd

您的设置必定有问题。

答案 2 :(得分:1)

您可以尝试此解决方案

function getWeather() { 
data_Json = {};
$.ajax({
type: "GET",
url: "http://api.openweathermap.org/data/2.5/weather?q=London",
async: false,
dataType: 'JSONP',
success: function(data) {
  $('#jsonp-results').html(JSON.stringify(data));
  data_Json = data;
},
error: function(e) {
alert(e.message);
}
});
return data_Json;  }

编辑部分: -

<!DOCTYPE html>
<html>
<body>
<p id="temp"></p>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script  type="text/javascript">
function getWeather() {
    data_Json = {};
    $.ajax({
        url: "http://api.openweathermap.org/data/2.5/weather?q=London",
        dataType: 'JSON',
        success: function (data) {
           data_Json = JSON.stringify(data);
        },
        error: function (e) {
            alert(e.message);
        }
    });
alert(data_Json);
return data_Json;
}
function temp() {
    var obj = getWeather();
   alert("Temp : " +obj);
}
</script>
<button onclick="getWeather();">Get Weather</button>
<button onclick="temp();">Temperature</button>

</body>

答案 3 :(得分:0)

    Hi See this,    
   function getWeather() {
    var returnData="";
    $.ajax({
      type: "GET",
      url: "http://api.openweathermap.org/data/2.5/weather?q=London",
        async: false,
        jsonpCallback: 'jsonCallback',
        contentType: "application/json",
        dataType: 'JSON',
        success: function(data)
        {
            $('#jsonp-results').html(JSON.stringify(data));
            returnData=data;
        },
        error: function(e)
        {
           alert(e.message);
        }

    });
    return data; //The JSON response whould be in this so that I can take this and can do some operation
    }