钉钉IOS-H5微应用FormData无法上传文件问题

NO.1
问题描述

在IOS手机上打开钉钉客户端点击H5微应用上传文件,接口返回上传文件失败

经过charles抓包,发现FormData的数据格式并改变,没有正常上传file文件,服务器无法正常接收和解析,所以报错

正常文件上传

FormData数据

FormData:{
    name:`file.jpg`,
    file:file
}

ios钉钉H5上传文件

FormData数据

FormData:{
    realFormData:{},
    appendData:[]
}

NO.2
解决方案

钉钉ios无法在H5正常上传文件的问题是因为钉钉客户端拦截并修改了FormData的参数格式和内容

axios中有一个transformRequest属性,设置transformRequest后,钉钉发起的请求就不会修改请求的数据了

保险起见,headers的Content-Type属性也建议设置为multipart/form-data,确保文件数据正确

request({
    url: '/api/xxx',
    method: 'post',
    data,
    transformRequest: [],
    headers: {
        'Content-Type': 'multipart/form-data',
    },
})

END.