1***@qq.com
1***@qq.com
  • 发布:2023-05-24 23:50
  • 更新:2023-11-16 17:30
  • 阅读:2862

uni.uploadFile上传本地图片,没有图片后缀名的问题

分类:uni-app

通过本地路径,上传图片到后台,会没有图片的后缀名

  uni.uploadFile({  
    url: 'api地址',  
       filePath:'/static/test.png',  
    name: 'file',  
    formData: {},  
    success: (res) => {  
        console.log(res.data);  
    }  
  });

改为以下代码,思路是把本地图片转成blob,再把blob转成file对象,同时添加文件名带后缀:

    var xhr = new XMLHttpRequest()  
    xhr.open('GET',img)  
    xhr.responseType = "blob";  
    xhr.onload = () => {  
      // 获取返回结果  
        var blob = xhr.response;  
        var file = new File([blob], 'test.jpg')  

  uni.uploadFile({  
    url: 'api地址',   
        file, // 改为file上传  
    name: 'file',  
    formData: {},  
    success: (res) => {  
        console.log(res.data);  
    }  
  });  
    }  

    xhr.send()
0 关注 分享

要回复文章请先登录注册

1***@qq.com

1***@qq.com

``js
//可以用这个image-tools插件
import { pathToBase64 } from 'image-tools'

//base64转换成file对象
dataURLtoFile(dataurl, filename) {
let arr = dataurl.split(',')
let mime = arr[0].match(/:(.*?);/)[1]
let bstr = atob(arr[1])
let n = bstr.length
let u8arr = new Uint8Array(n)
while (n--) {
u8arr[n] = bstr.charCodeAt(n)
}
return new File([u8arr], filename, { type: mime })
},

pathToBase64(url)
.then(async base64 => {
let file = this.dataURLtoFile(base64, new Date().getTime() + '-img.jpg')
uni.uploadFile({
header: { token: token },
url: ''接口", //
filePath: url,
file,
success: res => {
resolve(JSON.parse(res.data))
}
})
})
.catch(error => {
console.error('错误信息', error)
})
``
2023-11-16 17:30
1***@qq.com

1***@qq.com

//可以用这个image-tools插件
import { pathToBase64 } from 'image-tools'
//base64转换成file对象
dataURLtoFile(dataurl, filename) {
let arr = dataurl.split(',')
let mime = arr[0].match(/:(.*?);/)[1]
let bstr = atob(arr[1])
let n = bstr.length
let u8arr = new Uint8Array(n)
while (n--) {
u8arr[n] = bstr.charCodeAt(n)
}
return new File([u8arr], filename, { type: mime })
},
pathToBase64(url)
.then(async base64 => {
let file = this.dataURLtoFile(base64, new Date().getTime() + '-img.jpg')

uni.uploadFile({
header: { token: token },
url: ''接口", //
filePath: url,
file,
success: res => {
resolve(JSON.parse(res.data))
}
})
})
.catch(error => {
console.error('错误信息', error)
})
2023-11-16 17:26
不如摸鱼去

不如摸鱼去

思路不错
2023-05-25 11:58
Diligent_UI

Diligent_UI

提供效果截图和代码截图
2023-05-25 09:12