如何使用 Laravel api 在 axios 中发送多部分数据

Question

我正在使用 axios.post 方法将数据发送到服务器。 我制作了幼虫 api。 当我检查 postman 中的 api 时，它工作正常。 但是当我在前端连接 api 时，它会将所有数据发送到后端，除了我的图像文件。 下面我提到了将图像文件发送到服务器的代码。 请仔细检查我的代码并帮助我找出我做错的地方。 两天以来我一直在这个问题上。

 frontEnd code

  const params = useParams();
  const { some } = params;

  const [name, setName] = useState("");
  const [school, setSchool] = useState("");
  const [author, setAuthor] = useState("");
  const [grade, setGrade] = useState("");
  const [Extra, setExtra] = useState("");
  const [image, setImage] = useState("");

 
  if (some === "book") {
    const handleSubmit = async (e) => {
   e.preventDefault();
  const formData = new FormData();
  formData.append("image", image);
  if (image == null) return image;
  console.log(image, name)

  const token = localStorage.getItem("Token")
  console.log(token)


  try {
    const res = await axios.post(
      `http://127.0.0.1:8000/add-product`,



      {
        formData,

        product_name: name,
        product_auther: author,
        school_name: school,
        class: grade,
        product_image: image,
        category_id: "17"



      },
      {
        headers:

          { "Authorization": `Bearer ${token}` },
          'Content-Type': 'multipart/form-data'   ,
      }



    ).then((res) => {
      console.log("usman    ", res)
    });
    console.log()

   } catch (error) {
    if (error.request) {
      console.log(error.response);

    } else if (error.request) {
      console.log("network error");
    } else {
      console.log("CBM", { error });
    }
  }
}

return (
  <div className="container " style={{ background: "white" }}>
    <br>
    </br>
    <form onSubmit={handleSubmit} >
      <div className="mb-3">
        <label htmlFor="exampleInputEmail1" className="form-label"> Name</label>
        <input type="text" value={name} onChange={(e) => setName(e.target.value)} className="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" />
      </div>
      <div className="mb-3">
        <label htmlFor="exampleInputPassword1" className="form-label">Author</label>
        <input type="text" value={author} onChange={(e) => setAuthor(e.target.value)} className="form-control" id="exampleInputPassword1" />
      </div>
      <div className="mb-3">
        <label htmlFor="exampleInputPassword1" className="form-label">image</label>
        <input type="file" onChange={(e) => setImage(e.target.files[0])} className="form-control" id="exampleInputPassword1" />
      </div>
      <div className="mb-3">
        <label htmlFor="exampleInputPassword1" className="form-label">School Name</label>
        <input type="text" value={school} onChange={(e) => setSchool(e.target.value)} className="form-control" id="exampleInputPassword1" />
      </div>
      <div className="mb-3">
        <label htmlFor="exampleInputPassword1" className="form-label">Grade(Class)</label>
        <input type="text" value={grade} onChange={(e) => setGrade(e.target.value)} className="form-control" id="exampleInputPassword1" />
      </div>
      <div className="mb-3">
        <label htmlFor="exampleInputPassword1" className="form-label">Any Extra Information</label>
        <input type="text" value={Extra} onChange={(e) => setExtra(e.target.value)} className="form-control" id="exampleInputPassword1" />
      </div>

      <button type="submit " className="btn btn-primary d-flex mx-auto" style={{ background: "black" }}>Submit</button>
    </form>
  </div>
)

}

 Laravel API

 public function store(Request $request){ $product = new product; $product->category_id = $request->category_id; $product->product_name = $request->product_name; $product->product_image = $request->file('image')->store('p_imges'); $product->product_quantity = $request->product_quantity; $product->product_price = $request->product_price; $product->product_auther = $request->product_auther; $product->class = $request->class; $product->school_name = $request->school_name; $product->gender = $request->gender; $product->F_xyz = $request->F_xyz; $product->size = $request->size; $product->xtra_info = $request->xtra_info; $product->doner_id = Auth::id(); $product->save(); $product = ["Product Successfully Added"]; return $product; }

错误发生此错误