基于Umi 上传文件和下载文件

对于封装的request请求，已经封装好的工具，下载时会将后端返回的二进制流自动通过返回拦截，转换为下载的文件

1-在服务请求的文件内，创建请求数据的函数

`
//某个请求下载
export async function download(options) {
  try {
    let response = await request.get('/noapproval/downLoadFile', {
      params: options,
      download: true, //添加下载标识
    });
    return response;
  } catch (err) {
    return err;
  }
}

`

2-当需要使用时，需要引入函数

` 
import * as pendingApprovalServe from '@/services/supplyDemandApproval/pendingApproval'; 


     <a onClick={() => openDown(recordId) }>
        点击即可下载  
     </a>                           
                                  
                                    
     const openDown = (recordId) => {
        pendingApprovalServe.download({ recordId });
     };                          

`

对于上传文件，是通过对antdesign组件的upLoad组件

1-对组件进行使用

    `
       <Upload {...props}>
          <Button>
             <Icon type="upload" /> 上传
          </Button>
        </Upload>                         

    `
    

2-对props进行规范

`
    const props = {
       action: '/api/noapproval/uploadFile',  //请求的地址

        onChange(info) {
          if (info.file.status !== 'uploading') {
            console.log(info.file, info.fileList);
          }
          if (info.file.status === 'done') {  //这里是文件上传完毕
            setPathData(info.file.response.data.path);
            setReNameData(info.file.response.data.realName);
            console.log(info.file, 'ssssssssssssssssssssssssssssss');
            message.success(`${info.file.name} file uploaded successfully`);
          } else if (info.file.status === 'error') {
            message.error(`${info.file.name} file upload failed.`);
          }
          },
     };
`

这里踩的坑，首先是请求的地址，这个地址需要在后端提供的接口上加上api，因为使用了proxy代理，如果没有加上api虽然在netWork上能看的见请求的地址，返回状态也是200ok，但后端根本就没有收到请求，点击也不会下载
服务器代理的api是识别标识，是先找到api这个标识然后再让api为空，如果请求的时候不加api，游览器根本找不到这个标识，所以需要加上api。
然后是在上传文件后，后端会返回我们文件名，和文件路径，我们需要拿到这些数据，再当做参数发送给后端，在onChange函数中有文件上传完毕的调用，里面有response，在这里面可以拿到返回的数据

3-服务器代理

    `
      proxy: {
        '/api': {
          target: 'http://10.160.1.149:8090/gsgx/',  //在这里可以切换环境
          changeOrigin: true,
          pathRewrite: { '^/api': '' },  //取消api
        },
      },
    `