Nie chciał pokazywać się w kadrze, bo on ustanowił "X-Frame-Options" w "SAMEORIGIN"

Ja tworzę stronę internetową, która musi być elastyczny, aby ludzie mogli uzyskać do niego dostęp ze swoich telefonów. Na miejscu istnieje kilka chronionych części, które można zalogować się za pomocą Google, Facebook,...itp. (protokół OAuth).

zaplecza jest rozwijany z wykorzystaniem ASP.Net web API 2 i przód w zasadzie AngularJS z pewnym brzytwą.

dla części uwierzytelniania wszystko działa poprawnie we wszystkich przeglądarkach, w tym Android, ale uwierzytelnianie Google nie praca na iPhone, i to daje mi ten komunikat o błędzie

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

teraz, jak jestem zaniepokojony, nie używam iframe w moich plikach HTML.

a czemu nie wokół, ale żadnej odpowiedzi nie kazał mi rozwiązać problem.


znalazłem najlepsze rozwiązanie, to może komuś pomóc zamień "watch?v=" by "v/" i to będzie działać

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

OK, spędzając więcej czasu na to z tej wiadomości SO

pokonanie "wyświetlanie zabronione X-Frame-Options"

udało mi się rozwiązać problem poprzez dodanie &output=embed do końca url przed wysłaniem na adres URL, google:

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

w tym przypadku są one zainstalowane tytuł SAMEORIGIN, co oznacza, że są one zakazane pobieranie zasobów w iframe na zewnątrz swojej domeny. W ten sposób iframe nie może wyświetlić cross-domena

enter image description here

do tego trzeba dopasować położenie w swoim apache lub jakąkolwiek inną usługą, którą używasz

Jeśli używasz Apache, httpd.plik conf.

  <LocationMatch "/your_relative_path">
      ProxyPass absolute_path_of_your_application/your_relative_path
      ProxyPassReverse absolute_path_of_your_application/your_relative_path
   </LocationMatch>

spróbuj

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

można znaleźć cały wbudowany kod w sekcji "Osadzone Code", i to wygląda tak

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

Jeśli używasz iframe, vimeo, zmień adres url:

https://vimeo.com/63534746

do:

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

To działa dla mnie.


do osadzania filmów z youtube w swoją stronę angularjs, możesz po prostu użyć następującego filtr dla plików wideo

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>

zrobiłem następujące zmiany i działa dobrze dla mnie.

wystarczy dodać atrybut <iframe src="URL" target="_parent" />

_parent: to otworzy wbudowaną stronę w tym samym oknie.

_blank: w drugiej zakładce


dla mnie poprawka powinno było wejść w console.developer.google.com i dodaj domenę aplikacji, w sekcji "JavaScript Origins"poświadczeń OAuth 2.


trochę późno, ale ten błąd może być również wywołana, jeśli używasz native application Client ID zamiast web application Client ID.


Dzięki za pytanie. Na YouTube iframe pierwszy problem-to adres URL, który dałeś, to wbudowany URL lub adres URL-link z paska adresu. ten błąd nie embed URL, ale jeśli chcesz dać nie embed URL, to trzeba zakodować w "bezpiecznej rurze", jak (nie wbudowanego lub wbudowanego 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);
        }

     }

   }
}

zostanie podzielony "vedioId". Należy uzyskać identyfikator wideo, a następnie ustawić adres URL wbudowanego. W Html

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

narożna 2/5 dziękuję ponownie.


jest to rozwiązanie, które zadziałało na mnie, powołując się na rodzica. Po otrzymaniu adresu url, który przekieruje na stronę uwierzytelniania google, możesz spróbować następujący kod:

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