使用 ajax 处理附件

问题描述

警告： 我正在制作一个 youtube 视频下载器。我制作此内容仅用于教育目的，无意将其用于任何盗版/非法目的。

好的，问题来了。我有一个运行脚本的 Node.js express 服务器，这样当你向它发送 get 请求时，它要么发送一些包含错误代码和内容的 JSON，要么发送一个 mp3 或 mp4 文件。我没有所有代码，这是代码：

// Import some libraries
const express = require('express')
const ytdl = require('ytdl-core')
const cp = require('child_process')

var app = express()

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

     const url = req.query.url
    
    if (url == null) {
        res.header('Access-Control-Allow-Origin','*')
        res.send({err: 'URLNULL',errCode: 1})
        return;
    }
    if (!ytdl.validateURL(url)) {
        res.header('Access-Control-Allow-Origin','*')
        res.send({err: 'INVALIDURL',errCode: 1})        
        return;
    }
    if (req.query.audioonly == 'true') {
        const title = (await ytdl.getBasicInfo(url)).videoDetails.title
    
        const audio = ytdl(url,{
            quality: 'highestaudio'
        }).on('error',(err) => {
           
            if (err.message == 'unable to get local issuer certificate') {
                res.send({err: 'CERTERR',errCode: 1})
                return;

            } else {
                res.send({err: err.message,errCode: 2})
            }
            
        })
        var ffmpegProcess = cp.spawn('ffmpeg',[
            '-hide_banner','-loglevel','fatal','-i','pipe:3','-f','mp3','pipe:1'
        ],{
            stdio: [
                'inherit','pipe','inherit',]
            
        })
        audio.pipe(ffmpegProcess.stdio[3])
        res.header( 'Access-Control-Allow-Origin','*');
        res.header('Content-Type','audio/mp3')
        res.header('Access-Control-Expose-Headers','Content-disposition')
        res.header('Content-disposition',`attachment; filename=${title}.mp3`)
        ffmpegProcess.stdout.pipe(res)


    } else {
        const title = (await ytdl.getBasicInfo(url)).videoDetails.title
    const video = ytdl(url,{
        quality: 'highestvideo'
    })
    const audio = ytdl(url,{
        quality: 'highestaudio'
    })
    var ffmpegProcess = cp.spawn('ffmpeg',[
        '-hide_banner','pipe:4','-map','0:v','1:a','-c','copy','-movflags','frag_keyframe+empty_moov','mp4','pipe:1',],{
        stdio: [
            'inherit',]
    })

    video.pipe(ffmpegProcess.stdio[3])
    audio.pipe(ffmpegProcess.stdio[4])
    res.header( 'Access-Control-Allow-Origin','*');
    res.header('Content-Type','video/mp4')
    res.header('Access-Control-Expose-Headers','Content-disposition')
    res.header('Content-disposition',`attachment; filename=${title}.mp4`);
    
    ffmpegProcess.stdout.pipe(res)
    }
    
})

app.listen(4443)

当我发送 GET 请求时，错误内容工作正常，但我似乎无法找到一种正确的方式来下载 mp3/mp4。这是我当前的前端 js 函数向我的服务器发送请求。

function dlmp3() {
    if (input.value == null) {
        //Todo: Handle error
    }


    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        var binaryData = [];
        binaryData.push(this.response);
        var fileName = this.getResponseHeader("Content-disposition") //if you have the fileName header available
        console.log(fileName)
        var link=document.createElement('a');
        link.href=window.URL.createObjectURL(new Blob(binaryData,{type: "audio/mp3"}));
        link.download=fileName;
        link.click();
        link.remove()
      }
    };
    xhttp.open("GET",`http://localhost:4443/download?url=${input.value}&audioonly=true`,true);
    xhttp.send();
}

这是一种相当粗略的做法，但这是它做某事的唯一方式（当然，吐槽错误除外）。它确实下载了某些东西，但是当我从浏览器转到 express /download 链接时，mp3 比实际大小多 300 kb。此外，它是腐败的。有没有更好的方法来下载附件（我可以使用 Ajax 以外的其他东西）？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）