带自定义Header的跨URL跳转及SSO身份认证实现方案咨询

先明确核心问题：浏览器的重定向（3xx响应）不会保留自定义请求Header；而XMLHttpRequest是异步请求，只会获取响应内容，不会让浏览器主动加载跳转后的页面，所以你之前的两种尝试都走不通。下面是几种可行的解决思路：

方案一：后端代理转发（推荐生产环境使用） #

让AppA的后端做中间层，帮前端把请求转发给AppB，同时带上user_id Header：

1. 前端点击按钮时，直接跳转到AppA的一个代理接口（比如/go-to-appb）
2. AppA后端接口收到请求后，取出当前请求里的user_id Header，然后用后端Http客户端（比如Spring的RestTemplate）携带这个Header去请求AppB的页面
3. 把AppB返回的页面内容、响应头原封不动返回给前端，浏览器就会加载AppB的页面了

Java Spring的示例代码：

@GetMapping("/go-to-appb")
public ResponseEntity<String> forwardToAppB(@RequestHeader("user_id") String userId) {
    HttpHeaders headers = new HttpHeaders();
    headers.set("user_id", userId);
    HttpEntity<Void> requestEntity = new HttpEntity<>(headers);

    // 调用AppB的页面地址
    ResponseEntity<String> appBResp = restTemplate.exchange(
            "http://someEngine.com/index.html",
            HttpMethod.GET,
            requestEntity,
            String.class
    );

    // 透传AppB的响应给前端
    return ResponseEntity.status(appBResp.getStatusCode())
            .headers(appBResp.getHeaders())
            .body(appBResp.getBody());
}

这个方案的优势是user_id全程在后端传递，不会暴露给前端，安全性高。

方案二：用POST表单提交（需AppB配合调整认证逻辑） #

利用HTML表单的POST请求可以携带隐藏字段的特性，让AppB支持从POST参数中读取user_id：

1. 在AppA页面里创建一个隐藏的POST表单，action指向AppB的页面地址，添加隐藏input存储user_id
2. 用户点击按钮时触发表单提交，浏览器会发送POST请求到AppB，携带user_id参数
3. AppB后端调整认证逻辑，同时支持从Header和POST参数中获取user_id

前端示例代码：

<form id="appbForm" method="POST" action="http://someEngine.com/index.html" style="display:none;">
    <input type="hidden" name="user_id" value="这里填当前登录用户的user_id">
</form>

<button onclick="document.getElementById('appbForm').submit()">打开规则配置引擎</button>

这种方案不需要后端代理，实现简单，但需要AppB做少量改造。

方案三：URL参数传递（临时应急方案，不推荐生产环境） #

如果AppB可以临时兼容从URL参数读取user_id，直接在跳转URL里拼接参数：

const userId = "当前登录用户的user_id";
window.location.href = `http://someEngine.com/index.html?user_id=${encodeURIComponent(userId)}`;

注意：URL参数会显示在地址栏、浏览器历史和服务器日志里，存在泄露风险，只适合临时调试或非敏感场景。

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