Posted in HTML,PHP,JavaScript

json api 호출 자바스크립트

 Published Date: 2023년 12월 14일 
<!DOCTYPE html>
<html>
  <body>
    <button onclick="getUser()">클릭</button> 
    <div id="userInfo"></div>

    <script>
function getUser() {
  const config = {
    method: "get"
  };
  fetch("https://url", config)
    .then(response => response.json())
    .then(data => {
      const name = document.createElement("div");
      const hlsUrl = document.createElement("div");


      name.textContent = data.name;
      hlsUrl.textContent = data.hlsUrl;


      const userInfo = document.getElementById("userInfo");
      userInfo.appendChild(name);
      userInfo.appendChild(hlsUrl);

    })
    .catch(error => console.log("fetch 에러!"));
}
</script>

  </body>
</html>