本地打开HTML文件时CORS请求被拦截，无需本地服务器如何解决？

既然你不想折腾本地HTTP服务器、修改浏览器启动参数或安装插件，这里有几个实用的方案可以试试：

1. 使用JSONP（如果目标API支持） #

同源策略不会限制JSONP请求，因为它本质是通过<script>标签加载资源。jQuery对JSONP有原生支持，只需调整你的Ajax请求配置：

$.ajax({
  url: 'http://x.x.x.x/your-api-endpoint',
  dataType: 'jsonp', // 关键：将数据类型设为jsonp
  success: function(data) {
    // 处理返回的数据
    console.log(data);
  },
  error: function(xhr, status, error) {
    console.error('请求失败:', error);
  }
});

注意：这个方案只在目标API明确支持JSONP时有效——API需要能识别callback参数，并返回包裹在函数调用中的JSON数据。如果API不支持JSONP，这个方法就用不了。

2. 用书签脚本（Bookmarklet）临时绕过CORS限制 #

你可以创建一个浏览器书签，点击它就能在当前页面注入代码，临时解除CORS限制。步骤如下：

• 打开浏览器的书签管理器，新建一个书签
• 将书签的URL设置为以下代码：

javascript:(function(){
  const originalXHR = XMLHttpRequest;
  XMLHttpRequest = function() {
    const xhr = new originalXHR();
    const originalOpen = xhr.open;
    xhr.open = function(method, url, async, user, password) {
      originalOpen.call(this, method, url, async, user, password);
      this.setRequestHeader('Access-Control-Allow-Origin', '*');
    };
    return xhr;
  };
  alert('CORS限制已临时解除，刷新页面后失效');
})();

• 当你打开file:///home/visu/index.htm页面后，点击这个书签，再发起Ajax请求就能绕过CORS拦截了。

说明：这个方法是在前端层面修改XMLHttpRequest的行为，只对当前页面有效，刷新页面后需要重新点击书签。它不需要安装任何插件，也不用修改浏览器启动参数。

3. 将API请求转换为静态JSON文件（如果数据不实时） #

如果目标API返回的数据不需要实时更新，你可以手动访问API地址，把返回的JSON内容保存到本地（比如data.json），然后修改你的Ajax请求指向这个本地文件：

$.ajax({
  url: './data.json', // 本地JSON文件路径
  dataType: 'json',
  success: function(data) {
    console.log(data);
  }
});

这个方法完全避开了跨域问题，因为你请求的是本地同一路径下的资源，符合同源策略。当然，缺点是数据不会自动更新，需要你定期手动同步。

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