Axios 错误:请求失败,状态码为 404

时间:2021-06-28 19:07:01

标签: node.js reactjs axios

首先,我有一个项目需要将图像发送到 AWS S3 存储桶 .. 所以我首先需要将图像从前端发送到后端,所以我使用 Axios 来做到这一点.. 但现在我需要将此代码复制到我的新应用程序中,因此我首先测试了我的旧应用程序并且它成功运行了..但是当我创建该新应用程序时,它向我显示了该错误。 enter image description here

听起来像我给错的路线,但我检查了很多次它根本没有错 这是我的前端代码

import { useState } from 'react'
import axios from 'axios'


async function postImage({image, description}) {
  const formData = new FormData();
  formData.append("image", image)
  formData.append("description", description)

  const result = await axios.post('/images', formData, { headers: {'Content-Type': 'multipart/form-data'}})
  .catch(function (error) {
    console.log(error);
  });
  return result.data
}


function Image() {

  const [file, setFile] = useState()
  const [description, setDescription] = useState("")
  const [images, setImages] = useState([])

  const submit = async event => {
    event.preventDefault()
    const result = await postImage({image: file, description})
    setImages([result.image, ...images])
  }

  const fileSelected = event => {
    const file = event.target.files[0]
        setFile(file)
    }

  return (
    <div className="App">
      <form onSubmit={submit}>
        <input onChange={fileSelected} type="file" accept="image/*"></input>
        <input value={description} onChange={e => setDescription(e.target.value)} type="text"></input>
        <button type="submit">Submit</button>
      </form>

    </div>
  );
}

export default Image;

我发现的错误是

Error: Request failed with status code 404
    at createError (createError.js:16)
    at settle (settle.js:17)
    at XMLHttpRequest.handleLoad (xhr.js:62)

这是我的后端代码

const express = require("express");

const fs = require("fs");
const util = require("util");
// const unlinkFile = util.promisify(fs.unlink);
const path = require("path");

const multer = require("multer");
const upload = multer({ dest: "uploads/" });
// const { uploadFile, getFileStream } = require("./s3");

const app = express();
  app.post('/images', upload.single('image'), async (req, res) => {
    // const file = req.file
    console.log(file)
  
  })

const port = process.env.PORT || 5000;
app.listen(port);

console.log("App is listening on port " + port);

0 个答案:

没有答案