无法读取我的API或特定的API

我真的很困惑，如果你告诉我，我的代码是错误的，我已经尝试了不同的API，它的工作原理。 但在我的情况下，在react.js中有几个API无法访问。 请帮助我，并纠正。 你可以尝试这些在react.js中不起作用的API，但是总是得到脚本抓取失败或networking错误：

1. http://pp53.azurewebsites.net/pp53service.svc/viewprovincelist
2. https://www.getpostman.com/collections/1d8df8b0b5bf27e5009b

第一个是我的API，第二个是其他。 我已经尝试了邮差和其他编程语言和其他框架，如ASP.NET MVC的API，但它不再麻烦了。 但是当我尝试与axios react.js，获取，即使ajax该API将无法正常工作。 有没有人可以向我解释为什么？ 因为如果你使用这一个https://api.myjson.com/bins/1cfkej或这个http://jsonplaceholder.typicode.com/todos没有问题。

谢谢！！

这是我的代码

import React from 'react'; import axios from 'axios'; export class viewDetailPP53 extends React.Component { constructor(props) { super(props); this.state = { count : [] }; } componentDidMount(){ var self = this; axios.get('http://pp53.azurewebsites.net/pp53service.svc/viewprovincelist') .then(function (results) { self.setState({ count: results.data }); }) .catch(function (error) { console.log(error); }); } render() { return( <div> <table> <thead> <tr> <th>column 1</th> <th>column 2</th> </tr> </thead> <tbody> {this.state.count.map((a, i) => <TableRow key = {i} count = {a} />)} </tbody> </table> </div> ); } } class TableRow extends React.Component { render() { return ( <tr> <td>{this.props.count.idProvince}</td> <td>{this.props.count.province}</td> </tr> ); } } 

Answer 1

感谢Dimitrov Dimitrov提供的线索。 我现在解决我的问题。 这是因为我自己的API没有为CORSconfiguration。 而我只是通过添加这一行来启用它：

 <httpProtocol> <customHeaders> <add name="Access-Control-Allow-Origin" value="*" /> </customHeaders> </httpProtocol> 

在我的WCF RESTful web.config和system.webserver下。 参考： http : //www.c-sharpcorner.com/UploadFile/dhananjaycoder/solved-access-control-allow-origin-error-in-wcf-rest-service/

非常感谢您节省我的时间:)