Google街景未显示在网站上

Question

我正在尝试在网站上嵌入Google地图和街景。邮政编码，纬度和经度存储在可以的数据库中，我的代码为：

<iframe width="600" height="450" frameborder="0" style="border:0"
                src="https://www.google.com/maps/embed/v1/place?q={{ $code[0] }}%20{{$code[1]}}&key=MYKEY" allowfullscreen></iframe>
                <hr />
                  <iframe src="https://maps.googleapis.com/maps/api/streetview?size=400x400&location={{ $pc[0]['latitude'] }},{{ $pc[0]['longtitude'] }}&fov=80&heading=70&pitch=0&key=MYKEY&signature=MYSIGNATURE" width="600" height="450" frameborder="0" style="border:0;" allowfullscreen=""></iframe>

PHP返回此确定为

 <iframe width="600" height="450" frameborder="0" style="border:0"
                src="https://www.google.com/maps/embed/v1/place?q=BA1%204HX&key=MYKEY" allowfullscreen></iframe>
                <hr />
                  <iframe src="https://maps.googleapis.com/maps/api/streetview?size=400x400&location=51.398734,-2.3936212&fov=80&heading=70&pitch=0&key=AMYKEY&signature=MYSIGNATURE" width="600" height="450" frameborder="0" style="border:0;" allowfullscreen=""></iframe>

问题是地图很好且正确，但街道视图为空白。

我看过Frefox工具以拒绝或Google采取任何措施，但一无所获。

Answer 1

尝试您的示例代码时，出现Refused to display .... in a frame because it set 'X-Frame-Options' to 'sameorigin'错误：

[请注意，街景静态API应该像这样嵌入在<img>标记的src属性中：

<img src="https://maps.googleapis.com/maps/api/streetview?size=400x400&location=51.398734,-2.3936212&fov=80&heading=70&pitch=0&key=YOUR_API_KEY&signature=SIGNATURE"/>

要解决此问题，您可以如上所述在<img>标签中加载街景静态图像，也可以将街景模式用于Maps Embed API，看起来像这样：

<iframe src="https://www.google.com/maps/embed/v1/streetview?location=51.398734,-2.3936212&fov=80&heading=70&pitch=0&key=YOUR_API_KEY" width="600" height="450" frameborder="0" style="border:0;" allowfullscreen=""></iframe>