uniapp chooseVideo和uploadFile 选择视频或照片上传抖快平台踩坑

本文主要是介绍uniapp chooseVideo和uploadFile 选择视频或照片上传抖快平台踩坑,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

先贴代码

uni.chooseVideo({sourceType: ['album'],fail:(err)=>{console.log(TAG, "==chooseVideo-fail==err:", err)page.resetUploadFileField()if (err.errNo == 10200 || 'chooseVideo:fail take video fail' == err.errMsg || 'chooseVideo:fail auth deny' == err.errMsg) {ToastUtil.showTipToast(`前往手机设置-应用打开${getHostName_()}相册权限`)} else if (err.errNo != 10502 && 'chooseVideo:fail cancel' != err.errMsg) {ToastUtil.showTipToast("获取上传文件异常:" + JSON.stringify(err))} },success:(res)=>{console.log(TAG, "==chooseVideo-success==res:", res)if (res && res.tempFilePath && res.duration >= 3 && res.size <= 500*1024*1024) {page.uploadFile = res.tempFilePathpage.uploadFileDuration = res.durationpage.uploadFileSize = res.sizepage.chooseVideoSucc = truepage.uploadMedia()},				})//上传视频async uploadMedia() {let page = this//原生上传方法if (this.chooseVideoSucc) {this.isUploading = truelet header = {}console.log(TAG,"==uploadMedia chooseVideoSucc 开始上传==")this.uploadTask = uni.uploadFile({url: res.data.host, //上传地址filePath: page.uploadFile,fileType: 'video',name: 'file',//重要标识header: header,formData:{//阿里云os端相关配置参数由后台下发"key":res.data.dir,"OSSAccessKeyId":res.data.access_id,"policy":res.data.policy,"signature":res.data.signature,"callback":res.data.callback,},success(res) {console.log(TAG, "==上传成功==res:", res)},fail(err) {console.log(TAG, "==上传失败==err:", err)}})//上传进度监听,条件编译this.uploadTask.onProgressUpdate((res) => {console.log('onProgressUpdate==res:',res)//快手浮点型0-1// #ifdef MP-KUAISHOUpage.uploadProgress = (res.progress.toFixed(2))*100// #endif//非快手浮点型1.0-100.0// #ifndef MP-KUAISHOUpage.uploadProgress = res.progress// #endif				})}},

上面的代码看着是真恶心,而且快手端根本达不到产品的要求,小吐槽一下。。。
先做个小笔记,学习中遇到的一个问题:运算符双问号 ?? 在快手的template标签中会编译报错,抖音是可以正常解析的。
以下是坑::::

  1. 申请访问相册权限拒绝后返回区别:抖音有明确的错误码: err.errNo,快手只有err.errMsg,
    而且快手自己没有“图片和视频”访问权限,和有权限了,跳转到相册选择页直接退出不选择内容,都在api回调中返回 errMsg:chooseVideo:fail take video fail,
    真的很不规范好吧
  2. uni.authorize({scope: “scope.camera”,})这个玩意没法用,反馈的结果完全没有参考意义
  3. uni.openSetting({success(authSetting) {},fail() { }),这个方法打开的是小程序宿主对向程序开放的权限页面,在小程序的三个点里面也能拉起,实际真没啥意义
  4. 上传进度,快手是0-1的浮点型,抖音是1-100的浮点型;还有那个fileType: ‘video’,name: ‘file’,当时name随便填的,没想到把我后端一直收不到数据,但是上传进度是正常的,真是服了,到处屎坑
  5. 上传阿里云OSS的坑,如果使用阿里云node.js 的方法直接跨域传到阿里云上,是万万行不通的,真的把我折磨了两天,oss-sdk和api根本用不了,劝各位往后放弃直传,只能让后端透传创建一个我们自己的域名,给到相应的阿里云oss的key和secret也已完成间接直传
  6. 最大的坑是从阿里云跨域下载文件,到目前位置依然没有解决办法,小程序的网络请求都默认添加上了referer,这个需要在阿里云后端配置白名单,出于安全考虑,不让配都快自己的referer,所以没法直接下载,搞我半条命

这篇关于uniapp chooseVideo和uploadFile 选择视频或照片上传抖快平台踩坑的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1060713

相关文章

GitLab文件的上传与下载方式

《GitLab文件的上传与下载方式》:本文主要介绍GitLab文件的上传与下载方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录GitLab 项目拉取到本地GitLab 项目上传方法方法 1:本地项目未初始化Git方法 2:本地项目已初始化GitGitLab 上

Nginx 413修改上传文件大小限制的方法详解

《Nginx413修改上传文件大小限制的方法详解》在使用Nginx作为Web服务器时,有时会遇到客户端尝试上传大文件时返回​​413RequestEntityTooLarge​​... 目录1. 理解 ​​413 Request Entity Too Large​​ 错误2. 修改 Nginx 配置2.1

uniapp小程序中实现无缝衔接滚动效果代码示例

《uniapp小程序中实现无缝衔接滚动效果代码示例》:本文主要介绍uniapp小程序中实现无缝衔接滚动效果的相关资料,该方法可以实现滚动内容中字的不同的颜色更改,并且可以根据需要进行艺术化更改和自... 组件滚动通知只能实现简单的滚动效果,不能实现滚动内容中的字进行不同颜色的更改,下面实现一个无缝衔接的滚动

Java应用如何防止恶意文件上传

《Java应用如何防止恶意文件上传》恶意文件上传可能导致服务器被入侵,数据泄露甚至服务瘫痪,因此我们必须采取全面且有效的防范措施来保护Java应用的安全,下面我们就来看看具体的实现方法吧... 目录恶意文件上传的潜在风险常见的恶意文件上传手段防范恶意文件上传的关键策略严格验证文件类型检查文件内容控制文件存储

Java实现MinIO文件上传的加解密操作

《Java实现MinIO文件上传的加解密操作》在云存储场景中,数据安全是核心需求之一,MinIO作为高性能对象存储服务,支持通过客户端加密(CSE)在数据上传前完成加密,下面我们来看看如何通过Java... 目录一、背景与需求二、技术选型与原理1. 加密方案对比2. 核心算法选择三、完整代码实现1. 加密上

在React聊天应用中实现图片上传功能

《在React聊天应用中实现图片上传功能》在现代聊天应用中,除了文字和表情,图片分享也是一个重要的功能,本文将详细介绍如何在基于React的聊天应用中实现图片上传和预览功能,感兴趣的小伙伴跟着小编一起... 目录技术栈实现步骤1. 消息组件改造2. 图片预览组件3. 聊天输入组件改造功能特点使用说明注意事项

exfat和ntfs哪个好? U盘格式化选择NTFS与exFAT的详细区别对比

《exfat和ntfs哪个好?U盘格式化选择NTFS与exFAT的详细区别对比》exFAT和NTFS是两种常见的文件系统,它们各自具有独特的优势和适用场景,以下是关于exFAT和NTFS的详细对比... 无论你是刚入手了内置 SSD 还是便携式移动硬盘或 U 盘,都需要先将它格式化成电脑或设备能够识别的「文

在.NET平台使用C#为PDF添加各种类型的表单域的方法

《在.NET平台使用C#为PDF添加各种类型的表单域的方法》在日常办公系统开发中,涉及PDF处理相关的开发时,生成可填写的PDF表单是一种常见需求,与静态PDF不同,带有**表单域的文档支持用户直接在... 目录引言使用 PdfTextBoxField 添加文本输入域使用 PdfComboBoxField

springboot上传zip包并解压至服务器nginx目录方式

《springboot上传zip包并解压至服务器nginx目录方式》:本文主要介绍springboot上传zip包并解压至服务器nginx目录方式,具有很好的参考价值,希望对大家有所帮助,如有错误... 目录springboot上传zip包并解压至服务器nginx目录1.首先需要引入zip相关jar包2.然

深入理解Apache Kafka(分布式流处理平台)

《深入理解ApacheKafka(分布式流处理平台)》ApacheKafka作为现代分布式系统中的核心中间件,为构建高吞吐量、低延迟的数据管道提供了强大支持,本文将深入探讨Kafka的核心概念、架构... 目录引言一、Apache Kafka概述1.1 什么是Kafka?1.2 Kafka的核心概念二、Ka