如何在ClaimCenter的Exit Point PCF中为GET请求添加请求头

直接用window.open或原生a标签跳转无法给GET请求添加自定义请求头，以下是两个可行的实现思路：

方案一：前端通过fetch获取内容后跳转 #

通过fetch发送带自定义头的GET请求，拿到响应内容转成Blob，再生成临时URL在新标签页打开：

// PCF组件核心代码片段
async function openTargetUrl() {
  const targetUrl = "你的目标接口地址";
  // 定义需要的自定义请求头
  const customHeaders = {
    "X-Your-Custom-Header": "header-value",
    "Authorization": "Bearer your-token" // 如果需要身份验证
  };

  try {
    // 发送带请求头的GET请求
    const res = await fetch(targetUrl, {
      method: "GET",
      headers: customHeaders
    });

    if (!res.ok) throw new Error(`HTTP错误状态: ${res.status}`);
    // 将响应转为Blob
    const blob = await res.blob();
    // 生成临时URL
    const tempUrl = URL.createObjectURL(blob);
    // 在新标签页打开
    window.open(tempUrl, "_blank");

    // 延迟清理临时URL，避免内存泄漏
    setTimeout(() => URL.revokeObjectURL(tempUrl), 1500);
  } catch (err) {
    console.error("请求处理失败:", err);
    // 这里可以添加ClaimCenter内的错误提示，比如调用平台的通知API
  }
}

注意点：

• 目标URL必须允许跨域（CORS配置放行ClaimCenter域名），否则会触发跨域错误。
• 如果目标返回的是HTML页面，这种方式可以正常显示；如果是文件，会直接触发下载。

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

如果前端方案受限于跨域或安全问题（比如不想在前端暴露敏感请求头），可以通过ClaimCenter后端做代理：

1. 在ClaimCenter后端开发一个代理接口，接收PCF的请求参数。
2. 后端接口添加自定义请求头后，转发请求到目标URL。
3. PCF调用这个后端接口，拿到响应后再打开对应的结果页面，或者让后端直接重定向到目标URL（如果不需要处理响应内容）。

优势：

• 规避跨域问题，敏感请求头不会暴露在前端。
• 更符合企业级应用的安全规范。

额外配置提示 #

• 检查ClaimCenter的CSP（内容安全策略），确保允许向目标URL发起请求，以及允许创建Blob URL。
• 在PCF的ControlManifest.Input.xml中，确保声明了必要的权限，比如：

<SupportedFeatures>
  <Feature>Navigation</Feature>
</SupportedFeatures>

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