APIにアクセスして返ってきた情報を表示する

WEBページからAPIにアクセスして返ってきた情報を表示する。人工衛星は今どこ?のコードを参考に、基本の構成方法をまとめる。

# 表示する場所を確保する(HTML)
      latitude: <span id="lat"></span>°<br />
      longitude: <span id="lon"></span>°<br />

以下JavaScript。

# アクセス先
      const api_url = 'https://api.wheretheiss.at/v1/satellites/25544';
      async function getISS() {
# アクセスしてレスポンス情報(辞書構造)を格納する
        const response = await fetch(api_url);
# 不要なjsonの括弧を取り除く
        const data = await response.json();
# 必要な項目の情報だけを抜き取る
        const { latitude, longitude} = data;
# 抜き取った情報を指定した場所に表示する指示
        document.getElementById('lat').textContent = latitude.toFixed(2);
        document.getElementById('lon').textContent = longitude.toFixed(2);
            }
      getISS();
      setInterval(getISS, 1000);

コメントを残す