Порой бывает нужно получить данные на лету с какого-то другого домена. На лету, это в рантайм, во время работы фронтенда. Часто удобно это делать на javascript загрузить json.

Сегодня мы рассмотрим, как на javascript загрузить json с внешнего домена, и получить данные в код.

Как вы понимаете, загрузить что-то на javascript не так сложно. Это можно сделать следующим образом (если не использовать jQuery или другие фреймворки):

// создадим элемент script
var script = document.createElement('script');
// укажем для него ссылку на нужные данные
script.src = 'http://url.to.json?callback=insertReply';
// вставим в документ этот элемент и начнем загрузку
document.body.appendChild(script);

Обратите внимание, этот код просто добавит ссылку на json файл в документ и загрузит его. Но нам нужно получить данные. Для этого и используется параметр callback, в который передётся название функции javascript, которая будет обрабатывать данные после загрузки. Важно, чтобы источник данные «не испугался» от дополнительного параметрам, то есть, чтобы он мог принимать свободно дополнительные параметры в GET запрос.

Итак, данные загружены, теперь попробуем их обработать:

function insertReply(content) {
    alert(content);
}

В качестве аргумента функция принимает данные, загруженные по ссылке, с ними можно распоряжаться как угодно. В нашем случае после того как мы на javascript загрузить json с внешнего домена, функция выводит его в сообщение при помощи alert. Вы же можете сделать с этим json что угодно.


Интернет-магазины, особенно интернет-магазины техники — одни из наиболее часто использующих загрузку внешних данных сайтов. Там это используется для организации доставки, загрузки списка доступных городов и т.п. Именно таким методом реализована загрузка списка доступных акций и специальных предложений в интернет-магазине аудио-техники Bits By Dr Dre, в частности: beats by dr dre pill