您现在的位置是:网站首页> 编程资料编程资料

nodejs如何读取文件二进制 前端响应blob或base64显示图片_node.js_

2023-05-24 414人已围观

简介 nodejs如何读取文件二进制 前端响应blob或base64显示图片_node.js_

读取文件二进制 前端响应blob或base64显示图片

express 框架 nodejs

var express = require('express') var app = express(); var fs = require('fs') var http = require('http').createServer(app); app.get('/send',async (req, res) => {   res.setHeader('Access-Control-Allow-Origin','*');   function read () {     return new Promise((resolve, rejects) => {       fs.readFile('./public/2020.jpg',function(err, data) {         resolve(data)         rejects(err)       })     })   }   let data = await  read()   res.send(data) }) http.listen(3000, () => {   console.log('listening on *:3000'); });app.get('/send',async (req, res) => {   res.setHeader('Access-Control-Allow-Origin','*');   function read () {     return new Promise((resolve, rejects) => {       fs.readFile('./public/2020.jpg',function(err, data) {       // 可以更换不同文件 图片 或者 文档 等等 前端接受的时候 对应就ok         resolve(data)         rejects(err)       })     })   }   let data = await  read()   res.send(data) }) http.listen(3000, () => {   console.log('listening on *:3000'); })

前端响应接受 使用了vue脚手架

精简版

function base (blob) {       var read = new FileReader()       read.readAsDataURL(blob)       read.onload = function (x) {         console.log(x.target.result)         var body = document.body       var a = document.createElement('a')       a.setAttribute('download', '1.pdf')       a.setAttribute('href', x.target.result)       body.appendChild(a)       a.click()       }     }     fetch('http://localhost:3000/send').then(x => x.blob()).then(x => {       console.log(x)       var body = document.body       var a = document.createElement('a')       // var url = window.URL.createObjectURL(new Blob([x]))       base(new Blob([x]))       // a.setAttribute('download', '1.pdf')       // a.setAttribute('href', url)       // body.appendChild(a)       // a.click()     })

nodejs读取文件 createReadStream

参数:

  • 第一个参数:读取文件的路径
  • 第二个参数:highWaterMark 最高水位线,默认最多读取64K

读取的内容都是buffer类型

返回的结果是一个可读流的实例,是非流动模式–我们最后要转化为流动模式

let rs=fs.createReadStream('./1.txt',{highWaterMark:1})

设置最高水位线每次读取1k

let fs=require("fs"); // 第一个参数,读取文件的路径 //第二个参数 highWaterMark 最高水位线,默认最多读取64K //读取的类容都是buffer类型 //返回的结果是一个可读流的实例,是非流动模式---我们最后要转为流动模式 // 转流动模式需要on事件监测 let rs=fs.createReadStream('./1.txt',{highWaterMark:1}) //在内部不断触发rs.emit('data',数据);data不能更改,留动模式开启后,数据会疯狂触发data事件 let arr=[]; rs.on('data',function (chunk) { //chunk是buffer类型 arr.push(chunk); }) //监听文件读取完毕,会自动触发一次end事件,没有读取完是不会触发的 //Buffer.concat合并小buffer rs.on('end',function (chunk) { console.log( Buffer.concat(arr).toString()); }) // 监听错误 rs.on('error',function (err) { console.log(err); }) // rs.resume() 恢复读取 // rs.pause() 暂停读取 //这两个都控制是否继续触发data事件 

以上为个人经验,希望能给大家一个参考,也希望大家多多支持。 

-六神源码网