如何将文件传递给服务器，然后将其发送回客户端？

Question

我目前正在使用ReactJ中的PDF文件，并在我的服务器端修改它们。问题是，我不知道如何将文件数据传递到服务器端，然后将其发送回。

这就是我获取文件的方式：

<div className={"input-file"}>
      <input className="file-upload-field" type="file" accept="application/pdf" onChange={onFileChange}/>
</div>

然后我有

async function modifyPdf(doc, pageNumber) {
  let chemin = [
    `/testun/${doc}`
  ];
  
  await Promise.all(chemin.map(url => {
    fetch(url)
        .then(checkStatus)  // check the response of our APIs
        .then(parseJSON)    // parse it to Json
        .catch(error => console.log('There was a problem!', error))
    }
  ))
  .then(response => {
    newdoc = response[0];
  });

  return doc//newdoc;
} 

问题是，如果我想发送一个URL，那将是本地的，所以节点将无法检索资源（我认为？因为它是blob url），并且是可以通过ArrayBuffer吗？因为当我这样做时，它将[Object ArrayBuffer]作为参数传递给我的路线，因此我真的不知道是否有更好的选择。

谢谢你！

Answer 1

您可以使用 multer 上传文件。您可以从服务器上的目标文件夹或local

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

const app = express();


app.post("/upload", upload.single("productImage"), function (req, res, next) {
  var filename = req.file.filename;

  res.redirect("/public/uploads/" + filename);
});

upload.single（'productImage'）访问输入元素名称，您可以使用 req.file.file.filename

<form action="/upload" method="POST" enctype="multipart/form-data">

    <input type='file' name="productImage" required/>

    <button type="submit">Submit</button>
</form>

之后，您可以访问前端 http：// localhost：3000/uploads/＆lt; filename＆gt;