尝试使用javascript从api获取数据

Question

I'am trying to fetch data from a online MongoDb database using javascript and html. but it doesn't work properly. Also using jquery library too

<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>

Answer 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> 

Your Front End works well. I replaced the api url in your code and everything is fine. It might be something on the Back End. Did you check the status code that you get from the server?