如何在 Google 搜索结果页面中嵌入 iframe

Posted

技术标签:

【中文标题】如何在 Google 搜索结果页面中嵌入 iframe【英文标题】:How Can You Embed An iframe IN A Google Search Result Page 【发布时间】:2016-07-13 01:42:53 【问题描述】:

无论出于何种原因,这并不重要,我正在尝试通过 iframe 将谷歌购物与另一个页面结合起来。

我尝试了here 提出的方法,包括在 iframe 中嵌入谷歌自定义搜索查询,但谷歌自定义搜索不允许访问购物标签。

我想,如果您无法嵌入 Google,请将自己嵌入其中。所以我继续在页面中注入一些 jQuery

var jq = document.createElement('script');
jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);
// ... give time for script to load, then type.
jQuery.noConflict();

将google购物搜索结果页面清理为我需要的内容,即div#search中的html

jQuery(function($) $('#search').show().parentsUntil('body').andSelf().siblings().hide(););

创建一个 iframe 并注入它:

var iframe = document.createElement('iframe')
iframe.src="http://example.com"
iframe.;
iframe.;
iframe.style="visibility:visible";
document.body.appendChild(iframe)

唯一的问题是 iframe 不加载页面的内容,因此是空白的。如果您在任何其他页面中尝试上述 sn-p,它就会起作用。谷歌似乎阻止加载 iframe。我怎样才能解决这个问题?

【问题讨论】:

Google 搜索结果无法在 IFrame 中使用。 【参考方案1】:

Google 似乎无法使用 iframe...即使您不使用 JS。 您应该改用Google Custom Search API,它允许您创建自定义搜索引擎。 您只需输入一个示例网站,将选项更改为搜索所有网络。并再次删除您输入的网站。 要创建自定义搜索引擎,您需要一个 google 帐户。 开始here。

【讨论】:

感谢您的回答@RoiEX。它有两个问题:自定义搜索不允许您访问“购物”标签,另一种方法是在 Google 购物中嵌入 iframe。【参考方案2】:

当我运行该代码时,我的控制台中报告了以下错误:

VM259:7 混合内容:“https://www.google.co.uk/?gws_rd=ssl”处的页面是通过 HTTPS 加载的,但请求了不安全的资源“http://example.com/”。此请求已被阻止;内容必须通过 HTTPS 提供。

将其更改为 HTTPS URL:

var iframe = document.createElement('iframe')
iframe.src="https://example.com"
iframe.;
iframe.;
iframe.style="visibility:visible";
document.body.appendChild(iframe)

…让它工作正常(尽管它藏在徽标后面):

【讨论】:

【参考方案3】:

@Quentins 评论的 Tnx。

更新:

将代码嵌入谷歌网站:

一般来说,您不能为不属于您的网页嵌入代码。

如果用户打开您的网站并使用 google 打开另一个选项卡,或者您的网站使用 google 打开另一个选项卡,则您的网站无法访问 google 网站源代码/上下文,并且您无法影响 google 网站,因为有彼此完全隔离。

您在 您的 浏览器控制台中创建的 Google 页面中似乎是您清理结果和嵌入 iframe 的操作。这些更改仅对您的浏览器在本地产生影响,不会影响任何其他打开 google 网站的用户。

可能的解决方案

其实你可以将一些代码嵌入到其他页面中,但是你需要使用:

Browser extensions(太复杂了,因为用户需要安装你的浏览器扩展) XSS/其他易受攻击者(谷歌搜索网站几乎不可能)

将 google 嵌入您的页面:

由于 google.com 的 http 响应中的 x-frame-options 标头,您无法嵌入来自 google 的 iframe。没有好的解决方法,抱歉。

X-Frame-Options HTTP 响应标头可用于指示是否应允许浏览器以<frame><iframe><object> 呈现页面。网站可以使用它来避免点击劫持攻击,确保其内容不会嵌入到其他网站中。

【讨论】:

所以?这个问题是问如何将 iframe 注入 Google 搜索结果页面,而不是如何在框架中显示该结果页面。 您仍然没有回答问题。您已经回答了“我如何在其他人的网站上运行 javascript?”这个问题,但问题表明 OP 已经实现了这一点。他们有一个你没有解决的具体问题。

以上是关于如何在 Google 搜索结果页面中嵌入 iframe的主要内容,如果未能解决你的问题,请参考以下文章

如何提示从嵌入式地图打开 Google Maps Directions 到 Google Maps Navigator 的页面?

我可以将 Google 图片搜索嵌入到我的 html5 网页中吗

嵌入 Vimeo Bootstrap 3.0

如何在 UIWebView 中检测重定向

自定义搜索引擎

如何获取嵌入在 PhantomJS 运行的 JS 的 HTML 页面结果中的 JSON 对象并将它们传递给 java 代码?