• uni-app canvas 签名

    在这里插入图片描述
    调用方法

    import Signature from "@/components/signature.vue"
const base64Img = ref()
//监听getSignImg
uni.$on('getSignImg', ({ base64, path }) => {
		base64Img.value = base64
	    //console.log('签名base64, path ====>', base64, path) //拿到的图片数据
	    // 之后取消监听，防止重复监听
	    uni.$off('getSignImg')
	})

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    <Signature :showMark="false"  @cancle="cancle"></Signature>

    • 1

    signature.vue

    <template>
	<view class="sign-page" v-cloak>
		<view class="dis-flex justify-end">
			<uv-icon name="close" color="#333" size="48rpx" @click="cancle"></uv-icon>
		</view>
		<view class="sign-body">
			<canvas id="signCanvas" canvas-id="signCanvas" class="sign-canvas" disable-scroll
				@touchstart.stop="signCanvasStart" @touchmove.stop="signCanvasMove"
				@touchend.stop="signCanvasEnd"></canvas>
			<!-- #ifndef APP -->
			<!--用于临时储存横屏图片的canvas容器，H5和小程序需要-->
			<canvas v-if="horizontal" id="hsignCanvas" canvas-id="hsignCanvas"
				style="position: absolute; top: -1000px; z-index: -1"
				:style="{ width: canvasHeight + 'px', height: canvasWidth + 'px' }"></canvas>
			<!-- #endif -->
		</view>
		<view class="sign-footer" :class="[horizontal ? 'horizontal-btns' : 'vertical-btns']">
			<uv-button
				customStyle="margin-top: 20rpx;width:300rpx;height:100rpx;border-radius:20rpx;border:1px solid #3894FF"
				@click="reset">
				<uv-icon name="shuaxin" color="#3894FF" size="48rpx" custom-prefix="custom-icon"></uv-icon>
				<text class="txt">重新签字</text>
			</uv-button>

			<uv-button type="primary" text="确定提交" customTextStyle="font-size:36rpx"
				customStyle="margin-top: 20rpx;width:300rpx;height:100rpx;border-radius:20rpx"
				@click="confirm"></uv-button>
		</view>
	</view>
</template>

