如何解决自动上传后如何从服务器删除文件
当我选择一个图像时,它会自动上传我想要的图像,然后使用 Node.js 和 Multer 我重命名文件以使其唯一并将其保存到磁盘。但是,一旦上传完成,进度加载器就会变成“X”并且可以删除文件。当我单击该图像时,该图像已从 react 中删除,但仍保留在服务器上。
在反应中:
<FilePond
files={files}
onupdatefiles={setFiles}
allowMultiple={false}
maxFiles={1}
server="http://localhost:8000/api/v1/users/update-avatar"
name="image"
labelIdle='Drag & Drop your files or <span class="filepond--label-action">Browse</span>'
/>
在 Node.js 中
const MIME_TYPE_MAP = {
"image/png": "png","image/jpg": "jpg","image/jpeg": "jpeg",};
const fileUpload = multer({
limits: 500000,storage: multer.diskStorage({
destination: (req,file,cb) => {
cb(null,"uploads/images/");
},filename: (req,cb) => {
const ext = MIME_TYPE_MAP[file.mimetype];
console.log(file);
cb(null,uuidv1() + "." + ext);
},}),fileFilter: (req,cb) => {
const isValid = !!MIME_TYPE_MAP[file.mimetype];
let error = isValid ? null : new Error("Invalid mime type");
cb(error,isValid);
},});
router:
router.post(
"/update-avatar",fileUpload.single("image"),userController.updateAvatar
);
如果我 console.log 'file' 我只会得到下面的内容,因为我重命名了文件。
{
fieldname: 'image',originalname: 'bob.png',encoding: '7bit',mimetype: 'image/png'
}
解决方法
您必须创建一个 revert
api 端点服务器端,您可以通过删除之前上传的文件手动清理。您必须在组件上指定该链接:
<FilePond
server={{
process: {
url: "/api/v1/users/update-avatar"
},revert: {
url: "/api/v1/users/revert-avatar",}
}}
// ...
/>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。