Tengo un botón en el que el usuario registrado puede descargar un archivo que se almacena en la base de datos y se recupera mediante la reacción del nodo js/express js. Sin autenticación, puedo hacerlo fácilmente con solo una etiqueta. Pero con la autenticación estoy luchando mucho.
Reaccionar:
const handleDownload = async () => { const result = await fetch (process.env.REACT_APP_BACKEND_URL + `/files/download/${props.id}`, { headers: {'Authorization': auth.token} }); const responseData = await result.json(); return responseData; } return ( <button onClick={handleDownload}>Download File</button> )Expresar js:
router.get('/download/:fid', filesControllers.downloadFile); const downloadFile = async (req, res, next) => { const fileId = req.params.fid; let filePost; try { filePost = await File.findById(fileId); } catch (err) { return next(new HttpError("Error", 500)); } console.log(filePost.file); res.download(filePost.file); };soluciones posibles:
desde el lado del backend, deberá hacer algunos cambios, aprenda la autenticación jwt o cualquier otra técnica de autenticación para el backend y asegúrese de que funcione con el frontend
la forma en que funcionará esta aplicación es cuando el usuario no ha iniciado sesión y hace clic en el backend de descarga verifica el token y si el token no es válido o no existe, envía el error a través de la respuesta y el frontend lo muestra en la interfaz de usuario