Json 回复JS，发出POST请求

我试着在ReactJS中创建POST请求，但是它不起作用

POST http://localhost:3000/ 404 (Not Found)

错误

有谁能帮我一下我做错了什么我已经试了4个多小时了，现在越来越烦人了：/

这是我的app.jsx文件

从“React”导入React；
从“react dom”导入react dom；
导入“/main.css”；
从“jquery”导入美元；
类ContactForm扩展了React.Component{
componentDidMount（）{
var$form=$（'.send_JSON'）；
var$inputName=$（'.get_name'）；
变量$inputAge=$（'.get_age'）；
变量$inputPrefix=$（'.get_prefix'）；
var$inputEmail=$（'.get_email'）；
var url='1〕http://localhost:3000/“；//可配置端点
函数loadJSON（）{
$.ajax({
url:url，
数据类型：“json”
}).完成（功能（res）{
控制台日志（res）；
log（“完成！”）
}).失败（功能（错误）{
console.log（错误）；
log（“未完成！”）
});
}
函数sendForm（发送姓名、发送年龄、发送前缀、发送电子邮件）{
$.ajax({
url:url，
方法：“post”，
数据类型：“json”，
数据：{
姓名：发送您的姓名，
年龄：发送年龄，
前缀：发送前缀，
电子邮件：发送电子邮件
}
}).完成（功能（res）{
loadJSON（）；
控制台日志（res）；
}).失败（功能（错误）{
log（“发送表单时出错”）；
readyToSubmit:'0'；
});
}
$form.on（'submit'，函数（e）{
e、 预防默认值（）；
var name=$inputName.val（）；
var age=$inputAge.val（）；
var prefix=$inputPrefix.val（）；
var email=$inputEmail.val（）；
如果（姓名！=''&&age>0&&email！=''）{
sendForm（姓名、年龄、前缀、电子邮件）；
$inputName.val（“”）；
$inputAge.val（0）；
$inputPrefix.val（“”）；
$inputEmail.val（“”）；
}
});
}
状态={
姓名：'姓名'，
年龄：''，
前缀：'-'，
电子邮件：“电子邮件地址”，
名称检查：“”，
年龄检查：“”，
电子邮件检查：“”，
已准备提交：“”
}
handleSubmit=（e）=>{
e、 预防默认值（）
sendForm（）；
这是我的国家({
名称检查：this.state.name.length 0？`Success${this.state.name}`:''，
})
}
handleChange=e=>{
这是我的国家({
名称：e.target.value，
})
}
handleChange2=e=>{
这是我的国家({
年龄：e.target.value
})
}
handleChange3=e=>{
这是我的国家({
前缀：e.target.value
})
}
handleChange4=e=>{
这是我的国家({
电子邮件：e.target.value
})
}
clearForm=（）=>{
document.getElementById（“sendForm”）.reset（）；
这是我的国家({
姓名：“，
年龄：“，
前缀：“Mr”，
电子邮件：“
})
}
render（）{
返回(
{this.state.readyToSubmit}
Sii应用程序
你的名字

{this.state.nameCheck}
你的年龄

{this.state.ageCheck}
你的前缀

先生
太太
夫人
你的电子邮件

{this.state.emailCheck}
清楚的
发送
)
}
}
类应用程序扩展了React.Component{
render（）{
返回
}
}
document.addEventListener（'DOMContentLoaded'，function（）{
ReactDOM.render(
,
document.getElementById（'app'）
);
});我建议您查看fetch（）API，而不是使用jQuery Ajax来生成HttpRequest。它更轻量级，并且会使代码看起来更简单。以下是Jake Archibald的博客链接，谷歌建议他学习如何使用fetch（）


此外，您还可以从谷歌官方文档中找到一些有用的示例：

我希望它能有所帮助。
通过添加fetch（）API，您还可以使用它来生成HttpRequest。
它是用于浏览器和node.js的基于promise的HTTP客户端

文档编制简单且可用

下面是GET请求的示例：

// Make a request for a user with a given ID
axios.get('/user?ID=12345')
.then(function (response) {
  console.log(response);
})
.catch(function (error) {
 console.log(error);
});

// Optionally the request above could also be done as
axios.get('/user', {
 params: {
   ID: 12345
 }
})
.then(function (response) {
 console.log(response);
})
.catch(function (error) {
 console.log(error);
});

// Want to use async/await? Add the `async` keyword to your outer 
function/method.
async function getUser() {
try {
 const response = await axios.get('/user?ID=12345');
 console.log(response);
 } catch (error) {
 console.error(error);
 }
}

你能展示你必须为端点服务的服务器代码吗？这可能是个问题，因为我不知道我是否有这样的文件。我在哪里可以找到它？上面的代码看起来像前端或客户端软件。为了向浏览器提供服务，您必须有后端或服务器软件，通常是server.js。如果你能给我们一个链接到你的整个回购协议，也许是最好的。