Блог

Главная - Вопросы по программированию - Доступ к данным json из внешнего файла

Доступ к данным json из внешнего файла

#javascript #jquery

#javascript #jquery — запрос #jquery

Вопрос:

Я пытаюсь загрузить / прочитать данные из локального json-файла, используя jQuery / Javascript. Все, что я пробовал до сих пор, выдает мне ошибку политики CORS. Я не знаю, как это решить.

 <html>

<body>

  <div>
    <a href="#" id="fetch">Fetch JSON</a>
  </div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script>
    $(function() {
      $('#fetch').click(function() {
        $.getJSON('music.json', function(data) {
          albums = data['Albums']

          console.log(albums)
        })
      });
    })
  </script>

</body>

</html>

Файл Json —

 {
  "Albums": [{
      "albumName": "Desire",
      "artist": "Bob Dylan"
    },
    {
      "albumName": "Live in London",
      "artist": "Leonard Cohen"
    },
    {
      "albumName": "Abbey Road",
      "artist": "The Beatles"
    },
    {
      "albumName": "Blackstar",
      "artist": "David Bowie"
    }
  ]
}

Как запустить это?

Комментарии:

1. Оба файла должны находиться в одном каталоге, и вам нужно открыть html-файл с веб-сервера, а не локально. Тогда это должно сработать так, как ожидалось.

2. Привет! это решило проблему! Файлы уже были в том же каталоге. Мне пришлось запускать его с сервера, а не локально. Спасибо!!

Ответ №1:

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

data.json

 {
 "albums": [
  {
   "name": "First Album",
   "artist": "Leonard Cohen"
  }
 ]
}

в html или js файле:

 fetch('http://127.0.0.1:5500/data.json')
    .then(response => response.json())
    .then(json => console.log(json))

в этом случае локальный адрес моего веб-сервера http://127.0.0.1:5500

Комментарии:

1. Запуск его на сервере заставил мой код работать. Я попробовал ваш метод, и он тоже сработал. Однако теперь я сталкиваюсь с другой странной проблемой. Я изменил содержимое файла json, остановил и снова запустил сервер. Теперь я не получаю никакого результата в консоли! Я даже очистил кэш. Он просто выдает результат и исчезает. Я не знаю, что делать!

2. Трудно понять, в чем проблема, потому что вашего описания недостаточно. возможно, причина, по которой вы не получаете никакого результата в консоли, заключается в том, что в вашем файле JSON есть проблема, например, отсутствует запятая (,) или двойные кавычки («).