front-end-interview-handbook/packages/quiz/questions/explain-how-jsonp-works-and.../pt-BR.mdx

30 lines
1.4 KiB
Plaintext

---
title: Explique como o JSONP funciona (e como ele não é Ajax)
---
O JSONP (JSON com padding) é um método comumente utilizado para contornar as políticas de domínio cruzado em navegadores web, porque solicitações Ajax da página atual para um domínio de origem cruzada não são permitidas.
O JSONP funciona fazendo uma solicitação a um domínio cross-origin através de uma tag `<script>` e geralmente com um parâmetro de consulta `callback`, por exemplo: `https://example O?callback=printData`. O servidor irá, então, encapsular os dados em uma função chamada printData e enviá-la de volta ao cliente.
```html
<!-- https://mydomain.com -->
<script>
function printData(data) {
console.log(`My name is ${data.name}!`);
}
</script>
<script src="https://example.com?callback=printData"></script>
```
```js
// Arquivo carregado de https://example.com?callback=printData
printData({ name: 'John Doe' });
```
O cliente deve ter a função `printData` no seu escopo global e a função será executada pelo cliente quando a resposta do domínio de origem cruzada for recebida.
O JSONP pode ser inseguro e tem algumas implicações de segurança. Como o JSONP é JavaScript, ele pode fazer tudo o que o JavaScript pode fazer, então você precisa confiar no provedor dos dados JSONP.
Hoje em dia, [CORS](http://en.wikipedia.org/wiki/Cross-origin_resource_sharing) é a abordagem recomendada, e a JSONP é vista como um hack.