首页 > 其他分享 >uni.uploadFile和this.$refs.signatureRef.canvasToTempFilePath

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

时间:2023-11-02 19:58:21浏览次数:47  
标签:console log url res refs canvasToTempFilePath uni data

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);
                                }
                            });

                        }
                    })

标签:console,log,url,res,refs,canvasToTempFilePath,uni,data
From: https://www.cnblogs.com/prince11/p/17806140.html

相关文章

  • uniapp app横屏竖屏问题导致样式紊乱
    最近做了一个点击签名然后要让app自动横屏的功能,此功能难点在于退出横屏的时候,会导致竖屏的页面紊乱。首先如果要让app横屏,要先在manifest.json的源码视图app-plus里添加"flexible":true,表示app可以横竖切换然后在想要横屏的页面里加上onShow(){         uni.sh......
  • uniapp-ucloud 数据库里面添加记录
    要保持本地跟云端的表一致。同步。还有设置权限constdb=uniCloud.database()constjiemengCollection=db.collection('jiemeng') for(constrowofdata){ console.log(row) try{ jiemengCollection.add(row) }catch(e){ ......
  • Unity DOTS系列之Struct Change核心机制分析
    最近DOTS发布了正式的版本,我们来分享一下DOTS里面StructChange机制,方便大家上手学习掌握UnityDOTS开发。基于ArchType与Chunk的Entity管理机制  我们回顾以下ECS的内存管理核心机制,基于ArchType+Chunk的Entity管理模式。每个Entity不直接存放数据,数据全部存放到Component......
  • Unity-Android 权限相关问题
    1.生成AndroidManifestFile->buildSetting->playerSetting->Android->publishingSettings权限添加位置:<?xmlversion="1.0"encoding="utf-8"?><manifestxmlns:android="http://schemas.android.com/apk/res/android......
  • uniapp 动态修改顶部导航栏右侧按钮 titleNView(APP-PLUS、H5)
    1<script>2exportdefault{3onReady(){4//已渲染5varpages=getCurrentPages();6varpage=pages[pages.length-1];78//#ifdefH59document.querySelector('.uni-page-head-ft.uni-......
  • Hive / ClickHouse 行转列函数 collect_set() / groupUniqArray() 入门
    Hive/ClickHouse行转列函数collect_set()/groupUniqArray()入门在数据处理和分析中,我们经常会遇到需要将一行数据转换为多列的情况。在Hive和ClickHouse中,可以使用collect_set()和groupUniqArray()函数来实现行转列操作。collect_set()1.功能说明collect_set()函......
  • Unity从入门到主程学习路线(内含学习资料)干货超全
    写在最前很多小伙伴想进阶Unity主程,进阶Unity架构师,不知道要学哪些知识,今天给大家分享一下比较完整的知识体系,Unity学习路线,介绍一些有干货的博主与教程,给大家做参考。不管你是已经工作了,还是正在学习中的Unity初学者,如果你想在游戏开发行业中有更高更远的发展,请用五分钟阅读......
  • uniapp 打包缺陷
    uniapp打包时候会把所有用到的公共组件和公共封装打包到一起,在首页直接加载,这样会严重影响首屏的显示速度目前没有找到好的最小化分离首屏依赖的打包方式考虑可行的方案1.写一个webpack插件,通过分析指定模块的依赖,将模块和模块依赖分别打包2.深入webpack配置,看......
  • python之unicode和encode
    Python中有两种默认的字符串:str和unicode。在Python中一定要注意区分“Unicode字符串”和“unicode对象”的区别。后面所有的“unicode字符串”指的都是python里的“unicode对象”。事实上在Python中并没有“Unicode字符串”这样的东西,只有“unicode”对象。一个传统意义上的un......
  • uniapp微信小程序自定义隐私权限弹窗
    插件地址:https://ext.dcloud.net.cn/plugin?id=14576#detail 样式小改动<template><viewclass="xh-privacy"><!--默认主题--><view:style="'background:'+background+';'"class="the......