Flutter中隐藏Iframe的src链接问题求助

首先得明确：完全隐藏真实URI是不可能的——浏览器必须拿到真实地址才能加载iframe内容，懂技术的人总能通过网络请求等方式获取到。但可以用以下方法提升获取门槛，阻止普通用户直接复制使用：

1. 动态解密后设置src #

把URI做简单混淆（比如Base64+自定义字符干扰），前端用JS解密后再赋值给iframe，初始时iframe的src为空或占位符。

示例流程： #

• 先在Flutter/后端把真实URI转成Base64，再做自定义混淆（比如每个字符后加个固定干扰符）：
  比如真实地址https://example.com转Base64是aHR0cHM6Ly9leGFtcGxlLmNvbQ==，混淆后变成aHxRx0cxHxMx6Lxy9lxeGxftcxGxlLxmNxvbQx==（每个字符后加x）
• 前端JS解密并设置src：

  // 自定义解密函数
  function getRealUri(encodedStr) {
    // 先移除干扰字符
    const cleanStr = encodedStr.replace(/x/g, '');
    // 解码Base64
    return window.atob(cleanStr);
  }
  
  // 给iframe设置真实地址
  const myIframe = document.getElementById('targetIframe');
  myIframe.src = getRealUri('aHxRx0cxHxMx6Lxy9lxeGxftcxGxlLxmNxvbQx==');
  

• HTML里的iframe初始状态：

  <iframe id="targetIframe" src="" frameborder="0"></iframe>
  

  这样检查元素时，初始看不到真实地址，只有JS执行后才会赋值，混淆后的字符串也无法直接识别。

2. 用后端代理中转 #

不要把真实URI直接传给前端，而是让iframe请求你的后端接口，由后端去拉取目标资源并返回给前端。

示例： #

• HTML里的iframe：

  <iframe src="/api/iframe-proxy?key=abc123" frameborder="0"></iframe>
  

• 后端逻辑：根据key=abc123映射到真实URI（比如后端配置里存abc123对应https://example.com），然后返回目标资源的内容或者做302跳转（注意跨域问题）。
  这种方式下，前端只能看到你的代理接口地址，看不到真实的目标URI。

3. 混淆JS代码 #

把设置iframe src的JS代码用混淆工具（比如Terser、JSObfuscator）处理，让解密逻辑变得难以读懂。即使别人拿到JS代码，也需要花时间逆向分析才能拿到真实URI。

重要提醒 #

所有方法都只能提高获取门槛，无法彻底隐藏真实地址——只要浏览器能加载资源，技术人员就能通过浏览器的「网络请求」面板看到真实的URI（因为浏览器必须发送请求去获取资源）。这些方法主要是阻止普通用户直接复制使用。

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