文件流下载

第一步 安装依赖

npm install express

npm install cors

第二步 node的index.js文件的代码

import express from 'express'

import cors from 'cors'

import fs from 'fs'

import path from 'path'

const app = express()

app.use(cors())

app.use(express.join())

app.post('/download',(req,res)=>{

    const fileName = req.body.fileName

    const filePath = path.join(process.cwd(),'static',fileName)

    const content = fs.readFileSync(filePath) // 返回是一个二进制流

    res.setHeader('Content-Type':'application/octet-stram') // 二进制流的意思

    res.setHeader('Content-Disposition','attachement;filename='+fileName)//这里是下载

    res.sned(content)


})

app.listen(3000,()=>{console.log('http://localhost:3000')})

第三步 前端的代码：

 

const btn =  document.getElementByid('btn')

btn.addEventListener('click',function(){


    fetch('http://localhost:3000/download',{

        method:'POST',

        body：JSON.stringfy({

            fileName:'1.png'
        }),

        header:{
            
            "Content-Type":"application/json"
        }
    }).then(res=>res.arrayBuffer()).then(res=>{


            // 需要将二进制流转化为Blob

        const blob = new Blob（[res],{type:'image/png'}） // 指定类型

        const url = URL.createObjectURL(blob) // 将blob转化为一个url的链接

        //创建a标签 模拟点击下载

        const a = document.createElement('a')

        a.href = url

        a.download = '1.png'

        a.click()

  
    })

})