Ошибка появляется при попытке извлечь данные из Firebase с помощью axios - PullRequest
0 голосов
/ 24 марта 2020

Я пытаюсь создать веб-приложение с помощью реакции. Я хочу получить данные из Firebase, используя ax ios, но после использования метода get и передачи ссылки в метод get я получаю следующую ошибку:

localhost /: 1 Доступ к XMLHttpRequest at ' https‍: //console.firebase#########base/data/ '(перенаправлено с https‍: //#################firebaseio.com/ ') из источника' http‍: // localhost: 3000 'был заблокирован политикой CORS: в запрошенном ресурсе отсутствует заголовок' Access-Control-Allow-Origin '.

Я не являюсь в состоянии выяснить, что я делаю не так. Дайте мне знать, если требуется дополнительная информация.

вот код

import React, { Component } from 'react';
import Aux from '../../hoc/aux';
import Classes from './body.css';
import Logo from '../../assets/image/Logo.png';
import Tank from './tank/tank';
import TankDetail from './TankDetail/TankDetail';
import axios from 'axios';

class body extends Component{

    state={
        percentage:0
    }

    watermeterHandler=(info)=>{
        let num= info;
        let result=Number(((100/90)*num).toPrecision(2))
        this.setState({
            percentage: result
        })
    }

    componentDidUpdate(){
        axios.get('https://dista#################.com/')
        .then(response=>{
            console.log(response)
            //this.watermeterHandler(response.data);
        })
    }



    render(){
        return(
        <Aux>
            <div className={Classes.upperBody}>
                <img src={Logo} alt='hi'/>
                <h1>" Make Every Drop of Water Count "</h1>
                <button onClick={this.props.scroll}>Start Conservation</button>
            </div>
            <div className={Classes.lowerBody}>

                <div className={Classes.tankBody}>
                    <Tank percent={this.state.percentage}/> 
                </div>
                <div className={Classes.tankDetail}>
                    <TankDetail dataDetail={this.state.percentage}/>
                </div>

            </div>
        </Aux>

    );
    }
}



export default body;

1 Ответ

0 голосов
/ 25 марта 2020

Просто добавьте. json к ссылке, установленной в качестве параметра в функции get. Это устранит ошибку.

...