O que é JSONP?
Fala pessoal, nos meus estudos aqui vi esse tal de JSONP e que o mesmo pode substituir o AJAX.
Alguém pode me explicar o que é isso e se de fato ele substitui o nosso tão útil AJAX? Seria uma alternativa melhor?
Alguém pode me explicar o que é isso e se de fato ele substitui o nosso tão útil AJAX? Seria uma alternativa melhor?
Calebe Menezes
Curtidas 0
Melhor post
Luis Mesa
06/04/2017
Opa Calebe, tudo bem?
Por causa do chamado "same-origin policy", nao é possível recuperar dados JSON de outro domínio através do AJAX. Porém, é possível inserir tags script em nossa página e referenciar scripts externos ao nosso domínio. Normalmente utilizamos isso para acessar um CDN; por exemplo, jQuery.
Logo, se pensou em utilizar esse método para recuperar dados JSON de outros domínios, já que com AJAX nao seria possível. Assim, surgiu o JSONP, que basicamente é um JSON, mas com os dados "inseridos" como parâmetro de uma funçao. Assim, podemos recuperar dados de outro domínio através do JSONP. Um exemplo:
// Isto é JSON
{"nome":"Calebe","id":1}
// Isto é JSONP
func({"nome":"Calebe","id":1});
Definimos o conteúdo de uma página, em um domínio externo ao nosso, na forma de JSONP. Podemos entao, criar uma funçao igual a essa e conseguir acessar os dados, em nossa aplicaçao:
Logo, quando criarmos o elemento, o src vai ser definido como o conteúdo da página referenciada, em formato JSONP: Como temos una funçao de mesmo nome no nosso escopo, que chama o alert da propriedade nome do objeto passado, aparecerá um alert com o texto "Calebe" na nossa tela.
O JSONP é uma alternativa para passar por cima da limitaçao do same-domain policy, porém é mais um "hack". Existe uma alternativa mais moderna chamada CORS. Com JSONP você pode somente utilizar requisiçoes GET. Com CORS, você pode utilizar quaisquer outros métodos. Vá de JSONP se você quer suporte a navegadores mais antigos (Internet Explorer<=9, por exemplo) e somente para leitura (GET).
Um abraço.
Por causa do chamado "same-origin policy", nao é possível recuperar dados JSON de outro domínio através do AJAX. Porém, é possível inserir tags script em nossa página e referenciar scripts externos ao nosso domínio. Normalmente utilizamos isso para acessar um CDN; por exemplo, jQuery.
Logo, se pensou em utilizar esse método para recuperar dados JSON de outros domínios, já que com AJAX nao seria possível. Assim, surgiu o JSONP, que basicamente é um JSON, mas com os dados "inseridos" como parâmetro de uma funçao. Assim, podemos recuperar dados de outro domínio através do JSONP. Um exemplo:
// Isto é JSON
{"nome":"Calebe","id":1}
// Isto é JSONP
func({"nome":"Calebe","id":1});
Definimos o conteúdo de uma página, em um domínio externo ao nosso, na forma de JSONP. Podemos entao, criar uma funçao igual a essa e conseguir acessar os dados, em nossa aplicaçao:
function func(json){
alert(json.nome);
}
var elemento = document.createElement("script");
elemento.setAttribute("type", "text/javascript");
elemento.src = "http://exemplo.com/jsonp";
document.body.appendChild(elemento);
Logo, quando criarmos o elemento, o src vai ser definido como o conteúdo da página referenciada, em formato JSONP: Como temos una funçao de mesmo nome no nosso escopo, que chama o alert da propriedade nome do objeto passado, aparecerá um alert com o texto "Calebe" na nossa tela.
O JSONP é uma alternativa para passar por cima da limitaçao do same-domain policy, porém é mais um "hack". Existe uma alternativa mais moderna chamada CORS. Com JSONP você pode somente utilizar requisiçoes GET. Com CORS, você pode utilizar quaisquer outros métodos. Vá de JSONP se você quer suporte a navegadores mais antigos (Internet Explorer<=9, por exemplo) e somente para leitura (GET).
Um abraço.
GOSTEI 2
Mais Respostas
Luis Mesa
06/04/2017
Respondendo a sua pergunta, nao acredito que seja um substituto, já que com JSONP, como dito, se assemelha a um "hack", e com o surgimento do CORS se permite requisiçoes a outros domínios utilizando AJAX, realizando a configuraçao necessário no servidor.
GOSTEI 2
Calebe Menezes
06/04/2017
Camarada...
Sensacional essa parada!
Vou começar a ver sobre isso para aplicar nos meus projetos.
Me parece ser muito promissor mais para frente!
Sensacional essa parada!
Vou começar a ver sobre isso para aplicar nos meus projetos.
Me parece ser muito promissor mais para frente!
GOSTEI 0