获取multipart/form-data请求

简单创建个表单，提交文本信息和文件

在服务器端处理一下请求，首先通过字符串打印收到的结果

创建一个txt文本文件，输入内容test，回车，abc，回车，2333333，通过选择文件按钮进行上传，查看收到的结果

分析multipart/form-data数据

1. 肉眼可见的，数据一共分为三块，正好对应用户名、密码、文件
   而------WebKitFormBoundaryy0cQW9RwXspsKmbj是分隔符

2. 不妨用<分隔符>代替------WebKitFormBoundaryy0cQW9RwXspsKmbj是分隔符

<分隔符>
Content-Disposition: form-data; name="user"

xiaoming
<分隔符>
Content-Disposition: form-data; name="password"

123456
<分隔符>
Content-Disposition: form-data; name="file"; filename="1.txt"
Content-Type: text/plain

test
abc
2333333
<分隔符>--//两个--代表数据结束

3. 注意每行末尾都有\r\n（http协议规定换行方式）

<分隔符>\r\n
Content-Disposition: form-data; name="user"\r\n
\r\n
xiaoming\r\n
<分隔符>\r\n
Content-Disposition: form-data; name="password"\r\n
\r\n
123456\r\n
<分隔符>\r\n
Content-Disposition: form-data; name="file"; filename="1.txt"\r\n
Content-Type: text/plain\r\n
\r\n
test
abc
2333333\r\n
<分隔符>--\r\n

4. 将数据描述、数据值、文件内容用文字替换，将这些东西归到<分隔符>行上

<分隔符>\r\n<数据描述>\r\n\r\n<数据值>\r\n
<分隔符>\r\n<数据描述>\r\n\r\n<数据值>\r\n
<分隔符>\r\n<数据描述1>\r\n<数据描述2>\r\n\r\n<文件内容>\r\n
<分隔符>--\r\n

5. 用"<分隔符>"切开数据产生数组(split)

空，
\r\n<数据描述>\r\n\r\n<数据值>\r\n，
\r\n<数据描述>\r\n\r\n<数据值>\r\n，
\r\n<数据描述1>\r\n<数据描述2>\r\n\r\n<文件内容>\r\n，
--\r\n

6. 丢掉头尾项(空和--\r\n) 和 每一项的头尾\r\n

<数据描述>\r\n\r\n<数据值>\r\n，
<数据描述>\r\n\r\n<数据值>\r\n，
<数据描述1>\r\n<数据描述2>\r\n\r\n<文件内容>\r\n

7. 用第一次出现的\r\n切分，因为文件内容中可能也有\r\n，所以用第一次的

普通数据:[数据描述，数据值]
或
文件数据:[数据描述1\r\n数据描述2，<文件内容>]

8. 根据描述的里面有无"\r\n"

没有——普通数据:[数据描述，数据值]
有——文件数据:[数据描述1\r\n数据描述2，<文件内容>]

切分multipart/form-data数据

可以看到，上述步骤中，有好几次切分操作，但是node没有split方法，需要手动写

Buffer.prototype.split = Buffer.prototype.split || function(b){
    let arr = [];

    let cur = 0;//开始切割的下标
    let n = 0;//切割项的下标
    while((n = this.indexOf(b,cur)) != -1){//找到切割项的时候
        arr.push(this.slice(cur,n))//从开始切割的下标，到当前切割项之间的内容
        cur = n + b.length;//开始切割下标要加上切去的内容
    }

    arr.push(this.slice(cur));
    return arr;
}

在node里正式解析multipart/form-data数据

这种处理方式是等到所有数据都接收到才开始处理(req.on('end')之后处理的数据 )，会导致所有数据堆到内存里

const http = require('http');
const common = require('./libs/common')
const fs = require('fs')
const { v4: uuid } = require('uuid');

let server = http.createServer((req,res)=>{
    let arr = []
    req.on('data',data=>{
        arr.push(data)
    })
    req.on('end',end=>{
        let data = Buffer.concat(arr)

        //解析二进制文件上传
        let post = {};//普通数据
        let files = {};//文件数据
        if(req.headers['content-type']){
            let str = req.headers['content-type'].split('; ')[1];//获取content-type的后一个参数
            if(str){
                let boundary = '--' + str.split('=')[1];//获取分隔符

                //1.切分数据
                let arr = data.split(boundary);
                
                //2.丢弃头尾数据
                arr.shift()
                arr.pop()

                //3.丢弃每个数据头尾的\r\n
                arr = arr.map(buffer => buffer.slice(2,buffer.length - 2));
                
                //4.每个数据在第一个\r\n处切成两半  
                arr.forEach(buffer => {
                    let n = buffer.indexOf('\r\n\r\n');

                    let disposition = buffer.slice(0,n);//content-Disposition部分
                    let content = buffer.slice(n + 4);//内容部分

                    disposition = disposition.toString();
                    
                    if(disposition.indexOf('\r\n') == -1){
                        //Content-Disposition: form-data; name="user"\r\n
                        content = content.toString();

                        let name = disposition.split('; ')[1].split('=')[1];//拿到"user"
                        name = name.substring(1,name.length - 1);
                        post[name] = content;
                    }else{
                        //Content-Disposition: form-data; name="file"; filename="1.txt"\r\n
                        //Content-Type: text/plain
                        let [line1,line2] = disposition.split('\r\n');
                        let [,name,filename] = line1.split('; ');
                        let type = line2.split(': ')[1];

                        name = name.split('=')[1]
                        name = name.substring(1,name.length - 1);

                        filename = filename.split('=')[1]
                        filename = filename.substring(1,filename.length - 1);

                        let path = `upload/${uuid().replace(/-/g,'')}`//文件路径

                        fs.writeFile(path,content,err=>{
                            if(err){
                                console.log('文件写入失败',err);
                            }else{
                                files[name] = {filename,path,type};
                                console.log(files)
                            }
                        })

                        res.end()
                    }
                });
            }
        }
        
    })
})

server.listen(5000)