Как включить данные JSON в javascript синхронно без разбора?


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

мне удалось использовать jQuery.getJSON, но это asynch ajax, и это кажется немного излишним.

есть ли способ загрузить JSON синхронизированным способом без выполнения собственного синтаксического анализа?
(более или менее похоже на использование <script language="JavaScript" src="MyArray.json"></script>)

заранее спасибо за любую помощь, надеюсь, это имеет смысл, так как я новичок javascript. Паоло!--4-->

29
getjson javascript json parsing synchronous

7 ответов

getJSON() - это просто сокращение для

35

здесь вы идете:

// Load JSON text from server hosted file and return JSON parsed object
function loadJSON(filePath) {
  // Load json file;
  var json = loadTextFileAjaxSync(filePath, "application/json");
  // Parse json
  return JSON.parse(json);
}   

// Load text with Ajax synchronously: takes path to file and optional MIME type
function loadTextFileAjaxSync(filePath, mimeType)
{
  var xmlhttp=new XMLHttpRequest();
  xmlhttp.open("GET",filePath,false);
  if (mimeType != null) {
    if (xmlhttp.overrideMimeType) {
      xmlhttp.overrideMimeType(mimeType);
    }
  }
  xmlhttp.send();
  if (xmlhttp.status==200)
  {
    return xmlhttp.responseText;
  }
  else {
    // TODO Throw exception
    return null;
  }
}

Примечание: этот код работает только в современных браузерах-IE8, FF, Chrome, Opera, Safari. Для обосолете IE версии вы должны использовать ActiveX, дайте мне знать, если вы хотите, что я скажу вам, как;)

13

Если вы используете какой-то серверный скрипт, вы можете распечатать данные в теге скрипта на странице:

<script type="text/javascript">
var settings = <?php echo $json; ?>;
</script>

Это позволит вам использовать ваши данные синхронно, а не пытаться использовать AJAX асинхронно.

в противном случае вам придется ждать обратного вызова AJAX, прежде чем продолжить то, что вы делаете.

3

мне нужно было только прочитать небольшой входной файл в формате json и извлечь небольшой объем данных. Это сработало просто отлично в обстоятельствах:

файл json находится в том же каталоге, что и скрипт, и называется data.json, это выглядит примерно так:

{"outlets":[
        {
            "name":"John Smith",
            "address":"some street, some town",
            "type":"restaurant"
        },
..etc...

прочитайте данные в js следующим образом:

var data = <?php echo require_once('data.json'); ?>;

доступ к элементам данных, как это:

for (var i in data.outlets) {    
var name = data.outlets[i].name;
... do some other stuff...
}
1

Если RequireJS является опцией, вы можете сделать ее зависимостью с помощью requirejs. Я использую его для макета данных в своем приложении Angular. Важно, что некоторые из издевались данных есть перед загрузкой приложения.

//Inside file my/shirt.js:
define({
    color: "black",
    size: "unisize"
});

просто оберните данные json в define и объявите его как зависимость. Подробнее здесь: http://requirejs.org/docs/api.html#defsimple

0

AFAIK jQuery устарел синхронные запросы XHR из-за потенциальных проблем с производительностью. Вы можете попробовать обернуть код приложения в обработчик ответов XHR, как показано ниже:

$(document).ready(function() {
  $.get('/path/to/json/resource', function(response) {
    //'response' now contains your data
    //your app code goes here
    //...
  });
});
-1

современный способ HTML5 без jQuery будет:

   var url="https://api.myjson.com/bins/1hk8lu" || "my.json"
   var ok=await fetch(url)
   var json=await ok.json()
   alert(a.test)
-1