Javascript '；访问控制允许原点'；使用Axios从API获取数据时出错（React）

我收到一个“XMLHttpRequest无法加载。请求的资源上不存在“访问控制允许源代码”标头。因此不允许源代码“”访问。”

这是我的componendimount（），我使用axios从API获取数据

componentDidMount() {
   this.serverRequest = axios.get(this.props.source).then(event =>{    
     this.setState({
          title: event.data[0].name
      });
   });
}

我正在终端上使用“python-msimplehttpserver”来运行“”

我使用的是Chrome浏览器，如果我打开Chrome CORS插件（启用跨源资源共享），应用程序就会工作，我会看到DOM上API显示的数据。但是我知道使用CORS插件是不好的，那么我应该如何正式修复“访问控制允许来源”错误呢

---

有了Axios，我是否可以添加数据类型：“jsonp”，如果这样可以解决问题？

这是浏览器在尝试从另一个域访问某个域中的内容时出于安全原因而做出的限制。要克服这一点，需要在标题中设置以下内容

Access-Control-Request-Method
Access-Control-Request-Headers

许多网站限制COR。实现目标的最佳方法是将python服务器作为代理。参见示例

//Request from the client/browser

http://localhost:8000/loadsite?q=https%3A%2F%2Fexample.com

//In your server

 1. Handle the request
 2. Get the query param(url of the website)
 3. Fetch it using your python server
 4. Return the fetching data to the client.

---

这应该会起作用。

您需要允许服务器上的CORS为您的应用程序运行function@ShubhamKhatri但是在本地主机上呢？您使用的是哪个后端服务器。您需要在服务器上启用CORS，而无需在本地主机上执行任何操作