js post提交图片上传

<form id="uploadForm" enctype="multipart/form-data">
  <input type="file" id="fileInput" name="file" />
  <button type="submit">上传</button>
</form>

document.getElementById('uploadForm').addEventListener('submit', function(event) {
  event.preventDefault();
  const formData = new FormData();
  const fileInput = document.getElementById('fileInput');
  const file = fileInput.files[0];
  formData.append('file', file);

  fetch('/upload', {
    method: 'POST',
    body: formData
  })
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));
});

const express = require('express');
const multer = require('multer');
const upload = multer({ dest: 'uploads/' });

const app = express();

app.post('/upload', upload.single('file'), (req, res) => {
  res.json({ message: '文件上传成功', filename: req.file.filename });
});

app.listen(3000, () => {
  console.log('服务器运行在 http://localhost:3000/');
});

app.use((req, res, next) => {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
  next();
});

const upload = multer({ dest: 'uploads/', limits: { fileSize: 5 * 1024 * 1024 } });

const fileFilter = (req, file, cb) => {
  if (file.mimetype === 'image/jpeg' || file.mimetype === 'image/png') {
    cb(null, true);
  } else {
    cb(new Error('只允许上传JPEG和PNG格式的图片'), false);
  }
};

const upload = multer({ dest: 'uploads/', fileFilter });