TypeError: «NetworkError при попытке извлечь ресурс». после получения - PullRequest
0 голосов
/ 14 апреля 2020

Я работаю с OpenWeatherAPI, и второй раз получаю эту ошибку, когда использую fetch: TypeError: "NetworkError при попытке извлечь ресурс." Я уже использовал этот API раньше, и он работал, поэтому я запутался, что вызывает ошибку на этот раз. Может быть, я использую тот же ключ API? Я вижу, что эта причина как-то связана с CORS или веб-безопасностью, и чтобы обойти эту ошибку, мне нужно либо снизить безопасность, либо использовать другой веб-браузер (я использую Firefox). Есть ли более простое решение для этого, чтобы код извлекался как обычно?

import React from "react";

class OpenWeather extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            city: "",
        }
        this.handleInputChange = this.handleInputChange.bind(this);
        this.handleSubmit = this.handleSubmit.bind(this);
    }
    handleInputChange(e) {
        this.setState({city: e.target.value})
    }
    async handleSubmit(e) {
        const cityName = this.state.city;
        const apiKey = "95f164c76ff59c438ecaa15889931a52";
        const url = `api.openweathermap.org/data/2.5/weather?q=${cityName}&appid=${apiKey}`;
        await fetch(url)
    .then(response => {
        return response.json();
    })
    .then(data => {
        console.log(data);
    })
    .catch(err => {
        console.log(err);
    });
    }
    render() {
        return (
            <div>
                <form onSubmit={this.handleSubmit}>
                <input id="city" type="text" name="name" placeholder="Enter city:" value={this.state.city} onChange={this.handleInputChange} />
                <button type="submit" value="Submit">Enter</button>
                </form>
            </div>
        )
    }
}
export default OpenWeather;

...