input file上传文件

Posted 2021-01-14 wangzhichao

如何使用input[type=‘file‘]来上传文件呢？

html：

//angular
<input type="file" (change)="fileChange($event)" placeholder="上传文件">

 

//vue
<input type="file"  @change="fileChange" placeholder="上传文件">

js:

    fileChange(event) {
        let fileList = event.target.files;
        if (fileList.length > 0) {
            let file = fileList[0];
            let formData = new FormData();
            formData.append(‘uploadFile‘, file);
　　　　　　　　//你的post接口，formData发送
            this.upgradeService.postDeviceFile(formData, (res) => {

            })
　　　　　　
        }
    }

serve:

注意这里发送请求的时候需要加上header让其以二进制文件流的形式去发送（formData）

        let headerHttp = new HttpHeaders();
        headerHttp = headerHttp.append(‘Content-Type‘, ‘application/zip‘);
        headerHttp = headerHttp.append(‘Accept‘, ‘application/zip‘);