Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/ajax/6.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/26.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Ajax CORS不使用React应用程序_Ajax_Reactjs_Cors_Axios - Fatal编程技术网

Ajax CORS不使用React应用程序

Ajax CORS不使用React应用程序,ajax,reactjs,cors,axios,Ajax,Reactjs,Cors,Axios,我试图从维基百科api发出请求。虽然我使用的是普通的node.js服务器(localhost),但我在控制台中得到了以下信息: 无法加载XMLHttpRequest。请求的资源上不存在“Access Control Allow Origin”标头。因此,不允许访问源“null” 这是我的反应组件: import React, {Component} from 'react'; import axios from 'axios'; class WikipediaViewer extends Co

我试图从维基百科api发出请求。虽然我使用的是普通的node.js服务器(localhost),但我在控制台中得到了以下信息:

无法加载XMLHttpRequest。请求的资源上不存在“Access Control Allow Origin”标头。因此,不允许访问源“null”

这是我的反应组件:

import React, {Component} from 'react';
import axios from 'axios';

class WikipediaViewer extends Component {

   constructor(props) {
      super(props);
      this.state = {
         data: null
      }
   }

   componentDidMount() {

      axios.get('https://en.wikipedia.org/w/api.php?action=query&format=json&prop=pageimages&generator=search&piprop=name|original&pilimit=max&gsrsearch=Horse&gsrlimit=20')
      .then(data => {
            this.setState({
               data: data
            });
            console.log(data);
         })
   }

   render() {
      return (
         <h1>HEllo world!</h1>
      );
   }

}

export default WikipediaViewer
}

结果:

获取404(未找到)

尽管我在本地工作,为什么我必须得到这个错误。顺便说一句,我也使用了vitcad的“Allow-Control-Allow-Origin:*”Chrome扩展,但它不起作用。

请参阅上的答案。您必须将
origin=*
添加到查询参数:
url:'https://en.wikipedia.org/w/api.php?action=query&origin=*&format=json&prop=pageimages&generator=search&piprop=name | original&pilimit=max&gsrsearch=Horse&gsrlimit=20'
有关此维基百科怪癖的更长历史,请参见以下网址的答案。您必须将
origin=*
添加到查询参数:
url:'https://en.wikipedia.org/w/api.php?action=query&origin=*&format=json&prop=pageimages&generator=search&piprop=name | original&pilimit=max&gsrsearch=Horse&gsrlimit=20'
另请参阅有关这一维基百科怪癖的更长历史
componentDidMount() {

  axios.get({
     method: 'get',
     url: 'https://en.wikipedia.org/w/api.php?action=query&format=json&prop=pageimages&generator=search&piprop=name|original&pilimit=max&gsrsearch=Horse&gsrlimit=20',
     headers: {'X-Requested-With': 'XMLHttpRequest'},
     withCredentials: true,
  }).then(data => {
        this.setState({
           data: data
        });
        console.log(data);
     })