钉钉内嵌H5遇到的一些问题
基于钉钉内核开发的政务云APP，在里面开发H5应用时会遇到一些莫名其妙的BUG
标题1、React打包H5时，安卓手机白屏的问题。
1、钉钉安卓使用 UC3.0 内核，版本比较低
2、React + Vite + TS 打包的H5应用的安卓端无法正常使用
3、添加 build 配置项
import { defineConfig } from 'vite'
export default defineConfig({plugins: [react(),],// ... otherbuild: {target: ['chrome52'],cssTarget: ["chrome52"]},// ... other
})标题2、ios上传文件上传失败的问题。
1、首先我们需要一个 FormData 对象
2、向 FormData 对象 append 我们需要的数据
3、打印 FormData 对象，比较安卓、H5、ios 之间的差异
4、比较出差异，改造 ios 的 FormData 对象
tips：首先保证谷歌浏览器下 H5 能够正常上传。
const handleUpload = (file: File) => {const formData = new FormData()formData.append('file', file) // 放入 file 文件，第三个参数选传文件名。”file“ 键名因接口而已console.log('formData', formData)console.log('entries', formData.entries)console.log('realFormData', formData.realFormData)const realFormData = formData.realFormData;// 如果存在 realFormData，将传 realFormData 对象，此时需要放入 file 文件// realFormData 是钉钉内核应用在 ios H5中特有的对象，此时需要改造此对象。if(realFormData) {realFormData.append('file', file)}// 返回 Promise 对象return new Promise<ImageUploadItem>((r,j) => {fileUploadApi(realFormData || formData // 传入的 FormData 对象，传入形式因接口而异).then(res => {r({url: res.data.url})}).catch(err => {j('err')throw new Error('Fail to upload')})})}