На днях разбирался с использованием связки jQuery + JSON, ведь с многими Веб-API (vkontakte, flickr etc.), если так можно выразиться, можно легко и удобно работать запрашивая с них результаты в виде JSON.
Сам по себе JSON – это объект JavaScript, для подробного изучения материала лучше послать в вики.
Так вот подвох работы jQuery.getJSON() : для того, чтобы забрать JSON с удаленного сайта необходимо использовать его расширение JSONP. Пока не столкнулся с этим сам, даже не подозревал что такое может быть.
Вкратце описание вышесказанного кодом:
есть сайт http://example.ru , на нем файл http://example.ru/user.php который возвращает :
{'name':'Ivan','status':'Administrator'}
примерный код самого скрипта:
<?php $user = array('name'=>'Ivan','status'=>'Administrator'); print json_encode($user); ?>
браузер даст его получить, если сам скрипт будет лежать на http://example.ru/ , но если мы сделаем
$.getJSON('http://example.ru/user.php', function(data) { // работа с объектом data });
с сайта http://test.ru , браузер выкинет нам Permission-denied, чтобы этого не произошло доработаем скрипт, чтобы он выдавал нам не только JSON, но и JSONP когда нужно:
<?php $user = array('name'=>'Ivan','status'=>'Administrator'); if (isset($_GET['callback']) { // // .... здесь различные проверки $_GET['callback'] // print $_GET['callback'].'('.json_encode($user).')'; // JSONP } else { print json_encode($user); // JSON } ?>
теперь при запросе GET http://example/user.php?callback=user получим:
user({'name':'Ivan','status':'Administrator'})
А в JavaScript к URL добавим:
$.getJSON('http://example.ru/user.php?callback=?', function(data) { // работа с объектом data });
Tags: javascript, jQuery, json
Спасибо! Очень помогло!
Всегда пожалуйста, если будут возникать какие-либо вопросы в дальнейшем, пишите мне, постараюсь ответить.
Ни чего не понял.
Обработка получается через вызов callback функции на клиентской стороне?
То есть функция user должна существовать?
Да функция user должна существовать и выполняется на клиентской стороне , в данном случае, jQuery создают свою функцию и её имя подставляет вместо знака «?» (… callback=? …)
callback функция условно выглядит :
а при долучении данных с сервера, они «компилируются » функцией eval
С чего бы ей компилироваться функцией eval? Клиент получает сами данные, а не строку, которую надо преобразовывать.
1) клиент запрашивает данные. Функция getJSON вставляет в такой элемент
2) сервер обрабатывает запрос и взовращает в ответе:
user( {‘name’:'Ivan’,'status’:'Administrator’} );
3) Браузер получает ответ, и обрабатывает его как скрипт – вызывается функция user с некими данными. Никаких eval’ов не вызывается. Сервер может вернуть что угодно и это будет выполнено сразу, без всяких проверок.
тег съелся в пункте 1
{script src=»http://example.ru/user.php?callback=user»}{/script}
Огромная благодарность! Как раз то что я искал.
Спасибо, Ваня, огромное! Просношался, извините за выражение, с JSONP неделю, уже в упор не мог понять почему не работает. В конце на сервере стал формировать функцию, которая есть на клиенте, и ей передавать объект с данными, но что-то мне подсказывало что это не совсем корректно))
А насчет eval() не соглашусь с тобой – во всех нормальных скриптах используется JSON.parse() или его эмуляция(в jQuery – $.parseJSON()). И не надо проверять на «вредоносный код».