如何为不受控第三方服务器的响应添加CORS允许头？

我有一个React项目，需要调用一个不受我控制的第三方服务器API接口。
当传入有效参数发送GET请求时，CORS无问题，请求正常：

getAllDelegatorRewards: async(address_) => {
        try {
            const res = await axios.get(`${SOME_ENDPOINT}/delegators/${address_}/rewards`);
            ...
            return res;
        }
        catch (err) {
            console.log(err.response.data);
        }
    },

但传入无效参数发送GET请求时，会触发以下CORS错误：

Access to XMLHttpRequest at 'https://someDomain/delegators/someInvalidArgument/rewards' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我曾通过在Heroku上搭建cors-anywhere代理解决该问题，但Heroku已宣布2022年11月底停止支持免费dyno。现咨询：

1. 是否有其他方法为该不受控第三方服务器的响应添加Access-Control-Allow-Origin: *头？
2. 为何发送GET请求时无需设置该头，但接收第三方服务器响应时却要求存在该头？（已解答）

针对问题1的可行方案 #

• 自建轻量CORS代理：用Node.js快速搭建简单代理服务器，借助express和cors中间件实现，示例代码：

const express = require('express');
const cors = require('cors');
const axios = require('axios');
const app = express();

app.use(cors());

app.get('/proxy/*', async (req, res) => {
  const targetUrl = req.params[0];
  try {
    const response = await axios.get(targetUrl);
    res.send(response.data);
  } catch (error) {
    res.status(error.response?.status || 500).send(error.response?.data || '请求失败');
  }
});

app.listen(3001, () => {
  console.log('CORS代理服务器运行在http://localhost:3001');
});

之后React项目中将请求地址替换为代理服务器地址，比如http://localhost:3001/proxy/${SOME_ENDPOINT}/delegators/${address_}/rewards，代理会自动为所有响应添加CORS允许头，覆盖第三方服务的缺失问题。

• 开发阶段用浏览器插件临时绕过：本地开发时可以使用Allow CORS: Access-Control-Allow-Origin类浏览器插件，直接跳过浏览器的CORS校验，但仅适合开发调试，不能用于生产环境。
• 通过自有后端转发请求：如果项目有配套后端服务，直接让后端调用第三方API，React项目转而请求自有后端接口。浏览器仅校验前端与自有后端的跨域规则，后端之间的调用不受浏览器CORS限制，从根源避免问题。

针对问题2的补充说明（已解答） #

浏览器的CORS机制是在接收响应阶段做校验：发送请求时浏览器会正常发起请求，但收到响应后，会检查响应头中的Access-Control-Allow-Origin是否包含当前页面的origin，不满足则拦截响应并抛出错误。有效参数请求时，第三方服务器返回的成功响应中包含了合法的允许头；而无效参数触发错误响应（如4xx状态码）时，第三方服务器未添加该允许头，因此触发了CORS错误。

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