res.download(NodeJS) 未在浏览器上触发下载
res.download(NodeJS) not triggering a download on the browser
我已经为此苦苦挣扎了一段时间,似乎找不到答案,我正在开发一个带有预算选项的网站,我正在从客户端向服务器发送一个对象,并且该服务器正在使用 PDFKit 创建预算的 PDF 版本,创建后我想实际将该 PDF 发送回客户端并触发下载,这就是我所做的
客户端代码:
let data = {
nombre: this.state.name,
email: this.state.email,
telefono: this.state.phone,
carrito: this.props.budget.cart,
subTotal: this.props.budget.subTotal,
IVA: this.props.budget.tax,
total: this.props.budget.subTotal + this.props.budget.tax
}
axios({
method: 'post',
url: 'http://localhost:1337/api/budget',
data: data
})
.then((response) => {
console.log('This is the response', response);
window.open('/download')
})
.catch((error) => {
alert(error);
})
这样数据就完美地进入了我的服务器端代码,它看起来像这样
const pdf = require('pdfkit');
const fs = require('fs');
const path = require('path');
exports.makePDFBudget = (req, res) => {
let myDoc = new pdf;
myDoc.pipe(fs.createWriteStream(`PDFkit/budget.pdf`));
myDoc.font('Times-Roman')
.fontSize(12)
.text(`${req.body.name} ${req.body.phone} ${req.body.email} ${req.body.cart} ${req.body.subTotal} ${req.body.total} ${req.body.tax}`);
myDoc.end()
}
这就是创建我的 PDF,我现在想要的是一旦它被创建并且响应被发送回客户端,客户端打开一个新的 window 和 URL “/download” 设置为下载该 PDF,但由于某种原因没有发生,它打开了新的 window 但下载永远不会开始并且它绝对不会抛出任何错误我是我的节点控制台或浏览器安慰
这就是我将文件发送给客户的方式
const fs = require('fs');
const path = require('path');
exports.downloadPDFBudget = (req, res) => {
res.download(__dirname + 'budget.pdf', 'budget.pdf');
}
这就是我的服务器索引的样子
const bodyParser = require('body-parser');
const express = require('express');
const app = express();
const api = express.Router();
const { makePDFBudget } = require('./PDFkit/makePDFBudget.js');
const { downloadPDFBudget } = require('./PDFkit/downloadPDFBudget.js')
app.use(express.static(__dirname + '/../public'));
app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json({extended: true}));
api.route('/budget')
.post(makePDFBudget)
api.route('/download')
.get(downloadPDFBudget)
app.use('/api', api);
const port = 1337;
app.listen(port);
console.log('Listening on port ', port);
module.exports = app;
我猜主要问题在这里:
res.download(__dirname + 'budget.jpg', 'budget.pdf');
取一个正确的文件名。你的文件是pdf,不是jpg。
在此代码中 res.end(Buffer.from('budget.pdf'))
您发送的是字符串,而不是文件内容。但是headers像你要发送一个文件。
最后一个。您设计的应用程序将只有一个用户。您可以将 userId 添加到文件名中吗?或者使用 DB 存储数据并根据请求生成 pdf,而不将文件存储到文件系统。
我刚刚解决了,我运行客户端的端口和我运行服务器的端口明显不同,所以我不得不打开一个window到我的服务器的端口以触发下载,我意识到这一点,因为我在应该执行 res.download 的功能上扔了一个控制台日志,但它没有出现。谢谢!
我已经为此苦苦挣扎了一段时间,似乎找不到答案,我正在开发一个带有预算选项的网站,我正在从客户端向服务器发送一个对象,并且该服务器正在使用 PDFKit 创建预算的 PDF 版本,创建后我想实际将该 PDF 发送回客户端并触发下载,这就是我所做的
客户端代码:
let data = {
nombre: this.state.name,
email: this.state.email,
telefono: this.state.phone,
carrito: this.props.budget.cart,
subTotal: this.props.budget.subTotal,
IVA: this.props.budget.tax,
total: this.props.budget.subTotal + this.props.budget.tax
}
axios({
method: 'post',
url: 'http://localhost:1337/api/budget',
data: data
})
.then((response) => {
console.log('This is the response', response);
window.open('/download')
})
.catch((error) => {
alert(error);
})
这样数据就完美地进入了我的服务器端代码,它看起来像这样
const pdf = require('pdfkit');
const fs = require('fs');
const path = require('path');
exports.makePDFBudget = (req, res) => {
let myDoc = new pdf;
myDoc.pipe(fs.createWriteStream(`PDFkit/budget.pdf`));
myDoc.font('Times-Roman')
.fontSize(12)
.text(`${req.body.name} ${req.body.phone} ${req.body.email} ${req.body.cart} ${req.body.subTotal} ${req.body.total} ${req.body.tax}`);
myDoc.end()
}
这就是创建我的 PDF,我现在想要的是一旦它被创建并且响应被发送回客户端,客户端打开一个新的 window 和 URL “/download” 设置为下载该 PDF,但由于某种原因没有发生,它打开了新的 window 但下载永远不会开始并且它绝对不会抛出任何错误我是我的节点控制台或浏览器安慰 这就是我将文件发送给客户的方式
const fs = require('fs');
const path = require('path');
exports.downloadPDFBudget = (req, res) => {
res.download(__dirname + 'budget.pdf', 'budget.pdf');
}
这就是我的服务器索引的样子
const bodyParser = require('body-parser');
const express = require('express');
const app = express();
const api = express.Router();
const { makePDFBudget } = require('./PDFkit/makePDFBudget.js');
const { downloadPDFBudget } = require('./PDFkit/downloadPDFBudget.js')
app.use(express.static(__dirname + '/../public'));
app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json({extended: true}));
api.route('/budget')
.post(makePDFBudget)
api.route('/download')
.get(downloadPDFBudget)
app.use('/api', api);
const port = 1337;
app.listen(port);
console.log('Listening on port ', port);
module.exports = app;
我猜主要问题在这里:
res.download(__dirname + 'budget.jpg', 'budget.pdf');
取一个正确的文件名。你的文件是pdf,不是jpg。
在此代码中
res.end(Buffer.from('budget.pdf'))
您发送的是字符串,而不是文件内容。但是headers像你要发送一个文件。最后一个。您设计的应用程序将只有一个用户。您可以将 userId 添加到文件名中吗?或者使用 DB 存储数据并根据请求生成 pdf,而不将文件存储到文件系统。
我刚刚解决了,我运行客户端的端口和我运行服务器的端口明显不同,所以我不得不打开一个window到我的服务器的端口以触发下载,我意识到这一点,因为我在应该执行 res.download 的功能上扔了一个控制台日志,但它没有出现。谢谢!