17 февраля 2011 в 09:53

Все что нужно для JSONP

Если вам хочется работать с JSONP, но нет желания подключать для этого большие фреймворки, то JSONP.js ваш выбор.
Либа весит 216 байт и имеет всего одну функцию, которой мы передаем url и callback.

Соответственно автор дает вот такой пример и код для него:
<script src="JSONP.js"></script>
<script>
this.onload = function () {
 var many = 0;
 JSONP("test.php?callback", function (a, b, c) {
  this.document.body.innerHTML += [
   a, b, ++many, c
  ].join(" ") + "<br />";
 });
 JSONP("test.php?callback", function (a, b, c) {
  this.document.body.innerHTML += [
   a, b, ++many, c
  ].join(" ") + "<br />";
 });
};
</script>

Быстро и вкусно.
Андрей Ребров @mythmaker
карма
153,0
рейтинг 0,0
Похожие публикации

Комментарии (31)

  • –6
    Скромно и со вкусом.
  • –12
    JSONP как два пальца пи-пи.
    • +1
      Что?
      • 0
        Именительный или Винительный падеж.
  • +4
    Какую цель преследовал ваш топик?
  • –1
    Кстати, я правильно понимаю, что этот скрипт поддерживает только синхронный ajax? Не айс.
    • +1
      в данном случае это не тот ajax, здесь загрузка данных осуществляется через подключение к страницы скрипта который и передает данные в функцию JSONP(«test.php?callback», function (a, b, c)

      таким образом он асинхронный, т.е. поток не ждет данных, а при их поступлении просто выполняется функция callback
      • 0
        Я знаю, что такое асинхронный, jsonp и всё остальное.
        Когда я реализовывал jsonp через тег script, то он блокировал выполнение js до получения ответа.
        Судя по коду — реализовано именно так.
        • 0
          А JSONP можно как-то по-другому организовать? Всякие там аттрибуты script вроде defer и async не считаем.
          • 0
            Не знаю, как делается в «взрослых» фреймворках, но как на счет xhr+eval?
            • 0
              Вся фишка JSONP в кроссдоменности. Вставить src в script можно с любого домена, а xhr только по текущему.

              Так что вставлять script и ждать когда оно отдуплится — единственный вариант. Другое дело, что свежие бровзеры умеют делать это асинхронно. Динозавры вроде IE6 — нет.
              • 0
                Чёрт. Пора спать, вы правы.
                Но, когда я реализовал свой jsonp через script — оно блокировало браузер. Стоило начать использовать встроенный в JQuery вариант — залетало.
        • 0
          Создание тега скрипт не блокирует работу скрипта, я как раз щас работаю таким способом, у меня логи пишутся на сторонний сервер через создание скрипта, работа не блокируется, тег скрипт грузится асинхронно, ничего не блокируется, код дальше работает
  • 0
    А если ошибка и контент не погрузился?
  • 0
    Непонятно зачем в глобальном неймспейсе срать калом в стиле __JSONP__12432354 для коллбеков. Да, оно потом пытается за собой подчистить, но в стареньких ие это работает не совсем хорошо.

    Почему нельзя было в свой неймспейс напихать? Типа там JSONP.Callback12432354, например?
  • 0
    У всех сплош jquery подключен (уже почти по умолчанию), он это умеет делать.
    Вопрос: для каких целей мне пригодилась бы эта либа? (Это не наезд, просто хочу понять.)
    Автор ты в каких случаях ею пользуешься?
    • 0
      Не понимаю я стремления в каждый мало-мальский сайт «впихнуть» здоровенный фреймворк. Да, иногда это бывает необходимо, особенно на больших проектах, но в большинстве случаев можно обойтись без «монстра» типа jQuery.

      Например: у меня в профиле ссылка на последний мой проект (сайт очень дорогого ресторана). Делал почти с нуля — первую рабочую версию сделал за 3 дня. В результате весь JS-код сайта весит ~9 Kib (ungzip ~27 Kib), включая мою реализацию querySelecor для IE (переписанный YASS). Сравните 29 Kib (jQuery, gzip) и 9 Kib!
      Правда, т.к. сайт я делал за бесплатно, забросил его так и не доделав anchor navigation :(
      • +1
        Не понимаю причем тут разница в 20кб? (и то только при первой загрузке страницы, потом браузер кеширует)? Или этот сайт должен был быть высоконагруженным (что не так) или посетители сайта сидят с диалапа (что тоже не так — «сайт очень дорогого ресторана» значит посетители не нищии студенты).
        Мое мнение, что этот «велосипед» только для увеличения энтропии :)
        • 0
          Не холивара ради:
          Обычно разница более существеннее, чем 20 KiB, т.к. на сайты добавляется ещё куча плугинов и собственно скрипт самого сайта.
          Загрузка ~5 <script> (среднее кол-во на сайтах с использованием jQuery) происходит с заметной паузой, + цена HTTP-запроса немаловажна.

          А по поводу диалапа, Вы не совсем правы — какая сейчас скорость мобильного интернета? Примерно, как когда-то у диалапа. А сайт без нагромождения jQuery'вских плугинов, легко и непринуждённо работает на мобильных устройствах (на моём не доделано, оптимизировано только для iPad). И не нужна никакая «облегченная», «мобильная» версия сайта.

          Да и делал свой «велосипед» я с большим удовольствием :)
          • 0
            Для вашего сайта-ресторана подошло бы это
            benalman.com/code/projects/jquery-bbq/examples/fragment-basic/
            и сделали бы вы его явно быстрее, и анкорная навигация бы работала.
            • 0
              В данном конкретном примере есть существенный недостаток: не работает индексация частей страницы, которые «скрыты» за переключателями. А одним из пунктов моего ТЗ было: «Хорошая индексация сайта поисковыми системами Яндекс, Гугл и т.д.».

              Хотя, может и можно сделать, чтобы всё работало как надо и индексировалось. Но, для меня было проще и быстрее написать всё с нуля, чем разбираться в «хитростях» jQuery плугинов, индексации сайтов основанных на jQuery и разработки мобильной версии сайта с использованием jQuery.
    • 0
      А должен быть у всех head.js подключен :-) Он тоже умеет это делать.
    • 0
      «У всех сплош jquery подключен (уже почти по умолчанию), он это умеет делать.» — это упалочный образ мыслей сравнимый с «у всех стоит виндоус и интернет эксплорер, зачем париться и изобретать что-то другое?».
      • +1
        До jquery были библиотеки, но становится популярной она. Так как было понятно для чего она нужна и какие проблемы решает лучше других.
        Эта же библиотека никаких проблем не решает. Хороша для обучения, для собственного фана, пиара :)
        Поэтому я и решил что для работы она не подходит, автор тоже не смог привести убедительный пример.
        • +1
          Скажем так, кроме jquery есть и другие хорошие библиотеки.

          Плюс, если задача — сделать один тычок в jsonp и успокоиться, применять жквери нецелесообразно. Проще на коленке в 5 строк написать свой jsonp.js и заюзать его.
          • 0
            Совершенно верно! и каждый допиливает свое, кому jsonp, кому еще что-то, в зависимости от конкретной задачи и обстоятельств.
  • +1
    .call(window, "Hello", "JSONP", "!!!")
    Это должен возвращать сервер, я б руки поотрывал за такое =)
  • 0
    В ней не обрабатываются ошибки и не обрабатывается таймаут…
    Толк от такой либы?… сомнительный…
  • 0
    Thanks for information. I'm not sure that this will be enough for web application implementation. So I propose still use some frameworks like jQuery, etc.

    Also if you are looking for some other implementation and usage of JSONP technology, go to geekproit.blogspot.com/2011/08/small-research-about-jsonp.html

    Still JSONP has some disadvantages, like leak of error handling and request status, etc.

Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.