Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/24.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Reactjs Express+;React | Googleapis-下载文件_Reactjs_Express_Frontend_Backend_Drive - Fatal编程技术网

Reactjs Express+;React | Googleapis-下载文件

Reactjs Express+;React | Googleapis-下载文件,reactjs,express,frontend,backend,drive,Reactjs,Express,Frontend,Backend,Drive,我是React组件的新手,我试着从我的google drive文件夹下载文件,在很长一段时间后,我一直在使用我的API来上传和获取文件。我的问题是,我应该如何传递数据以下载前端上的文件 如何从我的谷歌硬盘中获取文件,并在react组件上下载 提前谢谢,很抱歉我的解释,我不知道我目前正在做什么与文件 注意:这段代码只是下载图像的示例,我想传递一个文件ID来下载任何东西,PDF、文档、png等等 更新:在Triing differents solutions之后,我的api函数完成如下: goog

我是React组件的新手,我试着从我的google drive文件夹下载文件,在很长一段时间后,我一直在使用我的API来上传和获取文件。我的问题是,我应该如何传递数据以下载前端上的文件

如何从我的谷歌硬盘中获取文件,并在react组件上下载

提前谢谢,很抱歉我的解释,我不知道我目前正在做什么与文件

注意:这段代码只是下载图像的示例,我想传递一个文件ID来下载任何东西,PDF、文档、png等等


更新:在Triing differents solutions之后,我的api函数完成如下:

google_Ctrl.getDownload = async(req, res) => {
    console.log(req.params);
    let Google = await drive.files.get(
        {fileId: req.params.id,
        alt: 'media'},
        { responseType: 'stream' }
    ).then((request) => {
        console.log(request);
        fileType = request.headers['content-type'];
        fileName = ( "file" + '.' + fileType );
        fileData = request.data;
        res.set(request.headers)
        // res.set("Content-Type", fileType);
        // res.set("Content-Disposition", "attachment; filename='archivo.png'");
        fileData.pipe(res)
        
    });
}
我的函数当前正在工作,当我使用api.rest发送GET请求时,他们会提供我的文件。但现在我的问题是关于React组件,我读了很多帖子,但我没有找到解决方案,我目前正在使用downloadjs尝试,但没有成功

const DownloadFile = () => {
        axios.get(process.env.REACT_APP_API_URL + 'google/download/' + "1YtDWD9hNEgCUi8YGQPjV98sULhyM5m8C")
            .then((res) => {
                console.log(res);
                // res.blob()
                // fileDownload(res.data, 'filename.png');
                download(res.data, "file.png", res.headers['content-type']);
            }).catch((error) =>{
                console.error(error);
                message.error('upload failed.');
        });
    }
这是我在React组件上的下载功能,我的.txt文件可以工作,但当我尝试下载pdf、文档、xlsx等文件时,我能做什么? 使用Api.rest,我测试了我的Api函数,它运行正常,我可以从Api.rest下载我的文件,但我想我的react函数显然格式不好


好的,在长时间检查代码后,我在React函数中发现了错误,如果有人处于相同的位置,代码如下:

API谷歌:

google_Ctrl.getDownload = async(req, res) => {
    console.log(req.params);
    console.log(req.body);
    let Google = await drive.files.get(
        {fileId: req.params.id,
        alt: 'media'},
        { responseType: 'stream' }
    ).then((request) => {
        console.log(request);
        fileType = request.headers['content-type'];
        fileName = ( "file" + '.' + fileType );
        fileData = request.data;
        // res.set(request.headers)
        console.log(fileType);
        res.set("Content-Type", fileType);
        res.set("Content-Disposition", "attachment; filename='archivo.png'");
        fileData.pipe(res)
        
    });
}
反应组分:

const DownloadFile = () => {
        axios.get(process.env.REACT_APP_API_URL + 'google/download/' + "1YtDWD9hNEgCUi8YGQPjV98sULhyM5m8C", 
        {responseType: 'blob'})
            .then((res) => {
                console.log(res);
                // res.blob()
                fileDownload(res.data, 'filename.png');
                // download(res.data, "file.pdf", res.headers['content-type']);
            }).catch((error) =>{
                console.error(error);
                message.error('upload failed.');
        });
    }
下一步是发送文件ID、文件名和扩展名,并在收到时使用该名称/扩展名正确保存文件:D