/** * 富文本plugin微信小程序特殊扩展 * @author sonve * @version 1.0.0 * @date 2024-12-17 */ import config from '../common/config.js' /** * 微信小程序特有的OffscreenCanvas方法 * @param {String} coverImageUrl 封面资源地址 * @returns {Promise} 处理后的封面图片的临时文件路径 */ export function wxCreateCoverThumbnail(coverImageUrl) { const loadImage = () => { return new Promise((resolve, reject) => { uni.getImageInfo({ src: coverImageUrl, success: (info) => { resolve(info) }, fail: (err) => { reject(err) } }) }) } return new Promise(async (resolve, reject) => { try { const imageInfo = await loadImage() // 创建离屏 Canvas const canvas = uni.createOffscreenCanvas({ type: '2d', width: imageInfo.width, height: imageInfo.height }) const ctx = canvas.getContext('2d') // 创建一个图片 const coverImg = canvas.createImage() // 等待图片加载 await new Promise((resolve) => { coverImg.onload = resolve coverImg.src = coverImageUrl // 要加载的图片 url }) // 绘制封面图片到离屏 Canvas ctx.drawImage(coverImg, 0, 0, canvas.width, canvas.height) // 加载播放按钮图标 const playIcon = canvas.createImage() // 等待图片加载 await new Promise((resolve) => { playIcon.onload = resolve playIcon.src = config.video_playicon // 要加载的图片 url }) // 计算播放按钮的位置和大小 // const playButtonSize = Math.min(canvas.width, canvas.height) * 0.15 const playButtonSize = canvas.width * 0.15 const playButtonX = (canvas.width - playButtonSize) / 2 const playButtonY = (canvas.height - playButtonSize) / 2 // 确保播放按钮图标按比例缩放 const iconAspectRatio = playIcon.width / playIcon.height const iconWidth = playButtonSize const iconHeight = iconWidth / iconAspectRatio // 绘制播放按钮图标到离屏 Canvas ctx.drawImage(playIcon, playButtonX, playButtonY, iconWidth, iconHeight) // 获取画完后的数据 uni.canvasToTempFilePath({ canvas: canvas, destWidth: canvas.width, destHeight: canvas.height, fileType: 'png', success: (res) => { resolve(res.tempFilePath) }, fail: (err) => { reject(new Error('Failed to convert canvas to image.')) } }) } catch (error) { reject(error) } }) } export default { wxCreateCoverThumbnail }