Couldn't load resource Error : net::ERR_CONNECTION_REFUSED - reactjs

Question

i'm using react JS for front end and .NET API for backend , i'm trying to fetch data from API , i enabled CORS (i added some configuration in startup file ) and it's all fine normally .
in react js , i want to fetch data using my API so this is my code to show a list of data :
import React from "react";
import ReactDOM from "react-dom";
import "antd/dist/antd.css";
import { List, Avatar, Button, Spin } from "antd";
import PropTypes from "prop-types";
import { withStyles } from "#material-ui/core/styles";
import reqwest from "reqwest";
const fakeDataUrl =
"http://localhost:51492/api/experience/";
class LoadMoreList extends React.Component {
state = {
loading: true,
loadingMore: false,
showLoadingMore: true,
data: []
};
componentDidMount() {
this.getData(res => {
this.setState({
loading: false,
data: res.results
});
});
}
getData = callback => {
reqwest({
url: fakeDataUrl,
type: "json",
method: "get",
contentType: "application/json",
success: res => {
callback(res);
}
});
};
onLoadMore = () => {
this.setState({
loadingMore: true
});
this.getData(res => {
const data = this.state.data.concat(res.results);
this.setState(
{
data,
loadingMore: false
},
() => {
// Resetting window's offsetTop so as to display react-virtualized demo underfloor.
// In real scene, you can using public method of react-virtualized:
// https://stackoverflow.com/questions/46700726/how-to-use-public-method-updateposition-of-react-virtualized
window.dispatchEvent(new Event("resize"));
}
);
});
};
render() {
const { loading, loadingMore, showLoadingMore, data } = this.state;
const loadMore = showLoadingMore ? (
<div
style={{
textAlign: "center",
marginTop: 12,
height: 32,
lineHeight: "32px"
}}
>
{loadingMore && <Spin />}
{!loadingMore && (
<Button onClick={this.onLoadMore}>loading more</Button>
)}
</div>
) : null;
return (
<List
style={{
width: "50%",
left: "25%"
}}
className="demo-loadmore-list"
loading={loading}
itemLayout="horizontal"
loadMore={loadMore}
dataSource={data}
renderItem={item => (
<List.Item
actions={[
<Button type="primary" icon="user-add">
suivre
</Button>,
<a>Message</a>
]}
>
<List.Item.Meta
avatar={
<a>
<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />{" "}
</a>
}
title={{item.titre}}
/>
</List.Item>
)}
/>
);
}
}
LoadMoreList.propTypes = {
classes: PropTypes.object.isRequired
};
export default withStyles()(LoadMoreList);
this code will show a list of experiences and it allows us to load more data clicking on LoadMore
but what i get when i start the project :
and in DevTools i get this error
Failed to load resource: net::ERR_CONNECTION_REFUSED
i looked in google for many solutions but no one helped me
thanks for helping me .