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

时间:2016-03-25 09:49:18

标签: javascript jquery html css iframe

无论出于何种原因,这都不重要,我正试图通过iframe将谷歌购物与其他页面结合起来。

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

我想,如果你无法嵌入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内的html#search

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

创建一个iframe并将其注入:

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

唯一的问题是iframe没有加载页面内容,而是空白。如果您在任何其他页面中尝试上述代码段,则可以正常使用。谷歌似乎阻止加载iframe。我怎么能解决这个问题?

3 个答案:

答案 0 :(得分:3)

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

答案 1 :(得分:2)

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

  

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

将其更改为HTTPS网址:

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

...让它工作得很好(尽管它隐藏在徽标背后):

screenshot

答案 2 :(得分:2)

@Quentins的Tnx评论。

UPD:

将代码嵌入谷歌网站:

通常,您无法嵌入您不拥有的页面的代码。

如果用户打开您的网站并打开谷歌的另一个标签或您的网站打开谷歌的另一个标签,您的网站无法访问谷歌网站的源代码/上下文,你不能影响谷歌网站,因为有完全相互隔离。

似乎您的行为是为了清理结果,并将您的iframe嵌入您在您的浏览器控制台中制作的Google页面中。这些更改仅对您的浏览器在本地有影响,并且不会影响打开Goog​​le网站的任何其他用户。

可能的解决方案

实际上,您可以将一些代码嵌入其他页面,但您需要使用:

  • Browser extensions(太复杂了,因为用户需要为浏览器安装扩展程序)
  • XSS /其他漏洞(谷歌搜索网站几乎不可能)

将Google嵌入您的网页

由于google.com的http响应中的x-frame-options标题,您无法从谷歌嵌入iframe。对不起,没有好的解决方法。

  

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

enter image description here