26 lines
1.4 KiB
Markdown
26 lines
1.4 KiB
Markdown
---
|
|
title: Learn About Jsonp
|
|
---
|
|
## JSONP
|
|
JSONP stands for "JSON with padding". Let's say you want to make AJAX requests to a different domain. Well, you can't do this with XMLHttpRequest, as you normally would, but you CAN do this with script tags, as seen [on StackOverflow](https://stackoverflow.com/questions/2067472/what-is-jsonp-all-about):
|
|
|
|
```javascript
|
|
script = document.createElement('script');
|
|
script.type = 'text/javascript';
|
|
script.src = 'http://www.someWebApiServer.com/some-data';
|
|
```
|
|
|
|
But this is ugly, now we have to get elements of a JSON out of a script tag, gross. Luckily, the creators of JSONP were thinking ahead, so instead of setting our scripts as we did above, we do this:
|
|
|
|
```javascript
|
|
script.src = 'http://www.someWebApiServer.com/some-data?callback=my_callback';
|
|
```
|
|
This triggers an automatic callback after the data has loaded, creating a function with the data desired inside of it.
|
|
|
|
|
|
### More Information:
|
|
* <a href='https://en.wikipedia.org/wiki/JSONP' target='_blank' rel='nofollow'>Wikipidea/JSONP</a>
|
|
* <a href='https://learn.jquery.com/ajax/working-with-jsonp' target='_blank' rel='nofollow'>JSONP and JQuery</a>
|
|
* <a href='http://api.jquery.com/jquery.getjson/#jsonp' target='_blank' rel='nofollow'>More JSONP with JQuery</a>
|
|
* <a href='http://stackoverflow.com/questions/5943630/basic-example-of-using-ajax-with-jsonp' target='_blank' rel='nofollow'>Ajax and JSONP</a>
|