Javascript 如何使用reactjs调用api

我编写了这些代码，但给出了一些错误：未能加载资源：Originhttp://localhost:3000 访问控制允许原点不允许

我能为那些代码做些什么？非常感谢你的帮助

import React, {useEffect, useState} from 'react';

function App() {
    const [coins,setCoins] = useState([]);
    const API_URL = 'https://sandbox-api.coinmarketcap.com/v1/cryptocurrency/listings/latest';

    const getCoins = (API) => {
        fetch(API, {
            "method": "GET",
            "headers": {
                "X-CMC_PRO_API_KEY": "b54bcf4d-1bca-4e8e-9a24-22ff2c3d462c",
                "content-type": "application/json",
                "accept": "application/json",
                'Access-Control-Allow-Origin':'*'
            }
        })
        .then(response => {
            console.log(response);
        })
        .catch(err => {
            console.log(err);
        });
    }

    useEffect(() => {
        getCoins(API_URL);
    }, []);

  return (
    <div>
        {coins.map(coin => (
            <div>{coin.id}</div>
        ))}
    </div>
  );
}

export default App;

import React，{useffect，useState}来自“React”；
函数App（）{
const[coins，setCoins]=useState（[]）；
const API_URL='1〕https://sandbox-api.coinmarketcap.com/v1/cryptocurrency/listings/latest';
const getCoins=（API）=>{
获取（API、{
“方法”：“获取”，
“标题”：{
“X-CMC专业API密钥”：“b54bcf4d-1bca-4e8e-9a24-22ff2c3d462c”，
“内容类型”：“应用程序/json”，
“接受”：“应用程序/json”，
“访问控制允许来源”：“*”
}
})
。然后（响应=>{
控制台日志（响应）；
})
.catch（错误=>{
控制台日志（err）；
});
}
useffect（（）=>{
获取硬币（API_URL）；
}, []);
返回(
{coins.map（coin=>(
{coin.id}
))}
);
}
导出默认应用程序；

这仅仅意味着在后端/服务器端不启用CORS。

请注意。确保API服务器上是否允许访问控制允许源。例如，如果您使用nginx来承载API，那么nginx conf文件中应该有以下行

location / {
add_header 'Access-Control-Allow-Origin' '*';
}

---

也可以为apache添加类似的配置。

这与React无关，但您可以检查是否使用它来创建项目。如果没有，您可以查看网页包的代理文档或您在那里使用的任何其他工具。因为您不是管理API部件的人，所以您应该使用后端来发出请求，或者按照我的建议使用开发代理。不使用cra文档我不理解并尝试使用Axios，但没有使用useEffect（（）=>{//getCoins（LAST_URL）；Axios.get（LAST_URL，{头：{'Access-Control-Allow-Origin'：'*'}}）.then（res=>{setCoins（res.data）；}.catch（error=>console.log（error））；}）；您不是管理API的人，您在那里做的事情不起作用。您需要使用正确的poxy。我不使用nginx