Login em uma URL com redirecionamento para outra após a autenticação
A necessidade é bem simples, autenticar num site web e então após isso redirecionar para outra URL.
O fato esperado é que após ocorrer o submit para a URL da action o contexto da página corrente não existe mais, claro, então rotinas colocadas por exemplo no evento "onsubmit" do form não funcionarão. Pelo mesmo motivo quaisquer rotinas a serem executadas por um setTimeout() na página também não serão executados, que foi um caso que tentei, um timer local considerando que se passaram X segundos e que nesse período a autenticação ocorreu.
Além desse problema de contexto alterado houve ainda problemas sobre CORS quando tentei utilizar um código mais limpo com XMLHttpRequest fazendo o POST para a URL da action, então a solução mais simplista e funcional foi:
- Copiar o HTML original da página de autenticação.
- Pré-preencher os valores de usuário e senha.
- Simular o clique no botão, na verdade não o método click, mas o método submit.
- Meta tag para fazer o redirecionamento para a página destino desejada.
Mas o segredo mesmo para se manter no contexto foi o "target" do form ser um iframe, nesse caso usar a Metatag foi só para evitar mais um script, eu poderia usar um setTimeout(), mesmo o onsubmit funcionaria.
Abaixo a solução para o mundo ideal (usuário e senha corretos por exemplo).
Veja que a solução é HTML+Javascript puro, nada de JQuery ou outra framework.
<meta http-equiv="refresh" content="5; url=http://URL_APOS_AUTENTICAR"> <form action="http://URL_DE_AUTENTICA" method="post" name="acesso" id="acesso" target="logado" hidden="hidden"> <input name="nome" type=text size=30 maxlength=30 value='usuário'> <input name="senha" type=password size=30 maxlength=30 value='senha'> <input type="submit" name="Entrar" id="Entrar" value="Entrar"> </form> <iframe name="logado" id="logado" hidden="hidden"></iframe> <h2>Executando processo de autenticação, aguarde...</h2> <script> // autentica para o iframe escondido. document.getElementById('acesso').submit(); </script>
Referências:
- http://pt.wikipedia.org/wiki/Cross-origin_resource_sharing
- http://www.w3schools.com/xml/xml_http.asp
Comentários
Postar um comentário