使用Tumblr API遇net::ERR_ABORTED错误，求本地HTML打印JSON响应方案

嘿，刚接触jQuery和Ajax遇到这个问题太正常了！先给你拆解下这个net::ERR_ABORTED错误：它本质是浏览器跨域请求限制搞的鬼——你直接双击打开本地HTML文件时，浏览器用的是file://协议，而Tumblr API跑在https://协议下，浏览器的同源策略会直接阻止这种跨域请求，导致请求被中止。

结合你想打印API返回的JSON响应的需求，给你两种靠谱的解决办法：

方法1：用JSONP直接绕开跨域（Tumblr API原生支持） #

Tumblr API本身支持JSONP格式，这是前端处理跨域请求的经典方案，jQuery的Ajax可以直接配置使用：

$(document).ready(function() {
  $.ajax({
    url: "https://api.tumblr.com/v2/blog/myblog.tumblr.com/info",
    dataType: "jsonp", // 这是关键！指定用jsonp格式
    data: {
      api_key: "你的API密钥"
    },
    success: function(response) {
      // 先把响应打印到浏览器控制台，方便调试
      console.log("Tumblr API响应：", response);
      // 也可以把格式化后的JSON直接显示在页面上
      $("body").append("<pre>" + JSON.stringify(response, null, 2) + "</pre>");
    },
    error: function(xhr, status, error) {
      console.error("请求出错啦：", status, error);
    }
  });
});

记得替换两处内容：

• 把myblog.tumblr.com换成你实际的博客域名
• 把你的API密钥换成你在Tumblr开发者平台申请的有效密钥

方法2：用本地服务器运行HTML文件（更通用的跨域解决方式） #

如果不想用JSONP，你可以把HTML文件放到本地服务器上运行，这样页面就会用http://localhost协议，而Tumblr API支持CORS（跨域资源共享），请求就能正常发送了。

给你个超简单的Python服务器操作步骤：

1. 打开终端，切换到你的HTML文件所在的文件夹
2. 运行对应命令：
   • 如果你用Python 3：python -m http.server 8000
   • 如果你用Python 2：python -m SimpleHTTPServer 8000
3. 然后在浏览器访问http://localhost:8000/你的HTML文件名.html，之后用普通的Ajax请求就行：

$(document).ready(function() {
  $.ajax({
    url: "https://api.tumblr.com/v2/blog/myblog.tumblr.com/info",
    method: "GET",
    data: {
      api_key: "你的API密钥"
    },
    success: function(response) {
      console.log("Tumblr API响应：", response);
      $("body").append("<pre>" + JSON.stringify(response, null, 2) + "</pre>");
    },
    error: function(xhr, status, error) {
      console.error("请求出错啦：", status, error);
    }
  });
});

小提示 #

• 先别急着写代码，你可以先在浏览器地址栏直接访问API URL（带上你的api_key），看看能不能正常返回JSON，先排除API密钥无效或者博客域名写错的问题
• 浏览器控制台是调试Ajax请求的好帮手，一定要学会看里面的错误信息和响应内容哦！

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