fastapi前端数据交互

FastAPI 是一种基于 Python 的现代 Web 框架，它提供了快速构建高性能 Web 应用的能力。它支持前后端的数据交互，可以使用 JSON、FormData 或其他格式来发送数据。

下面是一个简单的 FastAPI 前后端数据交互的示例：

1. 首先，需要在前端编写一个表单，并在表单中添加一个提交按钮：

<form id="my-form">
  <input type="text" name="name">
  <input type="email" name="email">
  <button type="submit">提交</button>
</form>

2. 接下来，在 JavaScript 中编写发送数据的代码：

const form = document.querySelector('#my-form');

form.addEventListener('submit', async (e) => {
  e.preventDefault();

  const formData = new FormData(form);
  const response = await fetch('/api/my-endpoint', {
    method: 'POST',
    body: formData,
  });

  const data = await response.json();
  console.log(data);
});

3. 在后端，我们可以使用 FastAPI 来处理请求并返回响应：

from fastapi import FastAPI, Form

app = FastAPI()

@app.post('/api/my-endpoint')
async def my_endpoint(name: str = Form(...), email: str = Form(...)):
  # 处理请求数据
  # ...

  # 返回响应数据
  return {'success': True}

在上面的代码中，我们使用 FastAPI 的 `Form` 类型来解析表单数据，并将其作为参数传递给路由处理函数。在处理函数中，我们可以使用解析后的数据来执行相应的操作，并返回响应数据。

以上就是一个简单的 FastAPI 前后端数据交互的示例，你可以根据自己的需求进行修改和扩展。