Отображать PDF-файл в ReactJS, полученный с сервера Node.js?
Я пытаюсь создать систему, в которой пользователь может хранить pdf-файлы на сервере, а другой пользователь может просматривать эти pdf-файлы, просто щелкнув ссылку на файл.
Я пытаюсь сохранить файл в базе данных MySQL и получить его с помощью app.get(). Я успешно сохранил файл в базе данных с помощью BLOB, но когда я пытаюсь его получить, он находится в другом формате.
Я также пытался сохранить файл в локальной папке ./uploads, используя «экспресс-загрузку файла», но это также не работает, когда я пытаюсь получить местоположение файла. После получения местоположения файла я отправляю его обратно в свое приложение React, а затем пытаюсь открыть его с помощью тегов embed и iframe.
Я также пробовал «реагировать-pdf», «просто-реагировать-pdf», но ничего не работает.
Ниже приведен код, написанный на стороне сервера, который отправляет файл PDF. Я также попытался отправить местоположение файла PDF, который хранится в месте, указанном в приведенном ниже коде. Но это тоже не работает.
app.get('/getFile', (req, res) => {
const {email, courseid, filename} = req.query;
console.info(email);
console.info(courseid);
console.info(filename);
var filePath = `${__dirname}`+'/uploads/'+`${filename}`;
fs.readFile(filePath , function (err,data){
console.info(data);
res.contentType("application/pdf");
res.send(data);
});
});
Теперь я поделился кодом выше.
Ответы 1
Это сработало для меня:
Узел:
app.get("/getFile", function(req, res) {
res.sendFile(__dirname + "/test.pdf");
});
Реагировать:
axios(`http://localhost:5000/getFile `, {
method: "GET",
responseType: "blob"
//Force to receive data in a Blob Format
})
.then(response => {
//Create a Blob from the PDF Stream
const file = new Blob([response.data], {
type: "application/pdf"
});
//Build a URL from the file
const fileURL = URL.createObjectURL(file);
//Open the URL on new Window
window.open(fileURL);
})
.catch(error => {
console.info(error);
});
не могли бы вы поделиться своим файлом server.js ??