Cod：401“消息”使用开放天气 API 时 API 密钥无效

Question

我正在尝试构建一个天气应用程序，每当我尝试搜索城市时，它都会显示未定义，并且湿度和风速值不会改变。我还收到 Cod:401 invalid API key 错误。

我尝试了很多方法来看看到底出了什么问题。但还是找不到答案。

 <script>
      const apiKey = "c783c8739883eb8cfbb8e5fb0a959dc5";
      const apiUrl =
        "https://api.openweathermap.org/data/2.5/weather?units=metric&q=";
      const searchBox = document.querySelector(".search input");
      const searchBtn = document.querySelector(".search button");

      async function checkweather(city) {
        const response = await fetch(apiUrl + city + `&appid=$(apikey)`);
        var data = await response.json();
        console.log(data);
        document.querySelector(".city").innerHTML = data.name;
        document.querySelector(".temp").innerHTML =
          Math.round(data.main.temp) + "°c";
        document.querySelector(".humidity").innerHTML =
          data.main.humidity + "%";
        document.querySelector(".windspeed").innerHTML =
          data.wind.speed + "km/h";
      }
      searchBtn.addEventListener("click", () => {
        checkweather(searchBox.value);
      });
    </script>

Answer 1

更正模板文字语法

TL；博士。。您的

$(apikey)

方法中有

fetch

并带有括号 (

(

)

)。将它们更改为带大括号的

${apikey}

(

{

}

)。

Javascript 模板文字语法。

`string text`

`string text line 1
 string text line 2`

`string text ${expression} string text`

tagFunction`string text ${expression} string text`

您使用了括号而不是大括号，这在语法上是不正确的。先尝试修复它。