zoukankan      html  css  js  c++  java
  • 小程序上传图片、视频封装

    小程序图片上传封装

    app.js中 写入

      wxPromisify(fn) {
        return function (obj = {}) {
          return new Promise((resolve, reject) => {
            obj.success = function (res) {
              resolve(res)
            }
            obj.fail = function (res) {
              reject(res)
            }
            fn(obj)//执行函数,obj为传入函数的参数
          })
        }
      }
    

      在utils文件夹下新建mediaUtils.js文件

    let app = getApp();
    
    
    var chooseImage = app.wxPromisify(wx.chooseImage) // 从本地相册选择图片或使用相机拍照
    var chooseVideo = app.wxPromisify(wx.chooseVideo) // 拍摄视频或从手机相册中选视频
    var getImageInfo = app.wxPromisify(wx.getImageInfo) // 获取图片信息
    

      图片上传临时信息目录

    // 获取图片临时目录信息
    function getImagePath(count, sizeNum, sourceNum) {
      let sizeType = []
      switch (sizeNum) {
        case '1':
          sizeType = ["original"];
          break;
        case '2':
          sizeType = ["compressed"];
          break;
        default:
          sizeType = ['original', 'compressed'];
          break;
      }
      let sourceType = []
      switch (sourceNum) { 
        case '1':
          sourceType = ["album"];
          break;
        case '2':
          sourceType = ["camera"];
          break;
        default:
          sourceType = ['album', 'camera'];
          break;
      }
      let ref = false;
      return new Promise(function(resolve, reject) {
        chooseImage({
          count: count, //最多可以选择的图片张数
          sizeType: sizeType, //所选的图片的尺寸
          sourceType: sourceType, //选择图片的来源
        }).then(res => {
          resolve(res)
        })
      })
    }
    

      从本地相册选择图片或使用相机拍照

    function getImageObj(count, sizeNum, sourceNum) {
      return new Promise(function(resolve, reject) {
        getImagePath(count, sizeNum, sourceNum).then(res => {
          if (res.tempFiles.length > 0) {
            var promise = Promise.all(res.tempFiles.map((item, index) => {
              return new Promise(function(resolve, reject) {
                let image = {
                  size: item.size
                }
                getImageInfo({
                  src: item.path
                }).then(res => {
                  image.sizeStr = getImageSize(image.size)
                  image.width = res.width
                  image.height = res.height
                  image.path = res.path
                  image.type = res.type
                  resolve(image);
                })
              });
            })).then(res => {
              resolve(res)
            })
          }
        })
      })
    }
    

      获取图片大小MB

    var getImageSize = function(size) {
      var sizeNum = size / 1024
      if (sizeNum > 1024) {
        sizeNum = (sizeNum / 1024).toFixed(2) + "MB"
      } else {
        sizeNum = sizeNum.toFixed(2) + "KB"
      }
      return sizeNum
    }
    

       上传视频、获取视频信息

    function getVideoInfo(sourceTypeNum, maxDuration, compressed) {
      let sourceType = []
      switch (sourceTypeNum) { //视频选择的来源 
        case 1:
          sourceType = ['album']
          break;
        case 2:
          sourceType = ['camera']
          break;
        default:
          sourceType = ['album', 'camera']
          break;
      }
      console.log(sourceType, sourceTypeNum)
      return new Promise(function(resolve, reject) {
        chooseVideo({
          sourceType: sourceType,
          compressed: compressed, //是否压缩所选择的视频文件
          maxDuration: maxDuration //拍摄视频最长拍摄时间,单位秒 默认60
        }).then(res => {
          res.path = res.tempFilePath   //选定视频的临时文件路径 (本地路径)
          res.type = res.path.substring(res.path.lastIndexOf('.') + 1)
          res.cover = res.thumbTempFilePath
          resolve(res)
        })
      })
    }
    

      最后导出文件

    module.exports = {
      getImagePath: getImagePath,
      getImageObj: getImageObj,
      getImageInfo: getImageInfo,
      getVideoInfo: getVideoInfo
    };
    

      

  • 相关阅读:
    Kafka相关知识点
    好的前端界面
    linux下配置go环境
    插入排序(数据是局部有序的)
    选择排序
    spring jpa 条件查询统计
    java代码优化
    JAVA创建临时文件IO
    spring防止表单重复提交
    Java文件下载时所输出文件名乱码问题
  • 原文地址:https://www.cnblogs.com/BySee1423/p/12613323.html
Copyright © 2011-2022 走看看