js 原始文件上传

单文件上传

1.原始表单上传
<form action="api" method="post"  enctype="multipart/form-data" >
    <input type="file" name="file"/>
    <input type="submit" class="submit" value="上传">
</form>

2.ajax上传
function fileUpload(){
	let file_obj = document.getElementById('file')
    let file = file_obj.files[0];
    let form = new FormData();
    form.append("file", file);
    let xhr = new XMLHttpRequest();
    xhr.open("POST", 'http://*****');
    xhr.send(form); 
    xhr.onreadystatechange = ()=>{
      if(xhr.readyState==4 && xhr.status==200){
        let res = JSON.parse(xhr.responseText);
      }
    }
    xhr.onerror=()=>{}
    /**
    xhr.onload = ()=>{
     let res = JSON.parse(xhr.responseText);
	}
    **/

}

2.多文件上传

1.表单上传
<form action="api.url" method="post"  enctype="multipart/form-data" >
    <input type="file" name="file[]"  multiple="multiple" />
    <input type="submit" class="submit" value="上传">
</form>

2.ajax上传
function fileUpload(){
	let file_obj = document.getElementById('file')
    let files = file_obj.files;
    let form = new FormData();
    files.forEach(item=>{
    	form.append("file[]", item);
    })
    let xhr = new XMLHttpRequest();
    xhr.open("POST", 'http://*****');
    xhr.send(form); 
    xhr.onreadystatechange = ()=>{
      if(xhr.readyState==4 && xhr.status==200){
        let res = JSON.parse(xhr.responseText);
      }
    }
    xhr.onerror=()=>{}
    /**
    xhr.onload = ()=>{
     let res = JSON.parse(xhr.responseText);
	}
    **/

}