首页 > 解决方案 > 如何修复我的 api 项目的 429 请求错误?

问题描述

我正在尝试从 FreeCodeCamp 构建一个非常简单的项目,它使用 API 信息来提供天气信息。我正在使用 Heroku 应用程序,以便能够在它仍然是本地主机时使用 API。但是,我收到 2 个错误,我不知道如何解决这个问题。有什么帮助吗?

window.addEventListener("load", ()=> {
    let long;
    let lat;

    if(navigator.geolocation){
        navigator.geolocation.getCurrentPosition(position => {
            long = position.coords.longitude;
            lat = position.coords.latitude;
            const proxy=`https://cors-anywhere.herokuapp.com/`;
            const api=`${proxy}https://api.openweathermap.org/data/2.5/onecall?lat=${lat}&lon=${long}&
            exclude={part}&appid={bdd50c9439280eb7362c1f796ce614ae}`;
            
            fetch(api)
            .then(response =>{
                return response.json();
            })
            .then(data =>{
                console.log(data);
            })
        });
    }else {
        h1.textContent = "hey dis is not working because not enabled"
    };
    
});
* {
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body {
    height:100vh;
    display:flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    background: linear-gradient(rgb(47,150,163),rgb(48,62,143));
    font-family: sans-serif;
    color:white;

}
.location,.temperature {
    height: 30vh;
    width:50%;
    display:flex;
    justify-content: space-around;
    align-items: center;
}
.temperature{
    flex-direction: column;
}
.degree-section {
    display: flex;
    align-items: center;
    cursor: pointer;
}
.degree-section span{
    margin: 10px;
    font-size:30px
}
.degree-section h2{
    font-size: 40px;
}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
    <link rel="stylesheet" href="./style.css"/>
    <title>Document</title>
</head>
<body>
    <div class="location">
        <h1 class="location-timezone">Timezone</h1>
        <p>Icon</p>
    </div>
    <div class="temperature">
        <div class="degree-section">
        <h2 class="temp-degree">34</h2>
        <span>F</span>
        </div>
        
        <div class="temp-description">It's friggin cold</div>
    </div>
    <script src="app.js"></script>
</body>
</html>

在此处输入图像描述

标签: javascripthtmlcssapi

解决方案


HTTP 429Too many requests响应状态代码表示用户在给定时间内发送了太多请求(“速率限制”)。

您需要检查实际限制是多少,并可能避免在页面加载或超过其值时进行调用。

资源


推荐阅读