FASTapi与axios 前后端数据传输报错

在fastapi后axios前后端数据传输过程中遇到问题,后端总是无法正常接收axios发送的数据。

在结果多次尝试后初步解决了问题,虽然还有许多不懂的地方,,,

用postman返回报错:

1.将传递数据类型统一为JSON格式

fastapi:

docs显示需要的请求体类型:

 在axios中,将数据设置为json类型:

对应在postman中的row-json格式:

 

 正常返回数据

2. 采用Body格式

将fastapi改为:

 期望的请求体类型为:

 将axios改为:

对应postman中的格式为:

 也能够正常响应

 

 

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
当然,以下是一个使用Axios进行前后端数据交互的案例: 在这个案例中,我们将展示一个简单的前后端交互流程,其中前端使用Axios发送HTTP请求,后端使用Node.js和Express处理请求并返回响应。 前端代码(使用Axios发送POST请求): ```javascript import axios from 'axios'; const data = { name: 'John Doe', email: 'johndoe@example.com' }; axios.post('/api/user', data) .then(response => { console.log(response.data); }) .catch(error => { console.error(error); }); ``` 上述代码中,我们使用Axios的`post`方法发送一个POST请求到`/api/user`端点,并传递一个包含用户信息的数据对象。 后端代码(使用Node.js和Express处理请求): ```javascript const express = require('express'); const bodyParser = require('body-parser'); const app = express(); app.use(bodyParser.json()); app.post('/api/user', (req, res) => { const { name, email } = req.body; // 在这里执行后端逻辑,比如保存用户数据到数据库等 // 返回成功响应 res.status(200).json({ message: 'User created successfully!' }); }); app.listen(3000, () => { console.log('Server is running on port 3000'); }); ``` 上述代码中,我们首先使用`body-parser`中间件来解析请求的JSON数据。然后,我们创建了一个POST路由处理程序,它接收来自前端的用户数据。在这个处理程序中,你可以根据实际需求执行后端逻辑,比如将用户数据保存到数据库中。最后,我们返回一个成功的JSON响应。 通过以上的前后端代码,我们实现了使用Axios进行前后端数据交互的简单案例。当前端发送POST请求时,后端将接收到请求并处理它,然后返回一个成功的响应。 希望这个案例对你有帮助!如果你有其他问题,请随时提问。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值