如何绕过CORS策略获取URL数据并实现URL文本分析工具？

针对你开发的URL文本分析工具遇到的CORS限制问题，以下是几种可行的解决方法：

1. 搭建反向代理服务器（生产环境推荐） #

浏览器的CORS限制仅针对前端脚本发起的跨域请求，后端服务不受此限制。你可以搭建一个简单的后端代理，让前端请求代理服务器，再由代理服务器去请求目标URL。

以Node.js + Express为例，快速实现代理：

const express = require('express');
const axios = require('axios');
const app = express();
const port = 3000;

// 代理接口
app.get('/fetch-url', async (req, res) => {
  const targetUrl = decodeURIComponent(req.query.url);
  try {
    const response = await axios.get(targetUrl, {
      responseType: 'text'
    });
    res.send(response.data);
  } catch (err) {
    res.status(500).send(`请求失败: ${err.message}`);
  }
});

app.listen(port, () => {
  console.log(`代理服务运行在 http://localhost:${port}`);
});

前端修改processUrls里的fetch逻辑：

// 替换原fetch(url)为：
fetch(`http://localhost:3000/fetch-url?url=${encodeURIComponent(url)}`)

2. 浏览器临时禁用CORS（仅开发测试用） #

如果只是本地开发调试，可以通过浏览器启动参数关闭CORS验证，绝对不能用于生产环境：

• Chrome：右键点击Chrome快捷方式，在目标栏末尾添加 --disable-web-security --user-data-dir="C:/ChromeDevSession"（路径可自定义），重启浏览器后即可跨域请求。
• Firefox：在地址栏输入about:config，搜索security.fileuri.strict_origin_policy，将其值改为false。

3. 使用CORS扩展（开发辅助） #

安装浏览器的CORS解除扩展（如CORS Unblock），开启后可临时绕过当前页面的CORS限制，同样仅适用于开发调试阶段。

4. 尝试JSONP（若目标网站支持） #

如果目标URL的接口支持JSONP（仅GET请求可用），可以用JSONP替代fetch。但这种方法局限性大，需要目标网站主动提供回调参数支持，不适用于所有场景。

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