Redirecionar a janela pai de uma ação iframe

312

Qual JavaScript eu preciso usar para redirecionar uma janela pai de um iframe?

Quero que eles cliquem em um hiperlink que, usando JavaScript ou qualquer outro método, redirecione a janela pai para um novo URL.

Click Voto a favor
fonte
5
A janela principal , por si só, também pode ser uma IFrame. Como a resposta aceita aborda a janela superior , sugiro que você altere um pouco sua pergunta.
Ron Klein

Respostas:

521
window.top.location.href = "http://www.example.com"; 

Como afirmado anteriormente, redirecionará o iframe pai.

MIP
fonte
Eu não acho que a mesma política de origem se aplica aqui. Faz sentido que você consiga quebrar seu site do iframe de outra pessoa.
Brian McAuliffe 25/09
1
No Chrome, o @Parris jsfiddle gera esse erro: Tentativa de JavaScript insegura para iniciar a navegação do quadro com o URL ' jsfiddle.net/ppkzS ' do quadro com o URL ' parrisstudios.com/tests/iframe_redirect.html '. O quadro que está tentando navegar na janela de nível superior está na caixa de areia, mas o sinalizador 'permitir navegação superior' não está definido.
Bjarte Aune Olsen /
1
@BjarteAuneOlsen interessante, pode ser uma alteração recente no chrome ou no webkit. Definitivamente estava funcionando anteriormente. Já faz alguns anos :). Também a resposta costumava indicar a mesma política de origem aplicada, que anteriormente tornava a resposta incorreta, mas agora a torna correta e meu comentário está errado -_-.
Parris
4
@BjarteAuneOlsen - Eu acredito que isso ocorre porque os Iframes no JSFiddle estão deliberadamente em área restrita, por isso negaram explicitamente certos recursos (como redirecionamento etc.) - existe o perigo de você usar o JS para navegar para longe do JS Fiddle e perder seu trabalho. ..
Zhaph - Ben Duguid
11
Os erros que as pessoas estão encontrando aqui se devem a um novo atributo HTML5 para iframes chamado " sandbox" - developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe O sandboxatributo impede que o javascript execute determinadas ações em um iframe com base em em uma determinada lista de permissões de ações permitidas. A allow-top-navigationpropriedade é uma das ações que você pode ativar na lista de permissões, que permite que esse código funcione. Se o sandboxatributo for ausente, todas as ações serão permitidas. Se estiver presente e uma sequência vazia, todas as ações serão negadas.
Marcus Harrison
115

Descobri que <a href="..." target="_top">link</a>funciona também

Click Voto a favor
fonte
7
Embora a resposta selecionada esteja correta, acho que essa é uma resposta melhor para a intenção da pergunta. Além disso, ele funcionará para as pessoas que têm o JS desativado.
Michael - Onde está Clay Shirky
Concordo que esta é a melhor solução, mas o OP pediu especificamente javascript. Por outro lado, o OP especificou que deveria ser acionado por meio de uma âncora - não consigo ver um cenário em que alguém seria forçado a usar o javascript de uma marca de âncora para alcançar o resultado desejado; portanto, a pergunta é enganosa.
Nocarrier
2
Tão simples e elegante. Funciona como charme :)
Yash
54
window.top.location.href = "http://example.com";

window.top refere-se ao objeto de janela da página na parte superior da hierarquia de quadros.

Luca Matteis
fonte
9
A propriedade window.top.location.href não pode ser atualizada no Iframe, ele lança a execução negada pelo acesso. Ela só pode ser executado quando você está testando em localhost
Muhammad Ummar
4
@Ummar: Gostaria de acrescentar que isso funciona quando o pai de um iframe tem mesmo domínio, mesma porta (políticas mesma origem), ele lança acesso negado exceção quando eles são diferentes, para evitar violações de segurança
Quan Mai
5
@Ummar isso não é verdade, jsfiddle.net/ppkzS como prova. Você pode alterar window.top.location.href. Você simplesmente não consegue ler. Funciona em cromo.
Par13
Grande jsFiddle @Parris, isso encerra o assunto para me :)
Max Williams
2
Eu suspeito que alguns dos que duvidam possam ter tentado algo assim no iframe: window.top.location.href = window.top.location.href ;
Mjj1409
15

ou uma alternativa é a seguinte (usando o objeto de documento)

parent.document.location.href = "http://example.com";
Vermelho real.
fonte
5
Essa solução é específica do Firefox. Deve-se apenas usar parent.location.href = .... developer.mozilla.org/en/document.location
kay - SE is evil
15

target="_parent"funcionou muito bem para mim. fácil e sem complicações!

rDroid
fonte
Isso parece funcionar muito bem. Existem desvantagens em usar esse método em vez de Javascript?
flyingL123
não que eu saiba. Compartilhe se você descobrir alguma coisa.
RDroid # 21/15
7

O @MIP está certo, mas com as versões mais recentes do Safari, você precisará adicionar o atributo sandbox (HTML5) para fornecer acesso de redirecionamento ao iFrame. Existem alguns valores específicos que podem ser adicionados com um espaço entre eles.

Referência (você precisará rolar): https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe

Ex:

<iframe sandbox="allow-top-navigation" src="http://google.com/"></iframe>
Raymond B
fonte
Observe que o sandboxatributo permite um conjunto extra de restrições para o conteúdo no <iframe>. O valor da sandboxpropriedade remove restrições específicas. Portanto, tenha cuidado ao usar esse recurso. w3schools.com/tags/att_iframe_sandbox.asp
gitaarik
3

Isso resolverá a miséria.

<script>parent.location='http://google.com';</script>
Ali Haris
fonte
3

Se você deseja redirecionar para outro domínio sem que o usuário precise fazer alguma coisa, use um link com a propriedade:

target="_parent"

como dito anteriormente e, em seguida, use:

document.getElementById('link').click();

para redirecionar automaticamente.

Exemplo:

<!DOCTYPE HTML>

<html>

<head>

</head>

<body>

<a id="link" target="_parent" href="outsideDomain.html"></a>

<script type="text/javascript">
    document.getElementById('link').click();
</script>

</body>

</html>

Nota: O comando javascript click () deve vir depois que você declara o link.

Tom Burris
fonte
1

É possível redirecionar de um iframe, mas não obter informações do pai.

Joris Kok
fonte
0

Tente usar

window.parent.window.location.href = 'http://google.com'
Chirag Gohel
fonte
Versão simples: parent.window.location = '<URL>';
Shasi kanth
1
ou mais simplificado:parent.location = 'url'
grilly
0
window.top.location.href = 'index.html';

Isso redirecionará a janela principal para a página de índice. obrigado

dnts2012
fonte
Duplicado desta resposta de quase 5 anos antes.
Michael - Onde está Clay Shirky,
-2

Temos que usar window.top.location.href para redirecionar a janela pai de uma ação iframe.

URL de demonstração :

Faizal
fonte
1
Quem somos nós? :) Você poderia escrever as partes essenciais do URL na resposta, por favor? URLs / links podem mudar ou serem excluídos.
YesThatIsMyName
-8

Redirecione iframe na janela pai por iframe no mesmo pai:

window.parent.document.getElementById("content").src = "content.aspx?id=12";
mohamed moren3
fonte