5 Replies - 698 Views - Last Post: 25 October 2013 - 08:57 AM

#1 whiskaz  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 12
  • Joined: 09-September 13

XMLHttpRequest and api.forecast.io

Posted 25 October 2013 - 05:35 AM

Hello.

I have a problem getting the forecast.io API to work. Whatever I do, the request readyState stays 0. Here are my html and js codes.

index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery & API</title>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
	
<body>
	<button type="button" onclick="loadJSON()">Update</button>
	<p id="par"></p>
</body>
</html>



script.js
function loadJSON()
{
   var data_file = "https://api.forecast.io/forecast/APIKEY/46.1500,46.8167";
   var http_request = new XMLHttpRequest();
   //alert(http_request.readyState);
   http_request.onreadystatechange  = function(){
      if (http_request.readyState == 4  )
      {
        var jsonObj = JSON.parse(http_request.responseText);

        document.getElementById("par").innerHTML = jsonObj.latitude;
      }
   }
   http_request.open("GET", data_file, true);
   http_request.send();
}


Yes, I did put my api key in the call. What seems to be the problem? The api should return JSON.

Is This A Good Question/Topic? 0
  • +

Replies To: XMLHttpRequest and api.forecast.io

#2 whiskaz  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 12
  • Joined: 09-September 13

Re: XMLHttpRequest and api.forecast.io

Posted 25 October 2013 - 06:31 AM

Sorry for double post, I can't edit yet.

The first problem was the url, had to use encodeURI and the readyState changed to 4 eventually. But the responseText suddenly contains nothing. How should I get data? What am I doing wrong? I see the correct response when I call the url directly from my browser.
Was This Post Helpful? 0
  • +
  • -

#3 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3530
  • View blog
  • Posts: 10,172
  • Joined: 08-June 10

Re: XMLHttpRequest and api.forecast.io

Posted 25 October 2013 - 07:15 AM

View Postwhiskaz, on 25 October 2013 - 03:31 PM, said:

I see the correct response when I call the url directly from my browser.

hm, I get a HTTP 403 when I try to load the URI in my browser.

anyways, you should check in your AJAX code what status code you get.
Was This Post Helpful? 0
  • +
  • -

#4 whiskaz  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 12
  • Joined: 09-September 13

Re: XMLHttpRequest and api.forecast.io

Posted 25 October 2013 - 07:34 AM

Thought I included that. I get status 0. StatusText is empty.

I just learned XMLHttpRequest cannot send a request to a different domain than the one it came from. How do I fix that?
Was This Post Helpful? 0
  • +
  • -

#5 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3530
  • View blog
  • Posts: 10,172
  • Joined: 08-June 10

Re: XMLHttpRequest and api.forecast.io

Posted 25 October 2013 - 08:15 AM

you can use CORS. there should be a setting for that in jQuery, but eventually, the browser must support it.
Was This Post Helpful? 1
  • +
  • -

#6 whiskaz  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 12
  • Joined: 09-September 13

Re: XMLHttpRequest and api.forecast.io

Posted 25 October 2013 - 08:57 AM

Got it. Looked into CORS and JSONP. Used JSONP and the issue fixed itself and I actually learned something about requests. Thanks for help!
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1