Question

出于个人用途，我试图在iframe中显示https://maps.google.com。注意：我不希望使用Google的Embed API。

这就是我所做的：

使用Chrome扩展程序删除以下请求标头：X-Frame-Options，Access-Control-Allow-Origin，Access-Control-Allow-Methods
改为添加以下标头：Access-Control-Allow-Methods: *，Access-Control-Allow-Origin: *，Content-Security-Policy: frame-ancestors *;
以上操作是对所有url（在我的扩展程序中为browser.webRequest.onHeadersReceived.addListener）上的所有请求标头完成的，它是超级允许的，但现在我只是想使其发挥作用。

现在我正在尝试做<iframe src=" https://maps.google.com" />。

它在途中起作用：

我在iframe上看到了Google地图
但是底部有一个永久的“正在加载...”文本，我无法单击标记或搜索内容（请参见screenshot）。
我在控制台中收到以下错误：

Blocked autofocusing on a form control in a cross-origin subframe.
maps:13 Uncaught DOMException: Blocked a frame with origin "https://www.google.com" from accessing a cross-origin frame.
    at Object._.Hr (https://www.google.com/maps/_/js/k=maps.m.en.dc5HEiFGHqQ.O/m=sc2,per,mo,lp,ti,ds,stx,bom,b/rt=j/d=1/rs=ACT90oFcxIV8Ad7kvBMCB_zNoSobKCZYEw:210:51)
    at /maps/_/js/k=maps.m.en.dc5HEiFGHqQ.O/m=vwr,vd,a,owc,ob,sp,en,smi,sc,vlg,log,smr,as,wrc/rt=j/d=1/ed=1/exm=sc2,per,mo,lp,ti,ds,stx,bom,b/rs=ACT90oFcxIV8Ad7kvBMCB_zNoSobKCZYEw:3599:3
    at /maps/_/js/k=maps.m.en.dc5HEiFGHqQ.O/m=vwr,vd,a,owc,ob,sp,en,smi,sc,vlg,log,smr,as,wrc/rt=j/d=1/ed=1/exm=sc2,per,mo,lp,ti,ds,stx,bom,b/rs=ACT90oFcxIV8Ad7kvBMCB_zNoSobKCZYEw:4990:3
    at NLa (https://www.google.com/maps/_/js/k=maps.m.en.dc5HEiFGHqQ.O/m=sc2,per,mo,lp,ti,ds,stx,bom,b/rt=j/d=1/rs=ACT90oFcxIV8Ad7kvBMCB_zNoSobKCZYEw:1677:132)
    at LLa.next (https://www.google.com/maps/_/js/k=maps.m.en.dc5HEiFGHqQ.O/m=sc2,per,mo,lp,ti,ds,stx,bom,b/rt=j/d=1/rs=ACT90oFcxIV8Ad7kvBMCB_zNoSobKCZYEw:1676:469)
    at IIa.f [as H] (https://www.google.com/maps/_/js/k=maps.m.en.dc5HEiFGHqQ.O/m=sc2,per,mo,lp,ti,ds,stx,bom,b/rt=j/d=1/rs=ACT90oFcxIV8Ad7kvBMCB_zNoSobKCZYEw:1561:184)
    at RIa (https://www.google.com/maps/_/js/k=maps.m.en.dc5HEiFGHqQ.O/m=sc2,per,mo,lp,ti,ds,stx,bom,b/rt=j/d=1/rs=ACT90oFcxIV8Ad7kvBMCB_zNoSobKCZYEw:1556:332)
    at eJa (https://www.google.com/maps/_/js/k=maps.m.en.dc5HEiFGHqQ.O/m=sc2,per,mo,lp,ti,ds,stx,bom,b/rt=j/d=1/rs=ACT90oFcxIV8Ad7kvBMCB_zNoSobKCZYEw:1565:43)
    at vA.Ma (https://www.google.com/maps/_/js/k=maps.m.en.dc5HEiFGHqQ.O/m=sc2,per,mo,lp,ti,ds,stx,bom,b/rt=j/d=1/rs=ACT90oFcxIV8Ad7kvBMCB_zNoSobKCZYEw:1564:405)
    at mb (https://www.google.com/maps/_/js/k=maps.m.en.dc5HEiFGHqQ.O/m=sc2,per,mo,lp,ti,ds,stx,bom,b/rt=j/d=1/rs=ACT90oFcxIV8Ad7kvBMCB_zNoSobKCZYEw:1563:293)

关于接下来我可以尝试做些什么的任何想法？还是完全不可能？

Answer 1

简短答案：。无法完成。

长答案： X-Frame-Options是在服务器端确定的。这意味着，打开页面的人不会决定是否可以在iframe中打开文件，而是由文件的作者来决定。在这种情况下，它是Google。

我尝试通过Google搜索实现相同的目的，即您在文本框中输入单词，然后点击Submit会弹出iframe，显示Google结果。我做了一些研究，得知它无法完成，因为Google不允许其他来源显示他们的页面。

这就是为什么他们拥有API。

关于此的更多信息-How to show google.com in an iframe?

如何解决“通过访问跨域框架阻止了以“ https://example.org”为源的框架。”

1 个答案: