Question

我必须使用nodejs下载json文件并做出反应。因此，当用户单击下载按钮时，请求将发送到nodejs，然后我发出一个HTTP请求，将用户，传递和url传递给服务器，以便在服务器上下载json文件，然后在客户端下载此文件

在服务器端下载文件需要将近5分钟，问题是下载文件完成之前出现网络错误：

GET http://127.0.0.1:4000/downloadFile net::ERR_EMPTY_RESPONSE
Error: Network Error
    at createError (createError.js:17)
    at XMLHttpRequest.handleError (xhr.js:80)

单击下载按钮时，在反应侧的此功能称为：

downloadFile() {
    this.setState({ buttonDownloadText: 'Wait ...' })
    axios.get(process.env.REACT_APP_HOST + '/downloadFile')
      .then(resp => {            
        window.open(process.env.REACT_APP_HOST + '/download?namefile=' + resp.data.fileName, '_self')           

        this.setState({ buttonDownloadText: 'Start download' })    

      })
      .catch((error) => {
        console.log(error) //here is where the Network Error is returned
        this.setState({ buttonDownloadText: 'Error. Try again' })
      })
  }

服务器端：

  const http = require('http');
  const fs = require('fs');

    app.get('/downloadFile', function (req, res, next) {
        try {
            const headers = new Headers();
            const URL = env.URL_API + '/api/downloadFile'
            const DOWNLOADURL = env.URL_API + '/api/download'
            headers.set('Authorization', 'Basic ' + base64.encode(username + ":" + password));

            fetch(URL, {
                method: 'GET',
                headers: headers,
            })
                .then(r => r.json())
                .then(data => 
                    fetch(DOWNLOADURL + '/' + data.fileName, {
                        method: 'GET',
                        headers: headers,
                    }).then(result => {   
                                const url = 'http://user:pass@url' + data.fileName
                                const arq = __dirname + '/download/' + data.fileName

                                var file = fs.createWriteStream(arq);
                                http.get(url, function (response) {
                                    response.pipe(file);
                                    file.on('finish', () => file.close(() => res.status(200).send({ file: data.fileName });)) //I have to return the file name to react function
                                });


                            }).catch(error => {
                                logger.error(`${error}`);
                            })
                    })
                        .catch(error => {
                            logger.error(`${error.status || 500} - ${error} - ${req.originalUrl} - ${req.method} - ${req.ip}`);
                            res.sendStatus(500)
                        })
               ....
    });

downloadFile函数必须返回fileName，所以我调用下载路径以在clint一侧进行下载

app.get('/download', function (req, res) {
    try {
        const file = __dirname + '/download/' + req.query.namefile;
        res.download(file);
    } catch (error) {
        logger.error(`${error.status || 500} - ${error} - ${req.originalUrl} - ${req.method} - ${req.ip}`);
    }
});

所以，我的意思是，为什么我的downloadFile路由没有等待下载文件完成返回res.status(200).send({ file: data.fileName })?

Answer 1

由于不能强迫浏览器等待服务器的长时间响应，我建议采用另一种方法：将文件上传到云（例如AWS或Firebase）并返回到客户端的链接。

如果使用Firebase（或其他实时数据库），则服务器可以在文件上传完成后在db中设置一个标志。因此，当文件可供下载时，客户端会异步收到通知。

如何确保已下载文件，然后将响应返回给客户端？

1 个答案: