批量上传图片添加水印

思路：

1、循环图片列表，批量添加水印。

2、与之对应的html页面也要魂环并添加水印。

代码实现：

<view style="width: 0;height: 0;overflow: hidden;position:fixed;left: 200%;"><canvas v-for="(item,index) in canvesList" :key="index" :canvas-id="'firstCanvas' + index" class="canvas"style="background-color: #FFFFFF;width:660rpx;height:780rpx;"></canvas></view>

addWatermark(imageUrls) {let vm = this;imageUrls.forEach((imageUrl, index) => {const ctx = uni.createCanvasContext('firstCanvas' + index, this);let times = '拍摄时间：' + formatDate('YY-MM-DD hh:mm:ss')const InfoSync = uni.getSystemInfoSync()let bili = (InfoSync.windowWidth / 375) * 1ctx.fillStyle = "#FFFFFF"ctx.fillRect(0, 0, 330 * bili, 520 * bili)ctx.drawImage(imageUrl,25 * bili, 10 * bili, 280 * bili, 320 *bili); // 绘制原始图片ctx.setFillStyle("#333333")ctx.setFontSize(14 * bili)ctx.setTextAlign("bottom");ctx.fillText(times, 25 * bili, 350 * bili)ctx.draw(false, function(){// 将canvas保存为图片文件uni.canvasToTempFilePath({canvasId: 'firstCanvas' + index,success: (ress) => {const tempFilePath = ress.tempFilePath;vm.uploadImage(tempFilePath);},});});});},