簡體   English   中英

嘗試使用javascript從api獲取數據

[英]Trying to fetch data from an api using javascript

我正在嘗試使用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>

 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> 

您的前端效果很好。 我在您的代碼中替換了api網址,一切正常。 它可能在后端。 您是否檢查了從服務器獲得的狀態代碼?

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM