R
R
Ruslan Samara2020-11-01 11:20:16
JavaScript
Ruslan Samara, 2020-11-01 11:20:16

How to send(express) and receive(vuejs) video on js correctly?

There are 2 problems when sending video files from the express.js server to the vue.js frontend.
1. On the frontend, when receiving a video, you have to wait until the video is completely loaded so that it starts playing, but it needs to be played during the receiving process.
Please tell me how to implement splitting the incoming video into chunks.
Now implemented like this:

async selectVideo(day){
                this.videoz=[
                        await (await (await fetch(`http://${this.host}:3000/api/play`, 
                    { 
                        method: 'POST',  
                        headers: {'Accept': 'application/json', 'Content-Type': 'application/json'},
                        body: JSON.stringify({data: day })
                    }))).arrayBuffer()
                ]
                this.$refs.videoRef.src = `${URL.createObjectURL(new Blob(this.videoz))}`;
            },


2. The second problem when sending a video is a post request with parameters for which day to select a video for, the file name is matched and the video is sent. The video is sent, but if you select a video for another day on the front, it will cause an error:
Emitted 'error' event on ReadStream instance at:
    at internal/fs/streams.js:147:14
    at FSReqCallback.oncomplete (fs.js:164:23) {
  errno: -5,
  code: 'EIO',
  syscall: 'open',
  path: '/mnt/mail/videos/cam5_vid_19-11-2020_12-43-52_320x240.mp4'
}

Send code:
router.post('/play', async function(req, res, next) {
// ...
const mimetype = mime.getType(pathToVideo);
    readStream = await fs.createReadStream(pathToVideo);
    res.setHeader('Content-type', mimetype);
readStream.on('open', async function (err) {
      console.log('error ' + err);
      readStream.pipe(res);
    });

Do I understand correctly that we need a middleware to clean up the sent response.
Tell me how it needs to be cleaned, and most likely it should be tied to the session.
Thank you for your help.

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question