获取时无法修复错误 - React.js

Question

我写了这段代码，我正在尝试获取数据，一切正常，但没有显示数据，当我检查时出现此错误：

从源 'http://localhost:3000' 访问 'http://localhost:8080/users' 已被 CORS 策略阻止：请求的资源上不存在 'Access-Control-Allow-Origin' 标头. 如果不透明响应满足您的需求，请将请求的模式设置为“no-cors”以在禁用 CORS 的情况下获取资源。

这是我的代码

import React, {useEffect, useState} from 'react'
import ReactDOM from 'react-dom'

export class UserComponent extends React.Component{

    constructor(props){
        super(props);
        this.state={users:[], addModalShow:false, editModalShow:false}
    }

    componentDidMount() {
        this.refreshList();
    }
    
    refreshList(){
        fetch('http://localhost:8080/users')
        .then(response => response.json())
        .then(data => {
            this.setState({users:data})
        });
    }

    render(){
        const {users, userId, FirstName, Username, LastName, Phone, Password, Address} = this.state;

        return(


            <div>
                <table>
                    <thead>
                        <tr>
                            <th>Id</th>
                            <th>First Name</th>
                            <th>Last Name</th>
                            <th>Username</th>
                            <th>Password</th>
                            <th>Address</th>
                            <th>Phone</th>
                        </tr>
                    </thead>
                    <tbody>
                        {users.length>0 && users.map((user)=>(
                            <tr key={user.Id}>
                                <td>{user.Id}</td>
                                <td>{user.FirstName}</td>
                                <td>{user.LastName}</td>
                                <td>{user.Username}</td>
                                <td>{user.Password}</td>
                                <td>{user.Adress}</td>
                                <td>{user.Phone}</td>
                            </tr>
                        ))}
                    </tbody>
                </table>
            </div>
        );
    }
}

const element=<UserComponent></UserComponent>
ReactDOM.render(element, document.getElementById('root'));

如果有人可以帮助我会很高兴。

Answer 1

只需在您的前端 package.json 中添加这个"proxy": "http://localhost:3000",

为了理解上面的代码片段，你可以参考这个