尝试使用 axios 从 Firebase 获取数据时出现错误答案

【问题标题】：Error shows up when trying fetch data from Firebase using axios尝试使用 axios 从 Firebase 获取数据时出现错误
【发布时间】：2020-03-24 10:46:10
【问题描述】：

我正在尝试使用 react 构建一个 Web 应用程序。我想使用 axios 从 Firebase 获取数据，但是在使用 get 方法并将链接传递给 get 方法时，我收到以下错误。

localhost/:1 在 'https‍://console.firebase########base/data/' 访问 XMLHttpRequest（重定向自 '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;

【问题讨论】：

如果没有代码，我们只能猜测哪个没有用。

标签： reactjs firebase axios

【解决方案1】：

只需将 .json 添加到链接集作为 get 函数中的参数即可。这将消除错误。

【讨论】：

【解决方案2】：

只需在链接末尾或参数中添加 .json 即可。这将结束错误

【讨论】：