Загрузка и получение поддельного файла пути

Question

Я загружаю некоторую личную информацию в Mon go DB через Express Server (Node) и React. Проблема в том, что файлы не загружаются в «каталог загрузок» на моем сервере, а в БД я вижу поддельный путь к документу с именем файла. Как я могу получить файл для отображения пользователю? Я могу получить другую личную информацию

Ниже приведены коды Это промежуточное ПО для загрузки

const path = require('path')
const multer = require('multer')

var storage = multer.diskStorage({
destination: function(req, file, cb){
    cb(null, __dirname + '/uploads')
},

filename: function(req, file, cb){
    let ext = path.extname(file.originalname)
    cb(null, Date.now() + ext)
}
})

var upload = multer ({
storage: storage,
fileFilter: function(req, file, callback){
    if(
        file.mimetype == "image/png"  ||
           file.mimetype == "document/pdf"  ||
            file.mimetype == "document/docx"
    ){
        callback(null, true)
    } 
    else{
        console.log('Only png, pdf and Docx FILES ALLOWED')
        callback(null, false)
    }
    },
   limits: {
    fileSize: 1024 * 1024 * 2
   }
  })

Это контроллер добавления проекта

exports.add = (req, res, next) =>{

const { title, category, duration, durationSys, description, budget, addedBy, active,avatar} = req.body
let newProject = new Project({ 
    title, 
    category, 
    duration, 
    durationSys, 
    description,
    budget,
    addedBy,
    active,
    avatar
})
if(req.file){
    newProject.avatar = req.file.path
    }
newProject.save()
.then(response =>{
    res.json({
        message: 'Project added successfully'
    })
.catch(error =>{
    res.json({
        message: 'An error ocurred. Try again'
    })
})
})
};

Это маршрут

 router.post('/addproject', upload.single("avatar"),  add)

Внешний интерфейс

  const Project= ({history}) => {
   const [values, setValues] = useState({
    title: '',
    category: '',
    duration:'',
    durationSys: '',
    description: 'Describe your project vividly here',
    avatar: '',
    active:'true',
    budget:'',
    addedBy: (isAuth().email),
    buttonText: 'Post'
   });


const { title, category, duration, durationSys,description,avatar, 
  active,addedBy, budget, buttonText } = values; 

   const handleChange = name => event => {
    setValues({ ...values, [name]: event.target.value } );
  };

   const clickSubmit = event => {
    event.preventDefault();
    setValues({ ...values, buttonText: 'Posting Project...' });
    console.log(avatar)
    axios({
        method: 'POST',
        url: `${process.env.REACT_APP_API}/addproject`,
        data: { title, category, duration, durationSys, description, 
   avatar, active, addedBy, budget }
    })
        .then(response => {
            console.log('PROJECT ADD SUCCESS', response);
            setValues({ ...values, title: '', category: '',  duration: 
    '', durationSys: '',budget: '', description:'',avatar: '',  
   addedBy: '', buttonText: 'Success' });
            toast.success(response.data.message);
        })
        .catch(error => {
            console.log('PROJECT ADD ERROR', error.response.data);
            setValues({ ...values, buttonText: 'Try Again' });
            toast.error(error.response.data.error);
        });
    };