<script>
	import {
		pathToBase64,
		base64ToPath
	} from '@/utils/signature.js'
	export default {
		name: 'sign',
		props: {
			// 背景水印图，优先级大于 bgColor
			bgImg: {
				type: String,
				default: ''
			},
			// 背景纯色底色，为空则透明
			bgColor: {
				type: String,
				default: ''
			},
			// 是否显示水印
			showMark: {
				type: Boolean,
				default: true
			},
			// 水印内容，可多行
			markText: {
				type: Array,
				default: () => {
					return [] // ['水印1', '水印2']
				}
			},
			// 水印样式
			markStyle: {
				type: Object,
				default: () => {
					return {
						fontSize: 12, // 水印字体大小
						fontFamily: 'microsoft yahei', // 水印字体
						color: '#cccccc', // 水印字体颜色
						rotate: 60, // 水印旋转角度
						step: 2.2 // 步长，部分场景下可通过调节该参数来调整水印间距，建议为1.4-2.6左右
					}
				}
			},
			// 是否横屏
			horizontal: {
				type: Boolean,
				default: false
			},
			// 画笔样式
			penStyle: {
				type: Object,
				default: () => {
					return {
						lineWidth: 3, // 画笔线宽 建议1~5
						color: '#000000' // 画笔颜色
					}
				}
			},
			// 导出图片配置
			expFile: {
				type: Object,
				default: () => {
					return {
						fileType: 'png', // png/jpg (png不可压缩质量，支持透明；jpg可压缩质量，不支持透明)
						quality: 1 // 范围 0 - 1 (仅jpg支持)
					}
				}
			}
		},
		data() {
			return {
				canvasCtx: null, // canvascanvasWidth: 0, // canvas宽度
				canvasWidth: 0, // canvas宽度
				canvasHeight: 0, // canvas高度
				x0: 0, // 初始横坐标或上一段touchmove事件中触摸点的横坐标
				y0: 0, // 初始纵坐标或上一段touchmove事件中触摸点的纵坐标
				signFlag: false // 签名旗帜
			}
		},
		mounted() {
			this.$nextTick(() => {
				this.createCanvas()
			})
		},
		methods: {
			// 创建canvas实例
			createCanvas() {
				this.canvasCtx = uni.createCanvasContext('signCanvas', this)
				this.canvasCtx.setLineCap('round') // 向线条的每个末端添加圆形线帽

				// 获取canvas宽高
				const query = uni.createSelectorQuery().in(this)
				query
					.select('.sign-body')
					.boundingClientRect((data) => {
						this.canvasWidth = data.width
						this.canvasHeight = data.height
					})
					.exec(async () => {
						await this.drawBg()
						this.drawMark(this.markText)
					})
			},
			async drawBg() {
				if (this.bgImg) {
					const img = await uni.getImageInfo({
						src: this.bgImg
					})
					this.canvasCtx.drawImage(img.path, 0, 0, this.canvasWidth, this.canvasHeight)
				} else if (this.bgColor) {
					// 绘制底色填充，否则为透明
					this.canvasCtx.setFillStyle(this.bgColor)
					this.canvasCtx.fillRect(0, 0, this.canvasWidth, this.canvasHeight)
				}
			},
			// 绘制动态水印
			drawMark(textArray) {
				if (!this.showMark) {
					this.canvasCtx.draw()
					return
				}
				// 绘制背景
				this.drawBg()

				// 水印参数
				const markStyle = Object.assign({
						fontSize: 12, // 水印字体大小
						fontFamily: 'microsoft yahei', // 水印字体
						color: '#cccccc', // 水印字体颜色
						rotate: 60, // 水印旋转角度
						step: 2 // 步长，部分场景下可通过调节该参数来调整水印间距，建议为1.4-2.6左右
					},
					this.markStyle
				)
				this.canvasCtx.font = `${markStyle.fontSize}px ${markStyle.fontFamily}`
				this.canvasCtx.fillStyle = markStyle.color
				// 文字坐标
				const maxPx = Math.max(this.canvasWidth / 2, this.canvasHeight / 2)
				const stepPx = Math.floor(maxPx / markStyle.step)
				let arrayX = [0] // 初始水印位置 canvas坐标 0 0 点
				while (arrayX[arrayX.length - 1] < maxPx / 2) {
					arrayX.push(arrayX[arrayX.length - 1] + stepPx)
				}
				arrayX.push(
					...arrayX.slice(1, arrayX.length).map((item) => {
						return -item
					})
				)

				for (let i = 0; i < arrayX.length; i++) {
					for (let j = 0; j < arrayX.length; j++) {
						this.canvasCtx.save()
						this.canvasCtx.translate(this.canvasWidth / 2, this.canvasHeight / 2) // 画布旋转原点 移到 图片中心
						this.canvasCtx.rotate(Math.PI * (markStyle.rotate / 180))
						textArray.forEach((item, index) => {
							let offsetY = markStyle.fontSize * index
							this.canvasCtx.fillText(item, arrayX[i], arrayX[j] + offsetY)
						})
						this.canvasCtx.restore()
					}
				}

				this.canvasCtx.draw()
			},
			cancle() {
				//取消按钮事件
				this.$emit('cancle')
				this.reset()
				//uni.navigateBack()
			},
			async reset() {
				this.$emit('reset')
				this.signFlag = false
				this.canvasCtx.clearRect(0, 0, this.canvasWidth, this.canvasHeight)
				await this.drawBg()
				this.drawMark(this.markText)
			},
			async confirm() {
				this.$emit('confirm')
				// 确认按钮事件
				if (!this.signFlag) {
					uni.showToast({
						title: '请签名后再点击确定',
						icon: 'none',
						duration: 2000
					})
					return
				}

				uni.showModal({
					title: '确认',
					content: '确认签名无误吗',
					showCancel: true,
					success: async ({
						confirm
					}) => {
						if (confirm) {
							let tempFile
							if (this.horizontal) {
								tempFile = await this.saveHorizontalCanvas()
							} else {
								tempFile = await this.saveCanvas()
							}
							const base64 = await pathToBase64(tempFile)
							const path = await base64ToPath(base64)
							uni.$emit('getSignImg', {
								base64,
								path
							})
							//uni.navigateBack()
						}
					}
				})
			},
			signCanvasEnd(e) {
				// 签名抬起事件
				// console.log(e, 'signCanvasEnd')
				this.x0 = 0
				this.y0 = 0
			},
			signCanvasMove(e) {
				// 签名滑动事件
				// console.log(e, 'signCanvasMove')
				// #ifdef MP-WEIXIN
				let dx = e.touches[0].clientX - this.x0
				let dy = e.touches[0].clientY - this.y0
				// #endif
				// #ifndef MP-WEIXIN
				let dx = e.touches[0].x - this.x0
				let dy = e.touches[0].y - this.y0
				// #endif
				this.canvasCtx.moveTo(this.x0, this.y0)
				this.canvasCtx.lineTo(this.x0 + dx, this.y0 + dy)
				this.canvasCtx.setLineWidth(this.penStyle?.lineWidth || 4)
				this.canvasCtx.strokeStyle = this.penStyle?.color || '#000000'
				this.canvasCtx.stroke()
				this.canvasCtx.draw(true)
				// #ifdef MP-WEIXIN
				this.x0 = e.touches[0].clientX
				this.y0 = e.touches[0].clientY
				// #endif
				// #ifndef MP-WEIXIN
				this.x0 = e.touches[0].x
				this.y0 = e.touches[0].y
				// #endif
			},
			signCanvasStart(e) {
				// 签名按下事件 app获取的e不一样区分小程序app
				// console.log('signCanvasStart', e)
				if (!this.signFlag) {
					// 导出第一次开始触碰事件
					this.$emit('firstTouchStart')
				}
				this.signFlag = true
				// #ifdef MP-WEIXIN
				this.x0 = e.touches[0].clientX
				this.y0 = e.touches[0].clientY
				// #endif
				// #ifndef MP-WEIXIN
				this.x0 = e.touches[0].x
				this.y0 = e.touches[0].y
				// #endif
			},
			// 保存竖屏图片
			async saveCanvas() {
				return await new Promise((resolve, reject) => {
					uni.canvasToTempFilePath({
							canvasId: 'signCanvas',
							fileType: this.expFile.fileType, // 只支持png和jpg
							quality: this.expFile.quality, // 范围 0 - 1
							success: (res) => {
								if (!res.tempFilePath) {
									uni.showModal({
										title: '提示',
										content: '保存签名失败',
										showCancel: false
									})
									return
								}
								resolve(res.tempFilePath)
							},
							fail: (r) => {
								console.log('图片生成失败：' + r)
								resolve(false)
							}
						},
						this
					)
				})
			},
			// 保存横屏图片
			async saveHorizontalCanvas() {
				return await new Promise((resolve, reject) => {
					uni.canvasToTempFilePath({
							canvasId: 'signCanvas',
							fileType: this.expFile.fileType, // 只支持png和jpg
							success: (res) => {
								if (!res.tempFilePath) {
									uni.showModal({
										title: '提示',
										content: '保存签名失败',
										showCancel: false
									})
									return
								}

								// #ifdef APP
								uni.compressImage({
									src: res.tempFilePath,
									quality: this.expFile.quality * 100, // 范围 0 - 100
									rotate: 270,
									success: (r) => {
										console.log('==== compressImage :', r)
										resolve(r.tempFilePath)
									}
								})
								// #endif

								// #ifndef APP
								uni.getImageInfo({
									src: res.tempFilePath,
									success: (r) => {
										// console.log('==== getImageInfo :', r)
										// 将signCanvas的内容复制到hsignCanvas中
										const hcanvasCtx = uni.createCanvasContext(
											'hsignCanvas', this)
										// 横屏宽高互换
										hcanvasCtx.translate(this.canvasHeight / 2, this
											.canvasWidth / 2)
										hcanvasCtx.rotate(Math.PI * (-90 / 180))
										hcanvasCtx.drawImage(
											r.path,
											-this.canvasWidth / 2,
											-this.canvasHeight / 2,
											this.canvasWidth,
											this.canvasHeight
										)
										hcanvasCtx.draw(false, async () => {
											const hpathRes = await uni
												.canvasToTempFilePath({
														canvasId: 'hsignCanvas',
														fileType: this.expFile
															.fileType, // 只支持png和jpg
														quality: this.expFile
															.quality // 范围 0 - 1
													},
													this
												)
											let tempFile = ''
											if (Array.isArray(hpathRes)) {
												hpathRes.some((item) => {
													if (item) {
														tempFile = item
															.tempFilePath
														return
													}
												})
											} else {
												tempFile = hpathRes
													.tempFilePath
											}
											resolve(tempFile)
										})
									}
								})
								// #endif
							},
							fail: (err) => {
								console.log('图片生成失败：' + err)
								resolve(false)
							}
						},
						this
					)
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	[v-cloak] {
		display: none !important;
	}

	.sign-page {
		height: 600rpx;
		width: 710rpx;
		padding: 20rpx;
		display: flex;
		flex-direction: column;

		.sign-body {
			margin-top: 50rpx;
			width: 100%;
			flex-grow: 1;
			background: #E5E5E5;

			.sign-canvas {
				width: 100%;
				height: 100%;
			}
		}

		.sign-footer {
			width: 100%;
			height: 80rpx;
			margin: 15rpx 0;
			display: flex;
			justify-content: space-evenly;
			align-items: center;

			.txt{
				color:#3894FF;
				padding-left:10rpx;
				font-size: 36rpx;
			}
		}

		.vertical-btns {
			.btn {
				width: 120rpx;
				height: 66rpx;
			}
		}

		.horizontal-btns {
			.btn {
				width: 66rpx;
				height: 120rpx;
				writing-mode: vertical-lr;
				transform: rotate(90deg);
			}
		}
	}

	:deep(.uvicon-close) {
		font-size: 48rpx
	}
</style>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    • 128
    • 129
    • 130
    • 131
    • 132
    • 133
    • 134
    • 135
    • 136
    • 137
    • 138
    • 139
    • 140
    • 141
    • 142
    • 143
    • 144
    • 145
    • 146
    • 147
    • 148
    • 149
    • 150
    • 151
    • 152
    • 153
    • 154
    • 155
    • 156
    • 157
    • 158
    • 159
    • 160
    • 161
    • 162
    • 163
    • 164
    • 165
    • 166
    • 167
    • 168
    • 169
    • 170
    • 171
    • 172
    • 173
    • 174
    • 175
    • 176
    • 177
    • 178
    • 179
    • 180
    • 181
    • 182
    • 183
    • 184
    • 185
    • 186
    • 187
    • 188
    • 189
    • 190
    • 191
    • 192
    • 193
    • 194
    • 195
    • 196
    • 197
    • 198
    • 199
    • 200
    • 201
    • 202
    • 203
    • 204
    • 205
    • 206
    • 207
    • 208
    • 209
    • 210
    • 211
    • 212
    • 213
    • 214
    • 215
    • 216
    • 217
    • 218
    • 219
    • 220
    • 221
    • 222
    • 223
    • 224
    • 225
    • 226
    • 227
    • 228
    • 229
    • 230
    • 231
    • 232
    • 233
    • 234
    • 235
    • 236
    • 237
    • 238
    • 239
    • 240
    • 241
    • 242
    • 243
    • 244
    • 245
    • 246
    • 247
    • 248
    • 249
    • 250
    • 251
    • 252
    • 253
    • 254
    • 255
    • 256
    • 257
    • 258
    • 259
    • 260
    • 261
    • 262
    • 263
    • 264
    • 265
    • 266
    • 267
    • 268
    • 269
    • 270
    • 271
    • 272
    • 273
    • 274
    • 275
    • 276
    • 277
    • 278
    • 279
    • 280
    • 281
    • 282
    • 283
    • 284
    • 285
    • 286
    • 287
    • 288
    • 289
    • 290
    • 291
    • 292
    • 293
    • 294
    • 295
    • 296
    • 297
    • 298
    • 299
    • 300
    • 301
    • 302
    • 303
    • 304
    • 305
    • 306
    • 307
    • 308
    • 309
    • 310
    • 311
    • 312
    • 313
    • 314
    • 315
    • 316
    • 317
    • 318
    • 319
    • 320
    • 321
    • 322
    • 323
    • 324
    • 325
    • 326
    • 327
    • 328
    • 329
    • 330
    • 331
    • 332
    • 333
    • 334
    • 335
    • 336
    • 337
    • 338
    • 339
    • 340
    • 341
    • 342
    • 343
    • 344
    • 345
    • 346
    • 347
    • 348
    • 349
    • 350
    • 351
    • 352
    • 353
    • 354
    • 355
    • 356
    • 357
    • 358
    • 359
    • 360
    • 361
    • 362
    • 363
    • 364
    • 365
    • 366
    • 367
    • 368
    • 369
    • 370
    • 371
    • 372
    • 373
    • 374
    • 375
    • 376
    • 377
    • 378
    • 379
    • 380
    • 381
    • 382
    • 383
    • 384
    • 385
    • 386
    • 387
    • 388
    • 389
    • 390
    • 391
    • 392
    • 393
    • 394
    • 395
    • 396
    • 397
    • 398
    • 399
    • 400
    • 401
    • 402
    • 403
    • 404
    • 405
    • 406
    • 407
    • 408
    • 409
    • 410
    • 411
    • 412
    • 413
    • 414
    • 415
    • 416
    • 417
    • 418
    • 419
    • 420
    • 421
    • 422
    • 423
    • 424
    • 425
    • 426
    • 427
    • 428
    • 429
    • 430
    • 431
    • 432
    • 433
    • 434
    • 435
    • 436
    • 437
    • 438
    • 439
    • 440
    • 441
    • 442
    • 443
    • 444
    • 445
    • 446
    • 447
    • 448
    • 449
    • 450
    • 451
    • 452
    • 453
    • 454
    • 455
    • 456
    • 457
    • 458
    • 459
    • 460
    • 461
    • 462
    • 463
    • 464
    • 465
    • 466
    • 467
    • 468
    • 469
    • 470
    • 471

    signature.js

    function getLocalFilePath(path) {
    if (path.indexOf('_www') === 0 || path.indexOf('_doc') === 0 || path.indexOf('_documents') === 0 || path.indexOf('_downloads') === 0) {
        return path
    }
    if (path.indexOf('file://') === 0) {
        return path
    }
    if (path.indexOf('/storage/emulated/0/') === 0) {
        return path
    }
    if (path.indexOf('/') === 0) {
        var localFilePath = plus.io.convertAbsoluteFileSystem(path)
        if (localFilePath !== path) {
            return localFilePath
        } else {
            path = path.substr(1)
        }
    }
    return '_www/' + path
}

function dataUrlToBase64(str) {
    var array = str.split(',')
    return array[array.length - 1]
}

var index = 0
function getNewFileId() {
    return Date.now() + String(index++)
}

function biggerThan(v1, v2) {
    var v1Array = v1.split('.')
    var v2Array = v2.split('.')
    var update = false
    for (var index = 0; index < v2Array.length; index++) {
        var diff = v1Array[index] - v2Array[index]
        if (diff !== 0) {
            update = diff > 0
            break
        }
    }
    return update
}

export function pathToBase64(path) {
    return new Promise(function(resolve, reject) {
        if (typeof window === 'object' && 'document' in window) {
            if (typeof FileReader === 'function') {
                var xhr = new XMLHttpRequest()
                xhr.open('GET', path, true)
                xhr.responseType = 'blob'
                xhr.onload = function() {
                    if (this.status === 200) {
                        let fileReader = new FileReader()
                        fileReader.onload = function(e) {
                            resolve(e.target.result)
                        }
                        fileReader.onerror = reject
                        fileReader.readAsDataURL(this.response)
                    }
                }
                xhr.onerror = reject
                xhr.send()
                return
            }
            var canvas = document.createElement('canvas')
            var c2x = canvas.getContext('2d')
            var img = new Image
            img.onload = function() {
                canvas.width = img.width
                canvas.height = img.height
                c2x.drawImage(img, 0, 0)
                resolve(canvas.toDataURL())
                canvas.height = canvas.width = 0
            }
            img.onerror = reject
            img.src = path
            return
        }
        if (typeof plus === 'object') {
            plus.io.resolveLocalFileSystemURL(getLocalFilePath(path), function(entry) {
                entry.file(function(file) {
                    var fileReader = new plus.io.FileReader()
                    fileReader.onload = function(data) {
                        resolve(data.target.result)
                    }
                    fileReader.onerror = function(error) {
                        reject(error)
                    }
                    fileReader.readAsDataURL(file)
                }, function(error) {
                    reject(error)
                })
            }, function(error) {
                reject(error)
            })
            return
        }
        if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) {
            wx.getFileSystemManager().readFile({
                filePath: path,
                encoding: 'base64',
                success: function(res) {
                    resolve('data:image/png;base64,' + res.data)
                },
                fail: function(error) {
                    reject(error)
                }
            })
            return
        }
        reject(new Error('not support'))
    })
}

export function base64ToPath(base64) {
    return new Promise(function(resolve, reject) {
        if (typeof window === 'object' && 'document' in window) {
            base64 = base64.split(',')
            var type = base64[0].match(/:(.*?);/)[1]
            var str = atob(base64[1])
            var n = str.length
            var array = new Uint8Array(n)
            while (n--) {
                array[n] = str.charCodeAt(n)
            }
            return resolve((window.URL || window.webkitURL).createObjectURL(new Blob([array], { type: type })))
        }
        var extName = base64.split(',')[0].match(/data\:\S+\/(\S+);/)
        if (extName) {
            extName = extName[1]
        } else {
            reject(new Error('base64 error'))
        }
        var fileName = getNewFileId() + '.' + extName
        if (typeof plus === 'object') {
            var basePath = '_doc'
            var dirPath = 'uniapp_temp'
            var filePath = basePath + '/' + dirPath + '/' + fileName
            if (!biggerThan(plus.os.name === 'Android' ? '1.9.9.80627' : '1.9.9.80472', plus.runtime.innerVersion)) {
                plus.io.resolveLocalFileSystemURL(basePath, function(entry) {
                    entry.getDirectory(dirPath, {
                        create: true,
                        exclusive: false,
                    }, function(entry) {
                        entry.getFile(fileName, {
                            create: true,
                            exclusive: false,
                        }, function(entry) {
                            entry.createWriter(function(writer) {
                                writer.onwrite = function() {
                                    resolve(filePath)
                                }
                                writer.onerror = reject
                                writer.seek(0)
                                writer.writeAsBinary(dataUrlToBase64(base64))
                            }, reject)
                        }, reject)
                    }, reject)
                }, reject)
                return
            }
            var bitmap = new plus.nativeObj.Bitmap(fileName)
            bitmap.loadBase64Data(base64, function() {
                bitmap.save(filePath, {}, function() {
                    bitmap.clear()
                    resolve(filePath)
                }, function(error) {
                    bitmap.clear()
                    reject(error)
                })
            }, function(error) {
                bitmap.clear()
                reject(error)
            })
            return
        }
        if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) {
            var filePath = wx.env.USER_DATA_PATH + '/' + fileName
            wx.getFileSystemManager().writeFile({
                filePath: filePath,
                data: dataUrlToBase64(base64),
                encoding: 'base64',
                success: function() {
                    resolve(filePath)
                },
                fail: function(error) {
                    reject(error)
                }
            })
            return
        }
        reject(new Error('not support'))
    })
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    • 128
    • 129
    • 130
    • 131
    • 132
    • 133
    • 134
    • 135
    • 136
    • 137
    • 138
    • 139
    • 140
    • 141
    • 142
    • 143
    • 144
    • 145
    • 146
    • 147
    • 148
    • 149
    • 150
    • 151
    • 152
    • 153
    • 154
    • 155
    • 156
    • 157
    • 158
    • 159
    • 160
    • 161
    • 162
    • 163
    • 164
    • 165
    • 166
    • 167
    • 168
    • 169
    • 170
    • 171
    • 172
    • 173
    • 174
    • 175
    • 176
    • 177
    • 178
    • 179
    • 180
    • 181
    • 182
    • 183
    • 184
    • 185
    • 186
    • 187
    • 188
    • 189
    • 190
    • 191
    • 192
    • 193
    • 194
    • 195
    • 196
  • 相关阅读:
    大数据认知
    SpringBoot集成WebSocket实现在线聊天
    后端程序员入门react笔记（四）-综合运用，写一个小demo
    C和指针 第10章 结构和联合 10.1 结构基础知识
    教程：创建由以太坊支持的 Web3 聊天
    virtualbox基本配置
    Flutter的专属Skia引擎解析+用法原理
    报错：wget命令出现Unable to establish SSL connection.
    2.7 HDR与LDR
    java-net-php-python-jsp网络考试系统计算机毕业设计程序
  • 原文地址：https://blog.csdn.net/qq_36529240/article/details/138149860