一、获取签名的URL

 通过后端给的接口拿到已经签名好的文件上传的URL地址

二、读取文件（注：AWS 接受的二进制，不能使用form-data）

// 获取文件二进制    getFileMd5 = (key: string,callback: (value: any)=>void) => {        const log: any = document.getElementById(key)        const file = log.files[0]        const reader = new FileReader();        reader.onload =  () => {            // console.log(reader.result);            callback(reader.result)        }        reader.readAsBinaryString(file)    }

　　要在onload中去执行后续操作，reader.result返回文件的二进制

三、提供接口所需要的header参数以及文件参数

req.setRequestHeader('Content-MD5',md5Base64); req.setRequestHeader('x-amz-acl', 'public-read');

md5Base64 是文件的二进制转base64后的值 1、使用spark-md5将文件转为hash的二进制

import SparkMD5 from 'spark-md5'const binaryFile = SparkMD5.hashBinary(fileValue,true)// fileValue 为上面读取文件的二进制值

　　2、使用base64将二进制转为base64

import Base64 from 'base-64'  const md5Base64 = Base64.encode(binaryFile)// binaryFile 为上面的二进制文件

四、拿到所有所需参数发送请求

$.ajax({            url,            type: "PUT",            data: file, // 源文件

beforeSend: (req) => {                req.setRequestHeader('Content-MD5',md5Base64);                req.setRequestHeader('x-amz-acl', 'public-read');            },            processData: false, // 不想转换数据的时候，需要手动将其设置为false            contentType: false, // 不设置content-type            success:(res) => {                console.log('res',res)                   const obj: any = {}                   // 图片上传成功                   switch(key) {                       case 'mb_banner':                           message.success('banner-mb图片上传成功！')                            obj.mobile_banner_url = url.split('?')[0]                            break                       case 'pc_banner':                            message.success('banner-pc图片上传成功！')                            obj.banner_url = url.split('?')[0]                            break                       case 'icon':                            message.success('分享icon图片上传成功！')                            obj.icon_url = url.split('?')[0]                            break                       default:                            break                   }                   this.props.setBannerImg(obj)            },error: err => {                switch(key) {                    case 'mb_banner':                        message.error('banner-mb图片上传失败！')                        break                    case 'pc_banner':                         message.error('banner-pc图片上传失败！')                         break                    case 'icon':                         message.error('分享icon图片上传失败！')                         break                    default:                         break                }                console.log(err)            }        });

　　file：　//let inputfile: any = document.getElementById(key)

　　　　inputfile = inputfile.files[0]