Попытка получить данные из API с помощью javascript
Я пытаюсь получить данные из онлайн-базы данных MongoDb, используя javascript и html. но это не работает должным образом. Также с использованием библиотеки jquery
<div>
<input type = "submit" value = "GET DATA FROM API" id = "getAPI">
<div id = "result" ></div>
<div ><h2>Input Form</h2></div>
<form id = "postData" >
</form>
</div>
<!-- javascript part -->
<script>
document.getElementById('getAPI').addEventListener('click', getAPI);
function getAPI() {
fetch('http://localhost:3000/api/seller')
.then((res) => { return res.json() })
.then((data) => {
let result = `<h2> Random User Info From Jsonplaceholder API</h2>`;
data.forEach((seller) => {
const {id, name, email} = seller
result +=
`<div>
<h5> User ID: ${id} </h5>
<ul>
<li> User Full Name : ${name}</li>
<li> User Email : ${email} </li>
</ul>
</div>`;
document.getElementById('result').innerHTML = result;
});
})
}
</script>
<script src = "jquery-3.3.1.min.js" type = "text/javascript"></script>
это не дает никакого результата в качестве вывода
Делает ли он запрос ajax? Есть ли ответ в формате JSON?
это можно увидеть в консоли chrome view.html:1 Unchecked runtime.lastError: порт сообщения закрыт до получения ответа. view.html:1 Unchecked runtime.lastError: Порт сообщения закрыт до получения ответа.
теперь этот view.html?_ijt=72t9n4ls8vjcs5g7minkkcai31:28 Uncaught (в обещании) TypeError: data.forEach не является функцией
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
fetch("https://jsonplaceholder.typicode.com/users")
.then(res => {
return res.json();
})
.then(data => {
let result = `<h2> Random User Info From Jsonplaceholder API</h2>`;
data.forEach(seller => {
const {
id,
name,
email
} = seller;
result += `<div>
<h5> User ID: ${id} </h5>
<ul>
<li> User Full Name : ${name}</li>
<li> User Email : ${email} </li>
</ul>
</div>`;
document.getElementById("app").innerHTML = result;
});
});<div id = "app"></div>Ваш интерфейс работает хорошо. Я заменил URL-адрес API в вашем коде, и все в порядке. Это может быть что-то на задней панели. Вы проверили код состояния, который вы получаете от сервера?
Это должен быть комментарий, а не ответ.
Да, но я не могу выполнить пример кода внутри комментариев, и судя по примеру кода, на стороне FE ничего не меняется.
Я проверил API с помощью почтальона, и он работал нормально. Все хорошо ?
Я вижу тонкий в хромированной консоли Uncaught SyntaxError: неожиданный токен < 8Unchecked runtime.lastError: порт сообщения закрыт до получения ответа.
Можете ли вы открыть вкладку сети в инструментах разработчика Chrome? Здесь вы можете проверить больше информации об ответе сервера.
URL-адрес запроса: cr-input.mxpnl.net/… Метод запроса: Код состояния POST: 200 Удаленный адрес: 52.72.99.240:443 Политика реферера: no-referrer-when-downgrade
хорошая идея. я проверил, и комментарий выше - это то, что я видел. обязательно проверю
открыл страницу в режиме инкогнито. и получил следующее в chrome console view.html?_ijt=72t9n4ls8vjcs5g7minkkcai31:28 Uncaught (в обещании) TypeError: data.forEach не является функцией
Хм, проверьте значение данных перед выполнением foreach. Похоже, что данные не массив, может быть, это объект? Вы можете проверить это с помощью console.info(data);
ааа, так как я использую MongoDb, он сохраняет данные как объект. Так может тут дело в этом?
Какая часть кода не работает?