Блог

Главная - Вопросы по программированию - URI данных в JSON в Javascript?

URI данных в JSON в Javascript?

#javascript #json #data-uri

#javascript #json #data-uri

Вопрос:

Я столкнулся с проблемой, когда мое серверное приложение получает данные JSON, и я хотел бы снова проанализировать его в JSON. Как я мог это сделать? Я пробовал разные вещи, но, похоже, ничего не получалось. Я попытался просто разобрать его или encodeURI(data); , но все равно не могу получить исходный JSON.

Это URI данных: data:application/json;base64,ew0KICAgICJtYWx0X3R5cGUiOiAibG9nIiwNCiAgICAibWFsdF9kYXRhIjogIldvdywgdSByIGFsbW9zdCB0aGVyZSA6TyINCn0=

Я тоже попробовал это закодировать:

 var data = 'data:application/json;base64,ew0KICAgICJtYWx0X3R5cGUiOiAibG9nIiwNCiAgICAibWFsdF9kYXRhIjogIldvdywgdSByIGFsbW9zdCB0aGVyZSA6TyINCn0=';
Buffer.from(data.toString('utf8'), 'base64').toString('ascii')

Но я получаю это, если регистрирую его на консоли: u Zje F- J'm k0P"amp;VGEwGR#"amp;Fvr"@P"amp;VGEvFF#"%vwrBR"FVw7BFWamp;R$r P'

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

1. Вы должны указать контекст, опубликовать некоторый код и объяснить, чего вы достигли, и какая часть кода дает сбой или не дает ожидаемых результатов. Вы не можете ожидать, что получите полное решение здесь.

2. Извините, я отредактировал свой пост

Ответ №1:

URI данных — это JSON, закодированный в Base64. Для этого есть два шага:

  1. Декодируйте Base64 (например, с atob помощью функции) и
  2. Проанализировать полученный JSON

Например (в браузере):

 const dataURI = "data:application/json;base64,ew0KICAgICJtYWx0X3R5cGUiOiAibG9nIiwNCiAgICAibWFsdF9kYXRhIjogIldvdywgdSByIGFsbW9zdCB0aGVyZSA6TyINCn0=";

// 29 = length of "data:application/json;base64,"
const json = atob(dataURI.substring(29));
const result = JSON.parse(json);
console.log(result);

Ваше использование Buffer в вашем вопросе наводит меня на мысль, что вы можете использовать Node.js . Если это так, вы бы заменили вызов на atob Buffer.from(data, 'base64').toString() :

 const dataURI = "data:application/json;base64,ew0KICAgICJtYWx0X3R5cGUiOiAibG9nIiwNCiAgICAibWFsdF9kYXRhIjogIldvdywgdSByIGFsbW9zdCB0aGVyZSA6TyINCn0=";

// 29 = length of "data:application/json;base64,"
const json = Buffer.from(dataURI.substring(29), "base64").toString();
const result = JSON.parse(json);
console.log(result);

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

1. Я использую Node.js , и ваш код работает на меня. Большое вам спасибо

Ответ №2:

Если вы не возражаете изменить контекст на асинхронный, который вы могли бы использовать fetch() для анализа обращения. fetch() обычно используется с URL-адресами, но также работает с URI данных (в большинстве браузеров).

 const dataURI = "data:application/json;base64,ew0KICAgICJtYWx0X3R5cGUiOiAibG9nIiwNCiAgICAibWFsdF9kYXRhIjogIldvdywgdSByIGFsbW9zdCB0aGVyZSA6TyINCn0=";

(async function () {
  const response = await fetch(dataURI);
  const data = await response.json();
  console.log(data);
})();

Если вы уже используете библиотеку для упрощения сетевых запросов, вы также можете использовать их.

Примеры:

jQuery:

 const dataURI = "data:application/json;base64,ew0KICAgICJtYWx0X3R5cGUiOiAibG9nIiwNCiAgICAibWFsdF9kYXRhIjogIldvdywgdSByIGFsbW9zdCB0aGVyZSA6TyINCn0=";

(async function() {
  const data = await $.getJSON(dataURI);
  console.log(data);
})(); 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

axios:

 const dataURI = "data:application/json;base64,ew0KICAgICJtYWx0X3R5cGUiOiAibG9nIiwNCiAgICAibWFsdF9kYXRhIjogIldvdywgdSByIGFsbW9zdCB0aGVyZSA6TyINCn0=";

(async function() {
  const response = await axios.get(dataURI);
  console.log(response.data);
})(); 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.21.0/axios.min.js"></script>

Метки: