维基百科API跨域问题：jQuery.ajax()无法获取JSON数据求助

兄弟，我懂你作为编程新手碰到这个跨域问题有多闹心，咱们一步步把它捋明白、搞定：

先解决最核心的协议冲突问题 #

你说的HTTP和HTTPS协议不匹配是关键——现代浏览器会严格阻止HTTPS页面加载HTTP资源（混合内容限制），再加上同源策略的限制，自然拿不到数据。其实维基百科API是完全支持HTTPS的，直接把请求URL换成HTTPS开头就解决了大半问题！比如把http://en.wikipedia.org/w/api.php改成https://en.wikipedia.org/w/api.php，这样协议和你的页面一致，甚至不用jsonp，直接用普通的jQuery.ajax()请求就行。

如果坚持要用JSONP（或兼容旧场景） #

之前用jsonp没效果，大概率是没给维基百科API传对必要参数。维基百科API要求JSONP请求必须指定callback参数，jQuery的jsonp机制会自动帮你生成回调函数名，但你得在请求里加上这个参数：

$.ajax({
  url: 'https://en.wikipedia.org/w/api.php',
  data: {
    action: 'query', // 必须指定API操作，比如搜索用query
    list: 'search',  // 搜索功能对应的列表类型
    srsearch: '你的搜索关键词', // 替换成用户输入的内容
    format: 'json',  // 指定返回格式为json
    callback: '?'    // 关键！jQuery会自动替换这个?为生成的回调函数
  },
  dataType: 'jsonp',
  success: function(response) {
    // 这里处理返回的JSON数据
    console.log(response);
    // 举个例子：遍历搜索结果
    if (response.query && response.query.search) {
      response.query.search.forEach(item => {
        console.log(item.title, item.snippet);
      });
    }
  },
  error: function(xhr, status, error) {
    console.error('请求出错:', error);
  }
});

新手容易踩的几个坑 #

• 别漏了必要的API参数：比如action、format是必填项，不同功能需要对应参数（比如搜索要加list: 'search'和srsearch），参数不对API会返回错误。
• 绝对不要混用HTTP和HTTPS：哪怕用jsonp，浏览器也可能因为混合内容限制拦截HTTP请求，所以优先用HTTPS的API地址。
• 多看看浏览器控制台：如果还是失败，按F12打开控制台，看Network和Console标签，里面会明确告诉你是参数错了还是请求被拦截了。

内容的提问来源于stack exchange，提问作者emred2700