您现在的位置是:网站首页> 编程资料编程资料
nodejs如何读取文件二进制 前端响应blob或base64显示图片_node.js_
2023-05-24
416人已围观
简介 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事件 以上为个人经验,希望能给大家一个参考,也希望大家多多支持。
您可能感兴趣的文章:
相关内容
- JavaScript中? ?、??=、?.和 ||的区别浅析_javascript技巧_
- 利用nodejs读取图片并将二进制数据转换成base64格式_node.js_
- vue如何修改data中的obj数据的属性_vue.js_
- Node.js定时任务之node-schedule使用详解_node.js_
- 利用JavaScript实现静态图片局部流动效果_javascript技巧_
- Vue中判断语句与循环语句基础用法及v-if和v-for的注意事项详解_vue.js_
- vue如何使用cookie、localStorage和sessionStorage进行储存数据_vue.js_
- vue多次打包后出现浏览器缓存的问题及解决_vue.js_
- js 通过Object.defineProperty() 定义和控制对象属性_javascript技巧_
- vue中的cookies缓存存值方式 超简单_vue.js_
