uniapp视频、音频上传的方法

简介: uniapp视频、音频上传的方法

uniapp中的视频、音频上传可以使用uni.uploadFile()方法来实现。具体代码如下:

// 选择文件
uni.chooseVideo({
  sourceType: ['album', 'camera'],
  maxDuration: 60,
  camera: 'back',
  success: function(res) {
    // 选择成功,开始上传文件
    uni.showLoading({
      title: '上传中...'
    });
    uni.uploadFile({
      url: 'https://your-upload-url.com/upload',  // 上传地址
      filePath: res.tempFilePath,                 // 要上传的文件路径
      name: 'file',                                // 上传文件对应的 key 值
      success: function(uploadRes) {
        // 上传成功处理逻辑
        console.log(uploadRes);
        uni.showToast({
          title: '上传成功'
        });
      },
      fail: function(error) {
        // 上传失败处理逻辑
        console.log(error);
        uni.hideLoading();
        uni.showToast({
          title: '上传失败'
        });
      },
      complete: function() {
        uni.hideLoading();
      }
    });
  }
});

其中uni.chooseVideo()用于从相册或拍摄录像中选择文件,uni.uploadFile()用于将文件上传到服务器。需要注意的是,在uni.uploadFile()中要将要上传的文件路径传入filePath参数中,将上传文件的key值传入name参数中。同时,还需要在success回调函数中处理上传成功的逻辑,在fail回调函数中处理上传失败的逻辑,在complete回调函数中隐藏加载动画。

同样的,上传音频可以使用类似的方法,只需要将uni.chooseVideo()改为uni.chooseAudio()即可。


相关文章
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
95 2
|
2月前
|
开发工具
uniapp, 短剧视频类App实现参考,支持滑动播放,仿抖音 仿陌陌 短视频 无限滑动播放 视频流
阿里云点播服务web播放器sdk,短剧视频类App实现参考。仿抖音 仿陌陌 短视频 无限滑动播放 视频流。无uniapp video 原生组件的层级、遮挡、覆盖问题,适合与不同功能视图组合使用,实现丰富的应用功能。
uniapp, 短剧视频类App实现参考,支持滑动播放,仿抖音 仿陌陌 短视频 无限滑动播放 视频流
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的医院综合管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的医院综合管理系统附带文章源码部署视频讲解等
46 5
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
122 4
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
81 4
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的大学生入伍人员管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的大学生入伍人员管理系统附带文章源码部署视频讲解等
92 4
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp宿舍管理系统的附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp宿舍管理系统的附带文章源码部署视频讲解等
84 3
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的家政平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的家政平台附带文章源码部署视频讲解等
62 3
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物医院系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物医院系统附带文章源码部署视频讲解等
56 2
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的实验室安全考试系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的实验室安全考试系统附带文章源码部署视频讲解等
65 2

热门文章

最新文章