使用不同的用户代理加载 iframe 内容答案

【问题标题】：Load iframe content with different user agent使用不同的用户代理加载 iframe 内容
【发布时间】：2012-10-02 11:09:37
【问题描述】：

是否可以使用不同的用户代理加载 iframe ？为 iframe 使用移动用户代理将有助于我的应用将移动网站显示为悬停弹出窗口。

例如，只有当用户代理来自移动端时，Google 才会显示移动搜索结果页面。

是否有任何替代解决方案，或者这个想法是否涉及任何安全风险？？

【问题讨论】：

我认为您必须使用服务器代理该页面。如果您使用一些简单的 PHP，您可能会设法发送假标头。

标签： html browser popup

【解决方案1】：

首先，您必须创建一个函数来更改用户代理字符串：

function setUserAgent(window, userAgent) {
  if (window.navigator.userAgent != userAgent) {
    var userAgentProp = {
      get: function() {
        return userAgent;
      }
    };
    try {
      Object.defineProperty(window.navigator, 'userAgent', userAgentProp);
    } catch (e) {
      window.navigator = Object.create(navigator, {
        userAgent: userAgentProp
      });
    }
  }
}

那么你需要定位iframe元素：

setUserAgent(
    document.querySelector('iframe').contentWindow, 
    'Aakash Chakravarthy Mobile Agent'
);

您还可以为 iframe 设置一个 ID，并以该 ID 而非页面上的所有 iframe 元素为目标。

【讨论】：

不错的解决方案，尽管我不得不将 document.querySelector 更改为 document.getElementById
这应该在 Chrome 中工作吗？我无法设置 iframe 的 userAgent。但是没有抛出任何错误。
@philk 它不应该与任何具有增强安全功能的现代浏览器一起使用。
这在 Windows Google Chrome 版本 78.0.3904.108（官方版本）（64 位）中现在不适合我
@Ryan 它不应该与任何具有增强安全功能的现代浏览器一起使用。

【解决方案2】：

你可以用 JavaScript 做到这一点：

navigator.__defineGetter__('userAgent', function(){
    return 'foo' // customized user agent
});

navigator.userAgent; // 'foo'

但是，这仅适用于选定数量的浏览器。

看到这个问题：Mocking a useragent in javascript?

【讨论】：

如何使用它来加载带有所需用户代理的 iframe src？不知道如何开始
尽管你没有解决原始问题，但你可以将其分配给 iframe 对象。
嘿@Fluidbyte...你能分享一个例子吗？

【解决方案3】：

您可以创建一个使用不同用户代理发出请求的代理，然后通过该代理加载 iframe 内容。

【讨论】：

听起来很聪明，可能是遇到跨域问题时唯一的解决方案。你能给出一个处理这个问题的链接吗？我没有找到正确的关键字来获得良好的搜索结果...（ps：刚刚想起 cors-anywhere，会尝试一下）
@brasofilo 我为我的个人小型开发服务器（发布为 2.7.0 版）添加了功能，并使用此处代理部分中记录的最后一个代码块使其按预期工作：github.com/billymoon/sir#proxy

【解决方案4】：

据我所知，您有两种解决方案：

大多数网站不会按用户代理呈现，它们只是识别用户代理并将用户重定向到移动视图，可在不同的域 (http://m.youtube.com/,例如）或其他一些 URL 段。您只需检查他们的文档，获取他们的移动 URL 并将其加载到 iframe 中。
另一种解决方案是将 iframe 指向您的应用程序，然后从后端获取文档。然后您可以更改请求用户代理。

从 HTML 是不可能影响请求标头的。但是你可以用javascript来做到这一点。

【讨论】：

【解决方案5】：

我猜可能只会更改整个浏览器窗口或选项卡的用户代理信息。通过在不同时间加载 iframe，可以在加载之间更改用户代理，以在一个页面上获得两个不同的 iframe，其中包含不同的用户代理相关内容。我用一个简单的示例页面对此进行了测试：

<!DOCTYPE html> <html> <body>
<iframe src="http://whatsmyuseragent.com/" name="mobile" width="60%" height="400px"></iframe>
<a href="http://whatsmyuseragent.com/" target="mobile">Mobile Spoof</a>
<iframe src="http://whatsmyuseragent.com/" name="pc" width="60%" height="400px" ></iframe>
</body> </html>

在 Firefox 36.0.1 中加载此页面后，我使用用户代理切换器扩展 https://addons.mozilla.org/en-US/firefox/addon/user-agent-switcher/ 选择 iPhone 3.0，然后单击“Mobile Spoof”链接重新加载该框架。那时我看到同一个页面在每个 iframe 中显示不同的用户代理。我确信页面加载或重新加载时间可以通过 setTimeout() 方法或通过事件处理程序自动化。我不确定如何自动化用户代理切换。我尝试了 Aero Windwalker 建议的 setUserAgent 函数，但无法让它在 Firefox 36 或 Chrome 41 中运行。我还想创建一个可以很好地完成此操作的页面。

【讨论】：