React Native无服务器控制权时，Fetch读取Location等HTTP头可行吗？

好问题！我之前刚好碰到过类似的场景，给你理清楚这里面的限制和可行方案：

根据浏览器的同源策略和CORS规则，Fetch API默认只能访问简单响应头（比如Cache-Control、Content-Type、Content-Length这些）。像Location、Set-Cookie这类属于非简单响应头，必须由服务器在Access-Control-Expose-Headers中明确列出，浏览器才会允许前端通过response.headers读取它们。

如果服务器没配置这个头，直接调用response.headers.get('Location')或者response.headers.get('Set-Cookie')都会返回null。

1. 如果是同域请求：完全没问题！ #

CORS规则只针对跨域请求，同域下的Fetch不受这个限制——你可以直接读取所有响应头，包括Location和Set-Cookie。

比如同域下的请求：

fetch('/api/redirect')
  .then(response => {
    console.log(response.headers.get('Location')); // 能正常拿到值
    console.log(response.headers.get('Set-Cookie')); // 也能拿到（除非Cookie设置了HttpOnly，那前端本来就没法读取）
  });

2. 跨域但能搭建自己的代理服务器：用代理中转 #

如果你能部署一个自己的代理服务器（比如用Node.js、Nginx都行），这是最可行的方案：

• 代理服务器作为中间层，去请求目标服务器（服务器之间的请求不受CORS限制，能拿到所有响应头）
• 代理服务器返回给前端时，把Location、Set-Cookie加到Access-Control-Expose-Headers里，让浏览器允许前端读取

举个Node.js代理的简单例子：

const express = require('express');
const fetch = require('node-fetch');
const app = express();

app.get('/proxy', async (req, res) => {
  const targetUrl = req.query.url;
  const targetResponse = await fetch(targetUrl);

  // 关键：把需要的头暴露给前端
  res.set('Access-Control-Expose-Headers', 'Location,Set-Cookie');
  
  // 转发目标服务器的所有响应头
  targetResponse.headers.forEach((value, key) => {
    res.set(key, value);
  });

  // 转发响应体
  res.send(await targetResponse.text());
});

app.listen(3000, () => console.log('代理服务器运行在3000端口'));

然后前端请求自己的代理地址即可：

fetch('http://localhost:3000/proxy?url=https://目标服务器地址/api')
  .then(response => {
    console.log(response.headers.get('Location')); // 能拿到了！
    console.log(response.headers.get('Set-Cookie')); // 也能拿到
  });

3. 完全无法控制任何服务器：没有合法的绕过方式 #

浏览器的同源策略是安全机制，目的是防止恶意网站窃取敏感数据。如果既没法让目标服务器配置Access-Control-Expose-Headers，也没法搭建代理，那确实没有合法的办法直接通过Fetch读取这些非简单响应头。

关于Set-Cookie的额外说明 #

即使你能拿到Set-Cookie头，前端也不能手动修改或强制写入浏览器的Cookie存储（跨域情况下）。只有当目标服务器设置了正确的Domain、SameSite等Cookie属性时，浏览器才会自动保存这个Cookie，前端无法干预。

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