Neste artigo você vai aprender o que é JSONP e como esta estrutura de dados funciona, como também quando ela é utilizada
Fala programador(a), beleza? Bora aprender mais sobre JavaScript e JSONP!
O JSONP (JSON with padding – JSON com padding) é uma estrutura que tem como objetivo acabar com a limitação de AJAX nos navegadores
O problema é conhecido como CORS (Cross-Origin Resource Sharing), e ocorre quando um determinado domínio tenta fazer uma requisição Ajax para outro
A ideia é utilizar a tag script para receber os dados de uma determinada URL na execução de uma função, é aí que é gerado o padding
Como funciona?
Vamos imaginar que precisamos de dados de um usuário, então vamos fazer uma requisição para uma url chamada: https://algumsite.com/getuser?id=10
Então estamos solicitando os dados do usuário com id de 10
Os dados vem em JSON, e são estes:
{"nome": "Matheus", "idade": 30}Porém desta maneira vamos enfrentar o problema de CORS, então vamos lidar com esta situação com JSONP
A ideia é passar um outro argumento para a URL que vai ativar uma função e liberar o uso do JSONP
Então a nossa abordagem será:
<script type="text/javascript"
src="https://algumsite.com/getuser?id=10&jsonp=getData">
</script>Vejam que um último argumento foi inserido, jsonp=getData
Então a resposta que receberemos será algo como:
getData({"nome": "Matheus", "idade": 30});O que é um JavaScript válido e pode ser utilizado em nosso software
E justamente esta função getData é o padding ou espaçamento, para validar o uso do JSONP
Conclusão
Neste artigo você aprendeu o que é JSONP e também como ele é utilizado para resolver o problema de CORS
Você deve confiar 100% na fonte onde está utilizando o JSONP, se não pode estar executando códigos mal intencionados
Pois consumir dados e até mesmo código de quem você não confia não é muito interessante 🙂
Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube