使用AJAX / JSON从在线数据API中读取

Sorry if this is a foolish question, I'm just finding hard to wrap my head around how to do this without just running out and learning ten million frameworks...

对不起，如果这是一个愚蠢的问题，我只是很难绕过如何做到这一点，而不用耗尽并学习一千万个框架......

I want to query an online database (specifically https://data.qld.gov.au/dataset/fireworks/resource/346d58fc-b7c1-4c38-bf4d-c9d5fb43ce7b).

我想查询在线数据库（特别是https://data.qld.gov.au/dataset/fireworks/resource/346d58fc-b7c1-4c38-bf4d-c9d5fb43ce7b）。

The end goal is to be able to display this information on a website. My first idea was to just create a small website locally and take one of their ajax queries, but it won't connect.

最终目标是能够在网站上显示此信息。我的第一个想法是在本地创建一个小网站，并采取他们的一个ajax查询，但它不会连接。

What is the simplest way to query a data API? (I'm working with HTML/CSS/JS, and have started learning Node.js, JSON data and AJAX, but I'm new).

查询数据API的最简单方法是什么？（我正在使用HTML / CSS / JS，并且已经开始学习Node.js，JSON数据和AJAX，但我是新手）。

I have right now a website that I'm just opening locally (i.e. it's address is file:///C:/Users/Dylan/fireworks/getinfo.html) and very simple HTML and javascript copied from the website. But the alert always returns undefined, telling me that it's not actually trying to connect. What am I missing here and why?

我现在有一个网站，我只是在本地打开（即它的地址是file：/// C：/Users/Dylan/fireworks/getinfo.html）和从网站上复制的非常简单的HTML和javascript。但警报始终返回undefined，告诉我它实际上并没有尝试连接。我在这里想念的是什么？为什么？

$(document).ready(function(){
  var data = {
    resource_id: '346d58fc-b7c1-4c38-bf4d-c9d5fb43ce7b', // the resource id
    limit: 5, // get 5 results
    q: 'jones' // query for 'jones'
  };

  console.log("got here");
  $.ajax({
    url: 'https://data.qld.gov.au/api/action/datastore_search',
    data: data,
    dataType: 'jsonp',
    success: function(data) {
      alert('Total results found: ' + data.result.total)
    }
  });

});

<html>
<head>
	<script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
	<script src = "getinfo.js"></script> 
</head>
<body>
	<h1> I hate myself </h1>
</body>
</html>

I know it sounds like too broad of a question, if your answers are broad that's okay. I just want to know what I need to learn in order to complete the simple task of retrieving information off of an online database, and why I can't just query it from my computer?

我知道这听起来太宽泛了，如果你的答案很广泛就没关系。我只是想知道我需要学习什么才能完成从在线数据库中检索信息的简单任务，以及为什么我不能只从我的计算机中查询它？

Thanks!

谢谢！

3 个解决方案

#1

You were so close!! You were just trying to get a count from the result variable but thats a hashtable/dictionary rather than an array. Try getting the count by calling the length method on result.records

你太近了!!您只是想从结果变量中获取计数，但这是一个哈希表/字典而不是数组。尝试通过调用result.records上的length方法来获取计数

Note that I removed the q param so we actually get some records back

请注意，我删除了q param，因此我们实际上得到了一些记录

$(document).ready(function(){
  var data = {
    resource_id: '346d58fc-b7c1-4c38-bf4d-c9d5fb43ce7b', // the resource id
    limit: 5, // get 5 results
    // q: 'jones' // query for 'jones' remove this so we actually get some records
  };

  console.log("got here");
  $.ajax({
    url: 'https://data.qld.gov.au/api/action/datastore_search',
    data: data,
    dataType: 'jsonp',
    success: function(successData) {
      alert('Total results found: ' + successData.result.records.length)
    }
  });

});

<html>
<head>
	<script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
	<script src = "getinfo.js"></script> 
</head>
<body>
	<h1> I am a golden god </h1>
</body>
</html>

#2

Every thing is fine in your code, But you are referencing a wrong variable, Just console.log(data) to see what properties or methods the data object contains.

你的代码中的每一件事情都很好，但是你引用了一个错误的变量，只需要console.log（数据）来查看数据对象包含的属性或方法。

$(document).ready(function(){
  var data = {
    resource_id: '346d58fc-b7c1-4c38-bf4d-c9d5fb43ce7b', // the resource id
    limit: 5, // get 5 results
    q: 'jones' // query for 'jones'
  };

  console.log("got here");
  $.ajax({
    url: 'https://data.qld.gov.au/api/action/datastore_search',
    data: data,
    dataType: 'jsonp',
    success: function(data) {
      console.log(data);

      // alert('Total results found: ' + data.result.total)
    }
  });

});

<html>
<head>
	<script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
	<script src = "getinfo.js"></script> 
</head>
<body>
	<h1> I hate myself </h1>
</body>
</html>

#3

I can't load the url, it returned a http 408/409 error. So I can't tell you what's wrong but how to debug what's wrong.

我无法加载网址，它返回了一个http 408/409错误。所以我不能告诉你什么是错的，但如何调试错误。

Next time you found this, Step 1, open your browser's debugger; Step 2, check "Network" tab if there is a failure in connection and watch the error message; Step 3, console.log(data), it will shows the data structure into the console, in many case, undefined comes from mistaken usage of data structure. Finally, don't hate youself and ask for help.

下次找到这个，第1步，打开浏览器的调试器;步骤2，如果连接失败，请检查“网络”选项卡并观察错误消息;第3步，console.log（数据），它会将数据结构显示到控制台中，在很多情况下，undefined来自于错误使用数据结构。最后，不要讨厌自己并寻求帮助。

#1