我正在创建一个管理面板与未来13.4，我试图找出为什么我得到一个405错误

export default function NewProduct() {
  const [title, setTitle] = useState('');
  const [description, setDescription] = useState('');
  const[price, setPrice] = useState('');
  async function createProduct(ev) {
    ev.preventDefault();
    const data = {title,description, price};
    //console.log(data)
    await axios.post("/api/products", data);
  }
    return (
        <Layout>
          <form onSubmit={createProduct}>
            <h1>new product</h1>
            <label>Product name</label>
            <input 
              type='text'
              placeholder="product name"
              value={title} 
              onChange={(ev) => setTitle(ev.target.value)}
            />
            <label>description</label>
            <textarea
            placeholder="description"
            value={description}
            onChange={(ev) => setDescription(ev.target.value)}
            />
            <label>
              price (in USD)
            </label>
            <input type="text" placeholder="price"
              value={price}
              onChange={(ev) => setPrice(ev.target.value)}
            />
            <button
             type="submit"
              className="btn-primary">
              Save product
            </button>
          </form>
        </Layout>
    )
}

axios post请求可以工作，但我在开发人员工具中得到了这个：xhr.js：251 POST http：//localhost：3000/api/products 405（Method Not Allowed）
我的API/产品：

export default async function handler(req, res) {
    res.json(req.method)
}