如何使用 jquery 和维基百科 API 进行搜索

Question

我已经阅读了很多帖子，旧的、新的和维基百科文档。

我有这个请求，它本身和在 sanbox 中都有效：

但是当我尝试在 javascript 脚本中使用它时，我无法获取数据：

我尝试了 ajax 和 Json:

这是我使用的代码：

一个 'GET' 请求 ajax :

代码标记很糟糕

function build_wiki_search_url(pattern) {
    var base_url = "https://en.wikipedia.org/w/api.php";
    var request_url = "?action=query&format=json&list=search&srsearch=";
    var url = base_url + request_url + pattern;
    return url;
}

 $(document).ready(function() {
    $("#doit").click(function() {
        console.log("Submit button clicked");
        var pattern = $("#search").val();
        var url = build_wiki_search_url(pattern);
        console.log(url);
    $.ajax( {
        type: "GET",
        url: url,
        dataType: 'jsonp',
        success: function(data) {
            console.log(data);
        },
        error: function(errorMessage) {
             console.log("damnn");
          }
        });
      console.log("end");
    });
 })

'POST' 请求 ajax 遵循维基百科文档

  var base_url = "https://en.wikipedia.org/w/api.php";
  $.ajax( {
     contentType: "application/json; charset=utf-8",
      url: base_url,
      data: {
          action: 'query',
          list: 'search',
          format: 'json',
          srsearch: 'einstein',
          origin: '*',
     },
      dataType: 'json',
      type: 'POST',
      success: function(data) {
          console.log("ok");

          // do something with data
      },
      error: function(errorMessage) {
          console.log("damnn");
      }
  } );

和 getJSON 尝试：

//getJSON atempt.
  console.log(url +  '&callback=?');
  $.getJSON(url + '&callback=?', function(json) {
        console.log("ok");
        });

这是我控制台的输出：

Submit button clicked    
https://en.wikipedia.org/w/api.php?action=query&format=json&list=search&srsearch=einstein
script.js 
end

Answer 1

问题实际上来自html:

<form > 
  <input type="text" id="search"> <button id="doit"> Search!!</button>
</form>

由于按钮位于表单中，因此此按钮的正常行为是生成提交操作。所以我们的想法是通过以下方式禁用这种正常行为：

$("#doit").click(function(e) {
    e.preventDefault();

完整的工作代码：

function build_wiki_search_url(pattern) {
    var base_url = "https://en.wikipedia.org/w/api.php";
    var format = "&format=json";
    var request_url = "?action=query&format=json&list=search&srsearch=";
    var url = base_url + request_url + pattern;
    return url;
}
$(document).ready(function() {
    $("#doit").click(function(e) {
        e.preventDefault();
        console.log("Submit button clicked");
        var pattern = $("#search").val();
        var url = build_wiki_search_url(pattern);
        $.ajax( {
            type: "GET",
            url: url,
            dataType: 'jsonp',
            success: function(data) {
                console.log(data.query.searchinfo.totalhits);
            },
            error: function(errorMessage) {
                 console.log("damnn");
              }
        });
    });
})

如何使用 jquery 和维基百科 API 进行搜索

How to make a search with jquery and the wikipedia API

javascript

ajax

jquery

json

wikipedia-api