微信小程序-离屏canvas给照片添加水印

前端学习小白

已于 2023-09-26 17:45:11 修改

阅读量916

点赞数 1

文章标签：微信小程序小程序 javascript

于 2023-09-26 17:43:09 首次发布

本文链接：https://blog.csdn.net/JavaScript_css_h/article/details/133317962

版权

个人使用中遇到的，纯JS，可以全局使用，个人见解，已经封装好了，可以直接使用

因为是uni开发的，所以部分API是uni和wx混用的

就是不知道怎么在离屏的canvas中绘制文字，有知道的兄弟告知一下🤞🤞🤞

// 微信小程序离屏canvas给照片添加水印
export function addWatermark(imgPath) {    // imgPath为图片路径
  return new Promise((newResolve) => {
    //获取手机型号，判断系统是否为IOS，IOS系统输出canvas画好的图片不支持canvasToTempFilePath方法，需要使用writeFile方法
    const k = wx.getSystemInfoSync().brand
    // 用时间戳拼接下方生成的临时路径，防止重复
    const time = new Date().getTime();

    wx.getImageInfo({
      src: imgPath,
      success: function (res) {
        const canvas = wx.createOffscreenCanvas({ type: '2d', width: res.width, height: res.height })
        const context = canvas.getContext('2d')
        let image = canvas.createImage()
        var myCan = new Promise(resolve => {
          image.src = res.path // 要加载的图片 url