angularjs - htaccess - Se negó a mostrarse en un marco porque configuró ''X-Frame-Options'' en ''SAMEORIGIN''
x-frame-options nginx (11)
Aceptar, después de pasar más tiempo en esto con la ayuda de esta publicación SO
Superación de "Visualización prohibida por X-Frame-Options"
Logré resolver el problema agregando &output=embed al final de la URL antes de publicar en la URL de Google:
var url = data.url + "&output=embed";
window.location.replace(url);
Estoy desarrollando un sitio web que se supone que debe responder para que las personas puedan acceder a él desde sus teléfonos. El sitio tiene algunas partes seguras en las que se puede iniciar sesión utilizando Google, Facebook, etc. (OAuth).
El servidor backend se desarrolla utilizando ASP.Net Web API 2 y la interfaz es principalmente AngularJS con algo de Razor.
Para la parte de autenticación, todo funciona bien en todos los navegadores, incluido Android, pero la autenticación de Google no funciona en el iPhone y aparece este mensaje de error.
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''.
Ahora, en lo que a mí respecta, no uso ningún iframe en mis archivos HTML.
Busqué en Google, pero ninguna respuesta me hizo arreglar el problema.
En este caso, han establecido el encabezado en SAMEORIGIN, lo que significa que no han permitido cargar el recurso en un iframe fuera de su dominio. Así que este iframe no puede mostrar dominio cruzado
Para este propósito, debe coincidir con la ubicación en su apache o cualquier otro servicio que esté utilizando
Si está utilizando apache entonces en el archivo 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>
Encontré una solución mejor, tal vez pueda ayudar a alguien a reemplazar "watch?v=" por "v/" y funcionará
var url = url.replace("watch?v=", "v/");
Gracias por la pregunta. Para el iframe de YouTube, el primer problema es la URL que proporcionó, es la URL incrustada o el enlace de la URL desde la barra de direcciones. este error para la URL no incrustada, pero si desea dar una URL no incrustada, necesita codificar en "Pipe seguro" como (para la URL incrustada o no incrustada):
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);
}
}
}
}
se dividirá "vedioid". Tienes que obtener el ID de video y luego configurarlo en URL como incrustado. En html
<div>
<iframe width="100%" height="300" [src]="video.url | safe"></iframe>
</div>
Angular 2/5 gracias de nuevo.
Hay una solución que funcionó para mí, refiriéndose a los padres. Después de obtener la URL que redireccionará a la página de autenticación de Google, puede probar el siguiente código:
var loc = redirect_location;
window.parent.location.replace(loc);
Hice los siguientes cambios y funciona bien para mí.
Solo agregue el atributo <iframe src="URL" target="_parent" />
_parent : esto abriría la página incrustada en la misma ventana.
_blank : en otra pestaña
Para incrustar el video de YouTube en su página angularjs, simplemente puede usar el siguiente filtro para su video
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>
Para mí, la solución fue ir a console.developer.google.com y agregar el dominio de la aplicación a la sección "Orígenes de Javascript" de las credenciales de OAuth 2.
Poco tarde, pero este error también puede ser causado si utiliza una native application Client ID lugar de una web application Client ID .
Si está utilizando iframe para vimeo, cambie la url de:
a:
Esto funciona para mi.
Tratar de usar
Puede encontrar todo el código incrustado en la sección ''Código incrustado'' y se ve así
<iframe width="560" height="315" src="https://www.youtube.com/embed/YOUR_VIDEO_CODE" frameborder="0" allowfullscreen></iframe>