wake-up-neo.com

Die Anzeige in einem Frame wurde abgelehnt, da für 'X-Frame-Options' 'SAMEORIGIN' festgelegt wurde.

Ich entwickle eine Website, die reaktionsschnell sein soll, damit die Menschen von ihrem Telefon aus darauf zugreifen können. Die Website verfügt über einige gesicherte Teile, die über Google, Facebook usw. (OAuth) angemeldet werden können.

Das Server-Backend wurde mit ASP.Net Web API 2 entwickelt und das Frontend besteht hauptsächlich aus AngularJS mit einigen Razor.

Für den Authentifizierungsteil funktioniert alles in allen Browsern, einschließlich Android, aber die Google-Authentifizierung funktioniert nicht auf dem iPhone und gibt mir diese Fehlermeldung

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'.

Für mich verwende ich in meinen HTML-Dateien keinen iframe.

Ich googelte herum, aber keine Antwort brachte mich dazu, das Problem zu beheben.

angularjsasp.net-web-apigoogle-oauth
226
Ali Hmer

OK. nachdem Sie mit Hilfe dieses SO - Postens mehr Zeit dafür aufgewendet haben

Überwindung "Anzeige durch X-Frame-Optionen verboten"

Ich konnte das Problem lösen, indem ich &output=embed am Ende der URL vor dem Posten an die Google-URL hinzufügte:

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

Ich habe eine bessere Lösung gefunden, vielleicht kann es jemandem helfen "watch?v=" durch "v/" ersetzen und es wird funktionieren

var url = url.replace("watch?v=", "v/");
161
Aymen Mouelhi

Versuchen zu benutzen 

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

Sie finden den gesamten eingebetteten Code im Abschnitt "Eingebetteter Code", der so aussieht

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

Sie haben den Header in diesem Fall auf SAMEORIGIN gesetzt, was bedeutet, dass das Laden der Ressource in einem Iframe außerhalb ihrer Domäne nicht zulässig ist. Dieser iframe kann also nicht domänenübergreifend angezeigt werden

 enter image description here

Zu diesem Zweck müssen Sie die Position in Ihrem Apache oder einem anderen Dienst, den Sie verwenden, anpassen

Wenn Sie Apache verwenden, dann in der Datei httpd.conf.

  <LocationMatch "/your_relative_path">
      ProxyPass absolute_path_of_your_application/your_relative_path
      ProxyPassReverse absolute_path_of_your_application/your_relative_path
   </LocationMatch>
25
Ibtesam Latif

Wenn Sie iframe für vimeo verwenden, ändern Sie die URL von:

https://vimeo.com/63534746

zu:

http://player.vimeo.com/video/63534746

Für mich geht das.

17
Shakir Muhammed

Um Youtube-Videos in Ihre anglejs-Seite einzubetten, können Sie einfach den folgenden Filter für Ihr Video verwenden

app.filter('scrurl', function($sce) {
    return function(text) {
        text = text.replace("watch?v=", "embed/");
        return $sce.trustAsResourceUrl(text);
    };
});
<iframe class="ytplayer" type="text/html" width="100%" height="360" src="{{youtube_url | scrurl}}" frameborder="0"></iframe>

11
Irfan Muhammad

Ich habe die folgenden Änderungen vorgenommen und funktioniert gut für mich.

Fügen Sie einfach das Attribut <iframe src="URL" target="_parent" /> hinzu.

_parent: Dadurch würde die eingebettete Seite in demselben Fenster geöffnet.

_blank: In verschiedenen Registerkarten

4
rahulnikhare

Für mich bestand die Lösung darin, auf console.developer.google.com zu gehen und die Anwendungsdomäne zum Abschnitt "Javascript Origins" der OAuth 2-Anmeldeinformationen hinzuzufügen.

3
parliament

Vielen Dank für die Frage . Bei YouTube-Frames ist das erste Problem die von Ihnen angegebene URL. Ist die eingebettete URL oder der URL-Link von der Adressleiste . Dieser Fehler für eine nicht eingebettete URL, wenn Sie jedoch eine nicht eingebettete URL angeben möchten Dann müssen Sie in "Safe Pipe" wie (sowohl für nicht eingebettete als auch für eingebettete URL) codieren:

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);
        }

     }

   }
}

es wird "vedioId" aufgeteilt. Sie müssen die Video-ID abrufen und dann als eingebettete URL in Html festlegen

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

Angular 2/5 Nochmals vielen Dank.

2
Rahat Ansari

Etwas spät, aber dieser Fehler kann auch auftreten, wenn Sie einen native application Client ID anstelle eines web application Client ID verwenden.

2
Kevin

Bei der Verwendung von iframe zum Abmelden von untergeordneten Websites mit unterschiedlichen Domänen kam es zu diesem ähnlichen Problem. Die von mir verwendete Lösung bestand darin, zuerst den iframe zu laden und dann die Quelle zu aktualisieren, nachdem der Frame geladen wurde.

var frame = document.createElement('iframe');
frame.style.display = 'none';
frame.setAttribute('src', 'about:blank');
document.body.appendChild(frame);
frame.addEventListener('load', () => {
  frame.setAttribute('src', url);
});

1
Nutzs

Eine einfache Lösung besteht darin, die Erweiterung "Ignoriere X-Frame-Header" zu Ihrem Chrome.

1
saurabh sunny

Es gibt eine Lösung, die für mich funktioniert hat und sich auf die Eltern bezieht. Nachdem Sie die URL erhalten haben, die auf die Google-Authentifizierungsseite umgeleitet wird, können Sie folgenden Code ausprobieren:

var loc = redirect_location;      
window.parent.location.replace(loc);
1
Dimtris Voudrias