Как вы используете данные JSON, извлеченные из внешнего php-файла в вашем javascript/html?

Я смог получить данные JSON и поместить их в свой HTML-файл в виде скрипта в моей голове. Как мне получить доступ к этим данным? (поместите его в пригодные для использования переменные)

внешний файл json.php (заполняется данными mySQL):

names: 
[
    {"firstName":"Kevin","lastName":"Guo"},
    {"firstName":"Jun Sung","lastName":"Wong"},
    {"firstName":"Anton","lastName":"Ansalmar"},
    {"firstName":"Linda","lastName":"Wong"},
    {"firstName":"George","lastName":"Costanza"}
]

мой код JavaScript, который извлекает внешние данные JSON:

var elm = document.createElement("script");
elm.setAttribute("type", "text/javascript");
elm.src = "http://totallyExternalURL.php";
elm.id="jsonTest";
console.log(elm);
document.getElementsByTagName('head')[0].appendChild(elm);

Все данные JSON помещены в моей голове как скрипт, как я могу вывести все имена / фамилии для отображения?

Источник

2 ответа

Решение

То, что вы делаете, на самом деле известно как jsonp, Обычно вы должны сделать так, чтобы скрипт возвращал скрипт, вызывающий функцию на вашей странице с данными. Возможно, вам будет проще работать с jQuery, используя jsonp или, если вы вызываете скрипт на вашем собственном сервере, обычный `json'.

function callback(data) {
  ... do something with the returned data
}

var elm = document.createElement("script");
elm.setAttribute("type", "text/javascript");
elm.src = "http://totallyExternalURL.php?callback=callback";
elm.id="jsonTest";
console.log(elm);
document.getElementsByTagName('head')[0].appendChild(elm);

Затем верните свой внешний скрипт (обратите внимание, ваш скрипт должен определить значение параметра обратного вызова и использовать его в качестве имени вызываемой функции). Имя функции и значение параметра обратного вызова должны совпадать.

callback( { "names" : 
    [
        {"firstName":"Kevin","lastName":"Guo"},
        {"firstName":"Jun Sung","lastName":"Wong"},
        {"firstName":"Anton","lastName":"Ansalmar"},
        {"firstName":"Linda","lastName":"Wong"},
        {"firstName":"George","lastName":"Costanza"}
    ] });

Или с помощью jQuery

 $.getJSON( 'http://totallyExternalURL.php?callback=?', function(data) {
       ... do something with the data ...
 });
Источник

Сделайте js, возвращенный как функцию, которая возвращает объект javascript, который является массивом, и затем вы можете сделать вызов этой функции и присвоить возвращаемое значение переменной.

Оберните JSON в вызов функции.

Посмотрите на JSONP.

Источник
Другие вопросы по тегам