是否可以使用不同的用户代理加载 iframe ?为 iframe 使用移动用户代理将帮助我的应用程序将移动网站显示为悬停弹出窗口。
例如,只有当用户代理来自移动端时,Google 才会显示移动端搜索结果页面。
是否有任何替代解决方案,或者这个想法是否涉及任何安全风险?
首先,您必须创建一个函数来更改用户代理字符串:
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 元素。
你可以用 JavaScript 做到这一点:
navigator.__defineGetter__('userAgent', function(){
return 'foo' // customized user agent
});
navigator.userAgent; // 'foo'
但是,这仅适用于选定数量的浏览器。
您可以创建一个使用不同用户代理发出请求的代理,然后通过代理加载 iframe 内容。
据我所知,您有两种解决方案:
大多数网站不会按用户代理呈现,它们只是识别用户代理并将用户重定向到移动视图,可以在不同的域(例如 http://m.youtube.com/)或其他一些域下访问网址段。您只需检查他们的文档,获取他们的移动 URL 并将其加载到 iframe 中。
另一种解决方案是将 iframe 指向您的应用程序,然后从后端获取文档。然后您可以更改请求用户代理。
从 HTML 是不可能影响请求标头的。但是你可以用javascript来做到这一点。
我猜可能只会更改整个浏览器窗口或选项卡的用户代理信息。通过在不同时间加载 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 中加载此页面后,我使用 User Agent Switcher 扩展程序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 中工作。我还想创建一个可以很好地完成此操作的页面。