正在从JSON响应中删除不需要的标记

Question

希望有人能提供帮助，我正在React应用程序中的一个端点使用以下代码执行提取：

try {
const response = await fetch("https://myendpoint.com/abcd/search?c=abc123");
const jsonData = await response.json();
console.log(jsonData);
} catch (err) {
console.error(err.message);
}

并返回错误：server.js:1 Unexpected token < in JSON at position 0

在Postman中，当我运行并返回JSON时，我会返回：

<pre>{
"name": "abc123",
"location": "USA",
"notes": "qwerty"
}</pre>

现在我无法控制响应，并且我假设错误与<pre>中的"<"有关。

删除这些标签(即<pre> and </pre>(的最佳方法是什么，这样我就可以返回有效的JSON？

Answer 1

预标记出现的原因是对html的请求。而不是json响应。您需要将Content-Type设置为application/json的标头传递出去。这应该能解决你的问题。

try {
const response = await fetch('https://myendpoint.com/abcd/search?c=abc123', {
headers: { 'Content-Type': 'application/json' }
});
const jsonData = await response.json();
console.log(jsonData);
} catch (err) {
console.error(err.message);
}

Answer 2

虽然我不认为这是推荐的答案，但如果您不控制服务器并且Content-Type标头不起作用，这是一个解决方案。

try {
const response = await fetch('https://httpbin.org/get');
const responseText = await response.text();
const convertedResponseText = responseText.replace(/<pre>|</pre>/gm, '');
const responseJSON = JSON.parse(convertedResponseText);
console.log(responseJSON);
} catch (err) {
console.error(err.message);
}