前端实现点击取消，删除服务器中的图片，避免垃圾资源存在

在vue开发中，有这样一个场景：

`场景`：
    前端用户上传图片---->点击上传后存在了服务器中（这个时候并没有存到数据库）
    ---->用户不点提交反而点取消---->这个时候图片还是存在于服务器中
    ps：这个时候就造成了垃圾资源的存在。

`想要实现的效果`：
    前端点击取消的时候，请求一个接口，删除服务器中的文件

`后端node实现删除接口`
    需要用到 ` fs ` 文件系统
    `fs.unlink(path,callback)`
    看node代码
    //点击取消删除服务器中的图片，避免辣鸡图片资源存在
    router.post('/img/delete', function (req, res) {
        var url;
        var path;
        url = req.body.url; //前端传过来的图片地址，示例：http://xxxxx.com/public/imgages/xxx.png
        sendUrl = url.indexOf("public");//用到js截取，以public截取点
        path = url.substring(sendUrl, url.length);//取后部分包括public
        fs.unlink(path, (err) => {
            if (err) throw err
            res.json({ msg: "文件已删除" })
        })
    });
    注释的已经很清楚了，加油～