Search code examples
javascriptjquerygetjsoncodepen

GET request not getting data in codepen but working on browser tab

This is my Codepen for a simple weather app I did long ago. However, it is not working now. When I paste the api into browser tab, I'm getting data, but in the Codepen it is not working.

var api = "http://api.openweathermap.org/data/2.5/weather?
q=Lam%20Tin,HK&appid=23a5271ef6a94716ac17ec27e9f4bcd8";
$.getJSON(api, function(data) {
  console.log(data);
});
Solution

  • Error

    The page at 'https://codepen.io/iamanoopc/pen/JEjYKR?editors=0011' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?q=Lam%20Tin,‌​HK&appid=23a5271ef6a‌​94716ac17ec27e9f4bcd‌​8'. This request has been blocked; the content must be served over HTTPS.

    Explanation

    enter image description here

    error as been showed very clearly .HTTPS, but requested an insecure XMLHttpRequest .Is secure domain server https .your http call is insecure .For the security reason .They will blocked your request This request has been blocked; the content must be served over HTTPS

    Alternate

    Try with insecure http domain server snippet like jsbin

    enter image description here

    Demo with Jsbin