Node.js Express Tutorial to Read & Write Stream of Data From Buffer to Server Using Pipes in Browser

Welcome folks today in this blog post we will be looking at how to read and write stream of data from buffer to server using pipes in browser in node.js and express. All the full source code of the application is shown below.

Get Started

In order to get started you need to make a new node.js project and then we need to copy paste the below code inside the index.js file as shown below

index.js

let fs = require('fs')

let data = fs.readFileSync('file.txt','utf-8')

console.log(data)

let fs = require('fs')

let data = fs.readFileSync('file.txt','utf-8')

console.log(data)

So as you can see in the above code we are importing the fs module and then we are using the readFileSync() method to read the entire content of the text file at once and also we are passing the utf-8 encoding type for the plain text. This is not the recommended way to read data as the size of data increases then it will take more time for data fetching.

Using Buffers & Streams

Now to tackle the above problem we can use the concept of buffers to push data inside the memory and create a readable stream from the file.txt and push that data to the writable stream as shown below

let fs = require('fs')

let readStream = fs.createReadStream('file.txt','utf-8')

readStream.on('data',(chunk) => {
    console.log("data chunk")
    console.log(chunk)
})

let fs = require('fs')

let readStream = fs.createReadStream('file.txt','utf-8')

readStream.on('data',(chunk) => {

console.log("data chunk")

console.log(chunk)

})

As you can see we have modified the code to use the createReadStream() method inside the fs module to create the readable stream of the plain text file where small chunks of data will be stored in the form of buffer in the memory and then we have the on() method where we can listen for various events such as data event where this chunk will be returned in the callback function

Similarly we can other events too for error and end event as shown below

readStream.on('end',() => {
    console.log("all content of file is read")
})

readStream.on('error',(err) => {
    console.log("some error takes place " + err)
})

readStream.on('end',() => {

console.log("all content of file is read")

})

readStream.on('error',(err) => {

console.log("some error takes place " + err)

})

Write Streams of Data to File

Now guys we can create the writeStream similarly and push the entire content of the file.txt chunk by chunk to a new output.txt file using the write() method as shown below

let readStream = fs.createReadStream('file.txt','utf-8')
let writeStream = fs.createWriteStream('output.txt')

readStream.on('data',(chunk) => {
    console.log("data chunk")
    console.log(chunk)
    writeStream.write(chunk)
})

let readStream = fs.createReadStream('file.txt','utf-8')

let writeStream = fs.createWriteStream('output.txt')

readStream.on('data',(chunk) => {

console.log("data chunk")

console.log(chunk)

writeStream.write(chunk)

})

Using Pipes to Read & Write Streams

We can use pipes to eliminate the above code to do the task of reading and writing in one line of code as shown below

let readStream = fs.createReadStream('file.txt','utf-8')
let writeStream = fs.createWriteStream('output.txt')

readStream.pipe(writeStream)

let readStream = fs.createReadStream('file.txt','utf-8')

let writeStream = fs.createWriteStream('output.txt')

readStream.pipe(writeStream)

Pushing Stream of Data to Browser

Now we can create a simple express server and push the content of the file.txt file inside the browser using pipes as shown below

const express = require('express')
const app = express()
let fs = require('fs')

let readStream = fs.createReadStream('file.txt','utf-8')

app.get('/',(req,res) => {
    readStream.pipe(res)
})

app.listen(5000)

const express = require('express')

const app = express()

let fs = require('fs')

let readStream = fs.createReadStream('file.txt','utf-8')

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

readStream.pipe(res)

})

app.listen(5000)

node index.js