Не получает никаких данных после нажатия openweathermap api при использовании lat и long params

Question

Я хотел попробовать OpenWeatherMap API. Поэтому я создал приложение реагирования, в котором я попробовал следующий URL, чтобы получить данные о погоде

api.openweathermap.org/data/2.5/forecast?APPID={APPID}&id=524901&q=Mumbai

, и оно работало без проблем, но когда я попробовал его с параметрами широты и долготы это не сработало. Кроме того, это не выдает никаких ошибок. Следующий URL-адрес использовался для длинных и длинных

api.openweathermap.org/data/2.5/forecast?APPID={APPID}&lat=19.19&lon=72.95

Я пробовал вышеуказанный URL в браузере и почтальоне и оба раза получал соответствующие данные.

Вот мой код в реакции написано внутри componentDidMount():

import './css/main.css';

class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            lat: 19.196735,
            long: 72.95785599999999
        }
    }
    componentDidMount() {
        this.setCityName();
        let url = 'api.openweathermap.org/data/2.5/forecast?lat=' + this.state.lat + '&lon=' + this.state.long + '&appid={APPID}';

        console.log(url)

        fetch(url)
            .then(res => res.json())
            .then(
                (result) => {
                    console.log(result)
                    this.setState({
                        isLoaded: true,
                        list: result.list[0],
                        city: result.city.name,
                        country: result.city.country
                    });
                },
                (error) => {
                    this.setState({
                        isLoaded: false,
                        error: error
                    });
                }
            )
    }

    setCityName() {
        let success = (position) => {
            let lat = position.coords.latitude;
            let long = position.coords.longitude;
            this.setState({
                lat,
                long
            })
        }

        let error = () => {
            console.log('Can not find your location. Setting default location to Mumbai!');
        }

        if (!navigator.geolocation) {
            console.log('Geolocation is not supported in your browser. Setting default location to Mumbai!');
        }
        else {
            navigator.geolocation.getCurrentPosition(success, error);
        }
    }

    render() {
        console.log(this.state.list)
        return (
            <div className="app-container">
                <span className="location"><i className="fa fa-map-marker-alt"></i>{this.state.city}, {this.state.country}</span>
                {/* <div>{this.state.list}</div>ire */}
            </div>
        )
    }
}

export default App;

Answer 1

Я сделал глупую ошибку. Я не использовал «https: //» при получении URL. Теперь работает нормально.