超级新人：XHR 的问题

如何解决超级新人：XHR 的问题

在此先感谢您能给我的任何帮助。正如标题中提到的，我正在尝试通过介绍课程而奋斗，但我在这个特定问题上非常努力。

这是我需要做的：

“现在我们可以开始使用 API 从其他应用程序获取信息。让我们创建一个天气应用程序 like this one。

这个项目包括创建一个应用程序，通过输入获取任何城市的名称并显示当前天气和未来 7 天的天气。

这个项目的重点是学习如何从 API 获取信息并处理多个承诺。

您将从 index.html 文件中带有 'id=city' 的元素中获取输入值（城市名称）。

每次用户单击“搜索”按钮时，程序都必须从输入中获取城市名称（需要验证）并进行 API 调用。将所有 javascript 代码写入“weather.js”文件中。

您需要在 OpenWeather 中创建一个帐户，然后才能获得 API KEY how to start with OpenWeather API

OpenWeather 有不同的 API 调用。您可以看到所有选项 here

我们正在使用其中两个：

• Current weather data
• One Call API

一切都好。您将创建一个可重复使用的 fetch 函数来从 API 获取数据

第一个 API 调用（当前天气数据）是获取特定城市名称的当前天气响应（让我们使用选项按城市名称）。响应还包含下一次 API 调用所需的纬度 (lat) 和经度 (lon) 内容。"

这是我所做的：

//Initialisation of variables
const myAPI = `hidden`;
let currentWeather = `http://api.openweathermap.org/data/2.5/weather?q=Garner&appid=${myAPI}`;
let oneCallAPI = `https://api.openweathermap.org/data/2.5/onecall?lat={lat}&lon={lon}&exclude={part}&appid=${myAPI}`;
let btn = document.getElementById('search');


function getWeather(url) { 
    let xhr = new XMLHttpRequest(); 
    xhr.open('GET',url); 
    xhr.onload = () => { 
      if(this.status === 200) { 
        let data = JSON.parse(xhr.responseText); 
        console.log(data); 
      } else{
          console.log('error');
      }
    }; 
    xhr.send(); 
  }

getWeather();

//   btn.addEventListener('click',() => { 
//     getWeather(currentWeather); 
// });

当页面加载时，我收到错误“XHR 加载失败：GET”http://vscodeliveserveraddy/undefined”以及我的错误消息记录到控制台。

是我的代码有问题吗？还是用我的实时服务器？ 旁注，我的 OpenWeather api 密钥也间歇性地停止工作。正常吗？

解决方法

你说 getWeather(); 所以你传递的是无参数。

function getWeather(url) { 将第一个参数分配给 url，但由于您没有传递任何变成 undefined 的参数。

然后您在此处使用该变量 xhr.open('GET',url);，它需要一个字符串，因此它被转换为 "undefined"，它是一个相对 URL，因此与当前页面的 URL 连接。