Формат мудрый, тип файла мудрый и практическое использование мудрым?
В чем разница между JSON и JSONP?
Ответ 1
JSONP - это JSON с заполнением, т.е. вы помещаете строку в начале и пару круглых скобок вокруг нее. Например:
//JSON
{"name":"stackoverflow","id":5}
//JSONP
func({"name":"stackoverflow","id":5});
В результате вы можете загрузить JSON в качестве файла script. Если вы ранее настроили функцию с именем func, тогда эта функция будет вызываться с одним аргументом, который является данными JSON, когда файл script загружается. Это обычно используется для обеспечения возможности межсайтового AJAX с данными JSON. Если вы знаете, что example.com служит JSON файлам, которые выглядят как пример JSONP, приведенный выше, то вы можете использовать такой код, чтобы получить его, даже если вы не находитесь в домене example.com:
function func(json){
alert(json.name);
}
var elm = document.createElement("script");
elm.setAttribute("type", "text/javascript");
elm.src = "http://example.com/jsonp";
document.body.appendChild(elm);
Ответ 2
По сути, вы не можете запрашивать данные JSON из другого домена через AJAX из-за политики того же происхождения. AJAX позволяет вам извлекать данные после того, как страница уже загружена, а затем выполнять некоторый код/вызывать функцию, когда она возвращается. Мы не можем использовать AJAX, но нам разрешено вставлять теги <script> на нашу собственную страницу, и они могут ссылаться на скрипты, размещенные в других доменах.
Обычно вы используете это для включения библиотек из CDN, таких как jQuery. Однако мы можем злоупотреблять этим и использовать его для извлечения данных! JSON уже является допустимым JavaScript (по большей части), но мы не можем просто вернуть JSON в нашем файле скрипта, потому что у нас нет способа узнать, когда скрипт/данные закончили загрузку, и у нас нет способ доступа к нему, если он не назначен переменной или не передан функции. Поэтому вместо этого мы говорим веб-службе, чтобы она вызывала функцию от нашего имени, когда она будет готова.
Например, мы могли бы запросить некоторые данные у API фондовой биржи, и вместе с нашими обычными параметрами API мы передали ему обратный вызов, например, ?callback=callThisWhenReady. Затем веб-служба упаковывает данные с помощью нашей функции и возвращает ее следующим образом: callThisWhenReady({...data...}). Теперь, как только скрипт загрузится, ваш браузер попытается выполнить его (как обычно), который, в свою очередь, вызывает нашу произвольную функцию и передает нам данные, которые мы хотели.
Он работает так же, как обычный запрос AJAX, за исключением того, что вместо вызова анонимной функции мы должны использовать именованные функции.
JQuery фактически поддерживает это без проблем для вас, создавая функцию с уникальным именем для вас и передавая ее, которая затем, в свою очередь, запускает нужный вам код.
Ответ 3
JSONP позволяет указать функцию обратного вызова, передаваемую вашим объектом JSON. Это позволяет обойти одну и ту же политику происхождения и загрузить JSON с внешнего сервера в JavaScript на вашей веб-странице.
Ответ 4
JSONP означает "JSON with Padding", и это обходное решение для загрузки данных из разных доменов. Он загружает script в головку DOM и, таким образом, вы можете получить доступ к информации, как если бы она была загружена в ваш собственный домен, тем самым минуя проблему с перекрестным доменом.
jsonCallback(
{
"sites":
[
{
"siteName": "JQUERY4U",
"domainName": "http://www.jquery4u.com",
"description": "#1 jQuery Blog for your Daily News, Plugins, Tuts/Tips & Code Snippets."
},
{
"siteName": "BLOGOOLA",
"domainName": "http://www.blogoola.com",
"description": "Expose your blog to millions and increase your audience."
},
{
"siteName": "PHPSCRIPTS4U",
"domainName": "http://www.phpscripts4u.com",
"description": "The Blog of Enthusiastic PHP скриптers"
}
]
});
(function($) {
var url = 'http://www.jquery4u.com/scripts/jquery4u-sites.json?callback=?';
$.ajax({
type: 'GET',
url: url,
async: false,
jsonpCallback: 'jsonCallback',
contentType: "application/json",
dataType: 'jsonp',
success: function(json) {
console.dir(json.sites);
},
error: function(e) {
console.log(e.message);
}
});
})(jQuery);
Теперь мы можем запросить JSON через AJAX с помощью JSONP и функцию обратного вызова, которую мы создали вокруг содержимого JSON. Выходом должен быть JSON как объект, который мы можем использовать данные для чего угодно, без ограничений.
Ответ 5
JSONP по существу, JSON с дополнительным кодом, как вызов функции, обернутый вокруг данных. Он позволяет использовать данные во время разбора.
Ответ 6
JSON
JSON (нотация объектов JavaScript) - это удобный способ переноса данных между приложениями, особенно когда местом назначения является приложение JavaScript.
Пример:
Вот минимальный пример, который использует JSON в качестве транспорта для ответа сервера. Клиент делает запрос Ajax с сокращенной функцией jQuery $.getJSON. Сервер генерирует хэш, форматирует его как JSON и возвращает его клиенту. Клиент форматирует это и помещает в элемент страницы.
Сервер:
get '/json' do
content_type :json
content = { :response => 'Sent via JSON',
:timestamp => Time.now,
:random => rand(10000) }
content.to_json
end
Клиент:
var url = host_prefix + '/json';
$.getJSON(url, function(json){
$("#json-response").html(JSON.stringify(json, null, 2));
});
Выход:
{
"response": "Sent via JSON",
"timestamp": "2014-06-18 09:49:01 +0000",
"random": 6074
}
JSONP (JSON с отступом)
JSONP - это простой способ преодолеть ограничения браузера при отправке ответов JSON из разных доменов с клиента.
Единственное изменение на стороне клиента с JSONP - добавить параметр обратного вызова в URL.
Сервер:
get '/jsonp' do
callback = params['callback']
content_type :js
content = { :response => 'Sent via JSONP',
:timestamp => Time.now,
:random => rand(10000) }
"#{callback}(#{content.to_json})"
end
Клиент:
var url = host_prefix + '/jsonp?callback=?';
$.getJSON(url, function(jsonp){
$("#jsonp-response").html(JSON.stringify(jsonp, null, 2));
});
Выход:
{
"response": "Sent via JSONP",
"timestamp": "2014-06-18 09:50:15 +0000",
"random": 364
}
Ссылка: http://www.codingslover.blogspot.in/2014/11/what-are-differences-between-json-and-jsonp.html
Ответ 7
"JSONP - это JSON с дополнительным кодом" будет слишком легко для реального мира. Нет, у вас должно быть небольшое расхождение. Какая забава в программировании, если все работает?
Выключается JSON не является подмножеством JavaScript. Если все, что вы делаете, это взять объект JSON и обернуть его в вызов функции, однажды вы будете укушены странными синтаксическими ошибками, такими как я был сегодня.
Ответ 8
JSONP - это простой способ преодолеть ограничения браузера при отправке ответов JSON из разных доменов с клиента.
Но практическая реализация подхода включает в себя тонкие различия, которые часто не объясняются четко.
Вот простое руководство, которое показывает JSON и JSONP рядом.
Весь код находится в свободном доступе на Github, а живую версию можно найти на http://json-jsonp-tutorial.craic.com