收藏
回答

部分手机上传图片选择图片之后点击上传没上传成功?

部分手机上传图片选择图片之后点击上传没上传成功

async upfile() {

let that = this

if (that.limit != null && !isNaN(that.limit)) {

if (that.limit >= 1) {

uni.showToast({

title: '已达到最大上传数量',

icon: 'none'

});

return;

}

}

let temps = await that.getURLInfo();


let Crop = await that.getCropimage(temps);


let imgInfo = await that.getImgInfo(Crop.tempFilePath); // 获取图片信息

//

let ctxInfo = await that.contraction(imgInfo, 'myCanvas'); // 图片压缩

//上传


that.url = ctxInfo.tempFilePath

that.urlShow = true

//base64

pathToBase64(that.url)

.then(base64 => {

this.Qualificationcertificate.ryzp = base64.split(',')[1]


})

.catch(error => {


})

},

//调用摄像头和图库获取路径

async getURLInfo() {

try {


let image = await new Promise((resolve, reject) => {

uni.chooseMedia({

count: 1, // 默认9

sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有

sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有

success: function(res) {

// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片

resolve(res)

},

fail(err) {

reject(err)

}

})

})

return image

} catch (err) {

console.log(err);

}

},

//裁剪图片

async getCropimage(res) {

try {

let image = await new Promise((resolve, reject) => {

wx.cropImage({

src: res.tempFiles[0].tempFilePath, // 图片路径

cropScale: '3:4', // 裁剪比例

success: function(res) {

// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片


if (!/(\.jpg|\.png|\.jpeg)$/.test(res.tempFilePath

.toLowerCase())) {

uni.showToast({

title: '请上传jpg、png或jpeg格式的照片',

icon: 'none',

duration: 2000

});

return;

}

resolve(res)

},

fail(err) {

reject(err)

}

})

})

return image

} catch (err) {

console.log(err);

}

},


/**

* 图片压缩

* @param {object} file 图片信息:width、height、type、path

* @param {string} canvasId canvas的id名

* @param {object} config 限制最大宽高

* @returns 压缩完成后的图片path

*/

async contraction(file, canvasId, config = {

maxWidth: 180,

maxHeight: 240

}) {


try {

let ctxInfo = await new Promise((resolve, reject) => {

// 获取图片原始宽高

let width = file.width

let height = file.height


// 计算图片当前大小和目标大小的比例:目标大小 / 图片当前大小

// 根据比例调整图片的尺寸:

// 新宽度 = 原始宽度 * √(目标大小 / 图片当前大小)

// 新高度 = 原始高度 * √(目标大小 / 图片当前大小)

// 宽高同比例调整

// 宽度 > 最大限宽 -> 重置尺寸

if (width > config.maxWidth) {

const ratio = config.maxWidth / width

width = config.maxWidth

height = height * ratio

}

// 高度 > 最大限高度 -> 重置尺寸

if (height > config.maxHeight) {

const ratio = config.maxHeight / height

width = width * ratio

height = config.maxHeight

}


// 获取canvas元素

const query = this.createSelectorQuery()

let dom = query.select(`#${canvasId}`)

dom.fields({

node: true,

size: true

})

.exec((res) => {

// Canvas 对象

const canvas = res[0].node

// 渲染上下文

const ctx = canvas.getContext('2d')


// 根据设备像素比处理尺寸 = 大小 * 设备像素

const dpr = wx.getSystemInfoSync().pixelRatio

canvas.width = width * dpr

canvas.height = height * dpr

ctx.scale(dpr, dpr)


//创建img对象

let img = canvas.createImage();

img.src = file.path; // 给图片添加路径

//图片加载完毕

img.onload = function() {

// 将图片绘制到 canvas

ctx.drawImage(img, 0, 0, width, height)

// 生成图片

wx.canvasToTempFilePath({

canvas,

x: 0,

y: 0,

destWidth: width,

destHeight: height,

success(res) {

resolve(res); // 生成临时文件路径

}

})

}

})

})

return ctxInfo

} catch (err) {

console.log(err);

}

},

/* 获取图片信息

* @param {string} tempFilePath 图片路径

* @returns 图片信息

*/

async getImgInfo(tempFilePath) {


try {

let image = await new Promise((resolve, reject) => {

wx.getImageInfo({

src: tempFilePath,

success(res) {

let imgInfo = {

type: res.type,

height: res.height,

width: res.width,

path: res.path

}

resolve(imgInfo)

},

fail(err) {

reject(err)

}

})

})

return image

// callback(image)

} catch (err) {

console.log(err);

}

},

回答关注问题邀请回答
收藏

1 个回答

登录 后发表内容