我正在开发一个网站,应该是响应,以便人们可以从他们的手机访问它。该网站有一些安全的部分,可以登录使用谷歌,Facebook,…等(OAuth)。

服务器后端是用ASP开发的。Net Web API 2,前端主要是AngularJS加上一些Razor。

对于身份验证部分,在包括Android在内的所有浏览器中,一切都很好,但谷歌身份验证在iPhone上不起作用,它给我这个错误消息

Refused to display 'https://accounts.google.com/o/openid2/auth
?openid.ns=http://specs.openid.ne…tp://axschema.org/namePerson
/last&openid.ax.required=email,name,first,last'
in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

现在就我而言,我没有在我的HTML文件中使用任何iframe。

我搜索了一下,但没有答案让我解决这个问题。


当前回答

我测试了所有的项目,但这段代码帮助我:

       ?rs:embed=true

例如,我想在我的应用程序中加载一个pbix。我使用这个代码:

   <iframe id="pageIFrame" class="iFrame" src="http://MyServer/ReportS/powerbi/Test?rs:embed=true"></iframe>

这很有效。

其他回答

有一个类似的问题,嵌入youtube聊天,我想出了它。也许类似的问题有类似的解决方案。

Refused to display 'https://www.youtube.com/live_chat?v=yDc9BonIXXI&embed_domain=your.domain.web' in a frame because it set 'X-Frame-Options' to 'sameorigin'

我的网页工作有www和没有它。所以为了让它正常工作,你需要确保你加载了embed_domain= value…也许你缺少一个变量来告诉你在哪里嵌入你的iframe。为了解决我的问题,必须写一个脚本来检测正确的网页和执行适当的iframe嵌入域名。

<iframe src='https://www.youtube.com/live_chat?v=yDc9BonIXXI&embed_domain=your.domain.web' width="100%" height="600" frameborder='no' scrolling='no'></iframe>

or

<iframe src='https://www.youtube.com/live_chat?v=yDc9BonIXXI&embed_domain=www.your.domain.web' width="100%" height="600" frameborder='no' scrolling='no'></iframe>

要知道你没有使用iframe,但是仍然可能需要添加一些变量到你的语法中,以告诉它脚本将在哪里使用。

在PHP文件(index.php)中,将这一行添加到顶部

<?php
    header('Cross-Origin-Embedder-Policy: require-corp | same-site | same-origin | cross-origin');
?>

如果还是不行,试试这个

<?php
    header("Access-Control-Allow-Credentials: true");
    header("Access-Control-Allow-Headers: Accept, X-Access-Token, X-Application-Name, X-Request-Sent-Time");
    header("Access-Control-Allow-Methods: GET, POST, OPTIONS");
    header("Access-Control-Allow-Origin: *");
    header('Cross-Origin-Opener-Policy: same-origin');
    header('Cross-Origin-Resource-Policy: same-site | same-origin | cross-origin');
    header('Cross-Origin-Embedder-Policy: require-corp | same-site | same-origin | cross-origin');
?>

试着使用

https://www.youtube.com/embed/YOUR_VIDEO_CODE

你可以在“嵌入式代码”部分找到所有的嵌入式代码,它看起来像这样

<iframe width="560" height="315"  src="https://www.youtube.com/embed/YOUR_VIDEO_CODE" frameborder="0" allowfullscreen></iframe>

好吧,在这篇SO文章的帮助下花了更多的时间之后

克服“x帧选项禁止显示”

我设法解决了这个问题,在发布到谷歌url之前,将&output=embed添加到url的末尾:

var url = data.url + "&output=embed";
window.location.replace(url);

谢谢你的问题。 对于YouTube iframe,第一个问题是你给出的URL,是嵌入URL还是地址栏的URL链接。 这个错误用于非嵌入URL,但如果你想要给出非嵌入URL,那么你需要在“安全管道”中编码(对于非嵌入URL或嵌入URL):

import {Pipe, PipeTransform} from '@angular/core';
import {DomSanitizer} from '@angular/platform-browser';

@Pipe({name: 'safe'})
export class SafePipe implements PipeTransform {

constructor(private sanitizer: DomSanitizer) {

}

transform(value: any, url: any): any {
    if (value && !url) {
        const regExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
        let match = value.match(regExp);
        if (match && match[2].length == 11) {
            console.log(match[2]);
            let sepratedID = match[2];
            let embedUrl = '//www.youtube.com/embed/' + sepratedID;
            return this.sanitizer.bypassSecurityTrustResourceUrl(embedUrl);
        }

     }

   }
}

它会分裂出“vedioId”。你必须得到视频id,然后设置为URL嵌入。 在Html中

 <div>
   <iframe width="100%" height="300" [src]="video.url | safe"></iframe>
 </div>

角2/5 再次感谢。