解决h5安卓在微信浏览器使用van-uploader上传不能选择视频问题

解决H5在微信浏览器中仅能选择图片的上传问题
最新推荐文章于 2025-07-08 10:24:35 发布
原创 最新推荐文章于 2025-07-08 10:24:35 发布 · 2.2k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue.js #javascript #html5 #前端

博客讲述了在H5页面使用van-uploader组件时，在微信浏览器上遇到只能选择图片而无法选择视频的问题。作者发现代码原本设置为允许上传图片和视频，但微信浏览器似乎只识别了图片类型。为解决此问题，作者提出了根据文件类型判断并分别处理上传的方法。寻求对此问题有深入理解的技术人员分享相关原理。

h5打开微信浏览器使用van-uploader上传视频或者图片选择图片或者视频问题
最开始代码是这样的
在这里插使用入图片描述
使用微accept可上传图片和视频
但是在微信浏览器只能识别打开选择图片

解决方案
在这里插入图片描述
根据不同类型去判断上传就好了 我怀疑是到微信浏览器后文件类型判断只做了之前的验证
知道原理的大佬请留言

微信小程序 - vant weapp使用van-uploader上传组件点击无反应问题解决，本地测试或真机运行调试安卓手机或苹果ios系统点击上传没有唤起文件选择（Uploader文件上传点击无效）
🏆 前端领域优质创作者
10-27 3204
微信小程序Uploader文件上传点击没反应怎么办，Vant Weapp小程序 van-uploader 文件上传点击无反应，删除无反应，在 iOS 真机调试中，点击上传按钮没有任何反应。关于vant-ui中uploader组件无法点击的情况，微信小程序 vant weapp里面的上传upload组件上传报错怎么办，将本地的图片或文件上传至服务器，微信小程序 van-uploader文件上传，vant的van-uploader在安卓机中点击无反应问题解决，苹果ios手机vant-uploader点击没反应，
vant 上传视频 预览 组件 （部分安卓机不支持，推荐调用原生方法，自己重写样式，否则会弹出系统自带的文件选择界面，PC端不受影响）
weixin_39428080的博客
08-01 7114
vant上传视频预览组件。
微信小程序云开发---vant组件 van-uploader 实现视频文件上传到云存储，发动态功能
需要点灵感
07-07 8358
pages/upVideo.wxml //获取用户的头像和昵称展示 <view class="headerBox"> <image src="{{userInfo.weixinInfo.avatarUrl}}"></image> <text>{{userInfo.weixinInfo.nickName}}</text> </view> //填写动态相关的信息，select为自定义的下拉选择组件 <view class="
Vant Weapp小程序 van-uploader 文件上传点击无反应，删除无反应
coderYYY的博客
03-26 3118
van-uploader无法上传和删除解决方法
微信小程序 webview 中的h5 页面 van-uploader 部分机型无法上传 解决方案
射手男很懒的博客
06-15 9092
微信小程序 webview 中的h5 页面 van-uploader 部分机型无法上传 解决方案
Vue3使用van-uploader遇到某些安卓机型（小米、vivo、oppo等等）无法上传文件解决方案
weixin_45331887的博客
07-05 1万+
最近我用的是有赞的上传组件，根据需要限制了文件上传类型，但是上线后，发现苹果手机没有问题，反而一些安卓手机都出现了问题，无法正常选择文件，在调整了限制文件类型后，就正常上传了！！！可喜可贺，以此记录下解决方法，希望能够帮到大家。
vant的van-uploader在安卓机中点击无反应问题解决
njihkj的博客
05-16 4262
van-uploader加了accept，需要去做文件预处理，也就是要加上before-read，如果不加，就会导致点击无反应。
微信公众号H5上传图片
最新发布
2301_78881761的博客
07-08 254
微信H5在普通浏览器上传图片正常，但在微信内置浏览器失效。解决方案是调用微信JS-SDK的图片上传接口。通过判断用户代理识别微信环境，动态切换上传方式：微信环境下使用wx.chooseImage选择图片，获取本地图片数据后转换为base64格式上传；非微信环境保持原有上传逻辑。关键步骤包括初始化微信JS-SDK配置、处理图片选择和上传流程，并确保两种环境的上传结果统一处理。该方法解决了微信内置浏览器的兼容性问题，实现了图片上传功能的跨平台适配。
android不能上传视频文件格式,微信公众号里采用七牛上传视频，部分Android手机出现不能选择视频文件的情况...
weixin_29732737的博客
05-26 787
1.微信公号开发设计到视频上传，采用七牛上传视频，发现在微信公众号里打开本地文件时部分手机(华为)不能选择视频文件，部分手机(魅蓝note2)直接调用相册只能选图片。2.七牛代码如下：var uploader = Qiniu.uploader({runtimes: 'html5,flash,html4',browse_button: _t.options.obj.substring(1), ...
vant 组件 ---h5使用van-uploader组件上传图片嵌套微信小程序安卓机器不显示相机（因ios不会出现问题，不做处理）
ZJ15981837003的博客
05-19 3680
vant 组件
Vue移动端地图App：van-uploader导致的卡顿问题
席木木的博客
07-03 708
基于Vue3+Vant IU 4开发的移动端地图App，在进行地图点位上报、上报记录查看过程中，出现App卡顿、甚至闪退的问题，进行问题定位之后，发现是van-uploader组件导致的问题。
使用 vant van-uploader accept="file" 上传文件，怎么跳到微信列表了
06-04
我们正在解决使用Vant的van-uploader组件时，设置accept="file"导致在微信浏览器中跳转到微信文件列表的问题。根据引用[1]和引用[2]提供的信息，我们了解到在小程序webview中使用van-uploader时，部分机型存在无法...
uniapp 微信小程序 web-view上传手机文件管理器里最近文件（不限文件类型）
树上骑个猴的博客
04-18 1894
我在这里使用的vant.js的Uploader组件上传工具。 uploadFile.vue <van-uploader accept="*" :before-read="beforeRead" :max-count="1" :max-size="100 * 1024 * 1024" @oversize="onOversize" :after-read="afterRead"> <div class="box-button">
van-uploader上传图片不显示
03-18
### 关于 `van-uploader` 组件上传图片不显示的问题分析 #### 问题描述 当使用 `van-uploader` 组件进行图片上传时，可能会遇到上传完成后图片未正常显示的情况。这种现象可能由多种原因引起，包括但不限于前端代码...
肚子开发中关于vant-ui中uploader组件无法点击的情况
qq_41973733的博客
04-09 3238
最近在开发时，使用了vant-ui中的uploader的文件上传组件，但出现了一个问题有些时候从其他界面进入就没法进行点击上传动作但一刷新又可以使用了；看了开发者工具才知道是之前设置Input属性值时也一并设置上了，导致组件中负责文件上传的input标签换了位置 解决方法： .van-uploader__upload input{ margin: 0; width: 100%; } 这样就能避免uploader组件下的input标签乱跑的问题了，当然如果为了求稳还可以将padding和ma
微信中h5中的视频无法播放,提示视频解析失败的根本原因。
热门推荐
hhgood的博客
05-12 1万+
提示： 如果你的视频文件所放的服务器装的是apche2.4,那就对了，否则不需要往下看了 微信中的h5中的视频在微信中无法播放，但是你用浏览器打开这个h5地址，却可以播放，原因就是apache没有配置mp4视频不要进行gzip压缩。 在apache的配置中加一行： SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|zip|mp4)$
微信小程序：实现选择视频 + 页面跳转 + 数据传送功能
destiny_balabala的博客
07-02 3527
一、实现的功能 还是这个熟悉的页面： 这次实现： 点击"选择视频"按钮，可以从本地相册中选取相册或者图片，并传回给该页面 再选择完视频之后，会出现一个新的页面，并且这个页面会出现刚才所选择的视频 二、文件夹准备 由于该功能涉及两个页面，所以在app.json中注册两个页面： 三、源码以及学习到的知识点 首先是选择按钮的.js文件 Page({ data: { tempFilePath: '' // 页面数据，初始化为空 }, onLoad: function(){ },
van-uploader上传组件遇到的问题
yangqii的博客
09-07 3204
van-uploader只能上传图片的问题
微信浏览器内核不支持 安卓、鸿蒙 选择多文件
HHH917的博客
06-25 653
这个是微信的浏览器内核的原因。iOS正常，安卓与鸿蒙不支持选择多文件。uniapp的官方demo 多文件上传不成功。调用微信jsdk 应该是可以的。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值