0

Im trying to display my json-data in an HTML page, but it wont work.

<div id="varer"></div>


    <div id="myData"></div>
    <script>
        fetch('c:/Users/name/school/class/marketplace/data/products.json')
            .then(function (response) {
                return response.json();
            })
            .then(function (data) {
                appendData(data);
            })
            .catch(function (err) {
                console.log('error: ' + err);
            });
        function appendData(data) {
            var mainContainer = document.getElementById("myData");
            for (var i = 0; i < data.length; i++) {
                var div = document.createElement("div");
                div.innerHTML = 'Name: ' + data[i].firstName + ' ' + data[i].lastName;
                mainContainer.appendChild(div);
            }
        }
    </script>

My JSON file is in another directory than the HTML page. When i run this in the browser console, its says that my API fetch cannot load.

Tao Emil Levinsen
  • 1
  • You cannot `fetch` from the file system, how would you like it if I read your computer files while you visit my website? You need to start a web server and serve your JSON file from there. – Juan Mendes Dec 06 '21 at 17:51

0 Answers0