uni.uploadFile和this.$refs.signatureRef.canvasToTempFilePath

发布时间 2023-11-02 19:45:05作者: prince11

canvasToTempFilePath生成的图片是临时h5路径可用于临时回显,如果图片的路径要上传接口,需要使用uni.uploadFile来将图片上传到服务器

//我用uniapp做app签名时写的代码片段,上传完服务器之后的路径就可以传到后端给的接口啦,然后在查询的时候就可以通过订单返回的图片路径进行回显

this.$refs.signatureRef.canvasToTempFilePath({
                        // fileType:'jpg',
                        success: (res) => {
                            // 是否为空画板 无签名
                            console.log(res.isEmpty)
                            if (res.isEmpty) {
                                uni.showToast({
                                    title: '无签字内容,请重新签字',
                                    icon: 'none',
                                    duration: 3000
                                })
                                return
                            }
                            // 生成图片的临时路径
                            // app | H5 | 微信小程序 生成的是base64
                            this.url = res.tempFilePath
                            uni.setStorageSync('url', res.tempFilePath)
                            let that = this
                            let name = res.tempFilePath.split('/').pop()
                            console.log('this.url', this.url)
                            uni.uploadFile({
                                url: `${host}/gesup/accessoryUpload`, //仅为示例,非真实的接口地址
                                filePath: that.url,
                                fileName: name,
                                name: 'file',
                                header: {
                                    "Authorization": getAuthorization()
                                },
                                success: (uploadFileRes) => {
                                    console.log('success', uploadFileRes)
                                    if (uploadFileRes.statusCode == 200) {
                                        console.log(11111)
                                        const data = JSON.parse(uploadFileRes.data)
                                        // that.model.pics = data.data.accessPath
                                        console.log('data.data.accessPath', data.data.accessPath)
                                        that.model.pics.push(data.data.accessPath)
                                        this.setSignOut()

                                    }
                                },
                                fail: (res) => {
                                    console.log('err', res);
                                }
                            });

                        }
                    })