curso extjs 4 - aula 23: data package: jsonp proxy
DESCRIPTION
TRANSCRIPT
CursoExt JS 4
Data Package: JsonP Proxy
Agenda
• Introdução à JsonP
• JsonP Proxy com Reader
•Problemas com Writer
•Exemplo prático
Requisitos
Ext JS 4 SDK
Servidor (Apache)
Editor de Texto
Browser (Firefox c/ Firebug ou Chrome)
PHP + MySQL (ou outra linguagem)
Domínio Diferente
O que é JsonP?
Cross-Domain Ajax
http://json-p.org/
Cross-Domain Ajax
http://json-p.org/
Same-origin policy - browsers
<script src="http://domainB.com/users?callback=someCallback"></script>
Envia
Recebe
someCallback({ contatos: [ { id: 1, nome: "Loiane Groner", email: "[email protected]" } ]});
Recebe
someCallback({ contatos: [ { id: 1, nome: "Loiane Groner", email: "[email protected]" } ]});
Recebe
someCallback({ contatos: [ { id: 1, nome: "Loiane Groner", email: "[email protected]" } ]});
Função Javascript com retorno JSON
Faz sentido?
<script type="text/javascript">someCallback({ <contatos> <id>1</id> <nome>Loiane</nome> <email>[email protected]</email> <contatos>});</script>
Faz sentido?
<script type="text/javascript">someCallback({ <contatos> <id>1</id> <nome>Loiane</nome> <email>[email protected]</email> <contatos>});</script>
Vai compilar?
Faz sentido?
<script type="text/javascript">someCallback({ <contatos> <id>1</id> <nome>Loiane</nome> <email>[email protected]</email> <contatos>});</script>
Vai compilar? NÃO!
Vamos voltar...Mais um problema
<script src="http://domainB.com/users?callback=someCallback"></script>
Envia
<script src="http://domainB.com/users?callback=someCallback"></script>
Envia
<script src="http://domainB.com/users?callback=someCallback"></script>
Envia
REQUEST_METODO == GET
e POST,PUT,
DELETE?
Sorry,Não foi criado para isso!
Objetivo é buscar dados em outro domínio
Show me the code!
https://github.com/loiane/curso-extjs4
Código Fonte da Aula
http://www.loiane.com/2011/11/curso-de-extjs-4-gratuito/
Link do Curso com todas as aulas publicadas
http://amzn.com/1849516669
http://www.packtpub.com/ext-js-4-first-look/book
contato = {email: ‘[email protected]’,blog: ‘loiane.com’,facebook: ‘facebook.com/loianegroner’,twitter: ‘@loiane’,github: ‘loiane’,vimeo: ‘loiane’,youtube: ‘loianeg’}
Obrigada!