Как проверить, является ли ответ выборки объектом json в javascript

100

Я использую fetch polyfill для получения JSON или текста из URL-адреса, я хочу знать, как я могу проверить, является ли ответ объектом JSON или это только текст 

fetch(URL, options).then(response => {
   // how to check if response has a body of type json?
   if (response.isJson()) return response.json();
});
javascript json fetch-api Сибелиус Серафини
источник
stackoverflow.com/a/20392392/402037
Андреас

Ответы:

178

Вы можете проверить content-typeответ, как показано в этом примере MDN :

fetch(myRequest).then(response => {
  const contentType = response.headers.get("content-type");
  if (contentType && contentType.indexOf("application/json") !== -1) {
    return response.json().then(data => {
      // process your JSON data further
    });
  } else {
    return response.text().then(text => {
      // this is text, do something with it
    });
  }
});

Если вам нужно быть абсолютно уверенным, что контент является допустимым JSON (и не доверяет заголовкам), вы всегда можете просто принять ответ как textи самостоятельно проанализировать его:

fetch(myRequest)
  .then(response => response.text())
  .then(text => {
    try {
        const data = JSON.parse(text);
        // Do your JSON handling here
    } catch(err) {
       // It is text, do you text handling here
    }
  });

Асинхронный / ожидание

Если вы используете async/await, вы можете написать его более линейно:

async function myFetch(myRequest) {
  try {
    const reponse = await fetch(myRequest); // Fetch the resource
    const text = await response.text(); // Parse it as text
    const data = JSON.parse(text); // Try to parse it as json
    // Do your JSON handling here
  } catch(err) {
    // This probably means your response is text, do you text handling here
  }
}
ноль
источник
1
Используя ту же стратегию, вы можете просто использовать response.json в сочетании с catch; если вы поймали ошибку, значит это не json. Разве это не было бы более идиоматическим способом справиться с этим (вместо отказа от response.json)?
Wouter Ronteltap
3
@WouterRonteltap: Разве вам не разрешено делать только одно или другое. Кажется, я помню, что у вас есть только один шанс на response.anything (). Если это так, JSON является текстом, но текст не обязательно JSON. Следовательно, вы должны сначала сделать что-то надежное, а именно .text (). Если вы сначала выполните .json (), а он не удастся, я не думаю, что у вас будет возможность сделать также .text (). Если я ошибаюсь, покажите, пожалуйста, другое.
Lonnie Best
2
На мой взгляд, вы не можете доверять заголовкам (хотя и должны, но иногда вы просто не можете управлять сервером на другой стороне). Так что здорово, что вы также упомянули в своем ответе try-catch.
Джейкоб
2
Да, @Lonnie Best совершенно прав в этом. если вы вызываете .json (), и он генерирует исключение (поскольку ответ не является json), вы получите исключение «Тело уже использовано», если вы впоследствии вызовете .text ()
Энди,
3

Вы можете сделать это чисто с помощью вспомогательной функции:

const parseJson = async response => {
  const text = await response.text()
  try{
    const json = JSON.parse(text)
    return json
  } catch(err) {
    throw new Error("Did not receive JSON, instead received: " + text)
  }
}

А затем используйте это так:

fetch(URL, options)
.then(parseJson)
.then(result => {
    console.log("My json: ", result)
})

Это вызовет ошибку, так что вы можете catchэто сделать, если хотите.

Larskarbo
источник
1

Используйте парсер JSON, например JSON.parse:

function IsJsonString(str) {
    try {
        var obj = JSON.parse(str);

         // More strict checking     
         // if (obj && typeof obj === "object") {
         //    return true;
         // }

    } catch (e) {
        return false;
    }
    return true;
}
Ракеш Сони
источник