尝试使用 javascript 从 api 获取数据答案

【问题标题】：Trying to fetch data from an api using javascript尝试使用 javascript 从 api 获取数据
【发布时间】：2019-10-16 10:22:24
【问题描述】：

我正在尝试使用 javascript 和 html 从在线 MongoDb 数据库中获取数据。但它不能正常工作。也使用 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 (in promise) TypeError: data.forEach is not a function

标签： javascript html node.js

【解决方案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;
    });
  });

&lt;div id="app"&gt;&lt;/div&gt;

您的前端运行良好。我替换了您代码中的 api url，一切都很好。它可能是后端的东西。你检查过从服务器获取的状态码吗？

【讨论】：

这应该是评论，而不是答案。
是的，但是我无法在 cmets 中执行代码示例，并且通过代码示例，FE 方面没有任何改变。
我使用邮递员检查了 api，它工作正常。可以吗？
我在 chrome 控制台中看到很薄 Uncaught SyntaxError: Unexpected token
你能在 chrome 开发工具中打开网络标签吗？在这里您可以查看有关服务器响应的更多信息。