小程序上传视频

喜欢ヅ旅行 2021-09-17 04:04 372阅读 0赞

Page({
    
      /**
       * 页面的初始数据
       */
      data: {
        webServer:'https://xxxx.xxx.com',
        src: '',
        webviewshow: 'hide',
        webviewurl: '',
        gid: "",
        uid:'',
        duration:'',
        height:'',
        size:'',
        width:'',
        ThumbPath:false,
        videoshow:'hide'
      },
    
      /** 
       * 生命周期函数--监听页面加载 
       */
      onLoad: function (options) {
        this.setData({ 
          gid: options.gid,
          uid: options.uid
        })
    
      }, 
      getLocalVideo: function () {
        var that = this;
        var session_key = wx.getStorageSync('session_key');
        wx.chooseVideo({
          maxDuration: 10,
          success: function (res1) {
            // 这个就是最终拍摄视频的临时路径了
            that.setData({
              src: res1.tempFilePath,
              duration: res1.duration,
              height: res1.height,
              size: res1.size,
              width: res1.width,
              videoshow:'thumb'
            })
            wx.showToast({
              title: '选择成功',
              icon: 'succes',
              duration: 2000,
              mask: true
            })
          },
          fail: function () {
            console.error("获取本地视频时出错");
          }
        })
      },
      uploadvideo: function () {
        var that = this;
        wx.showLoading({
          title: '上传中',
        })
        var src = this.data.src;
        if (src){
          that.setData({
            ThumbPath:true
          })
        }
        wx.uploadFile({
          url: that.data.webServer+'xxxxxx',//服务器接
          formData:{
            'uid': that.data.uid,
            'gid': that.data.gid,
            'duration': that.data.duration,
            'height': that.data.height,
            'size': that.data.size,
            'width': that.data.width
          }, 
          method: 'POST',//这句话好像可以不用
          filePath: src,
          header: { 
            'content-type': 'multipart/form-data'
          },
          name: 'files',//服务器定义的Key值
          success: function (e) {
            wx.hideLoading();
            if (typeof e.data != 'object') {
              e.data = e.data.replace(/\ufeff/g, "");//重点
              var data = JSON.parse(e.data);
              if (data.status == 1) {
                wx.showToast({
                  title: '上传成功',
                  icon: 'succes',
                  duration: 1000,
                  mask: true
                })
                setTimeout(function () {
                  that.backHtml();
                }, 1000)
              } else if (data.status == 2) {
                wx.showToast({
                  title: '文件过大',
                  icon: 'succes',
                  duration: 1000,
                  mask: true
                })
              }
            }
          },
          fail: function () {
            wx.showToast({
              title: '上传失败',
              icon: 'succes',
              duration: 1000,
              mask: true
            })
          }
        })
      },
      backHtml: function () {
        var that = this;
        wx.reLaunch({
          url: '/pages/index/index?gid=' + this.data.gid
        })
      },
    
      /**
       * 生命周期函数--监听页面初次渲染完成
       */
      onReady: function () {
    
      },
    
      /**
       * 生命周期函数--监听页面显示
       */
      onShow: function () {
    
      },
    
      /**
       * 生命周期函数--监听页面隐藏
       */
      onHide: function () {
    
      },
    
      /**
       * 生命周期函数--监听页面卸载
       */
      onUnload: function () {
    
      },
    
      /**
       * 页面相关事件处理函数--监听用户下拉动作
       */
      onPullDownRefresh: function () {
    
      },
    
      /**
       * 页面上拉触底事件的处理函数
       */
      onReachBottom: function () {
    
      },
    
      /**
       * 用户点击右上角分享
       */
      onShareAppMessage: function () {
    
      }
    })

page {
      height: 100%;
    }
    
    .container {
      display: flex;
      margin-top: 20rpx;
      justify-content: space-around;
    }
    
    .submitBtn {
      width: 80%;
      margin-top: 15px; 
    }
     
    .gobackBtn {
      width: 80%;
      margin-top: 15px;
    }
    
    .loginLabel {
      color: gray;
      font-size: 15px;
    }
    
    .inputText {
      float: right;
      text-align: right;
      margin-right: 22px;
      margin-top: 11px;
      font-size: 15px;
    }
    
    .inputView {
      padding: 5px;
      background-color: white;
      line-height: 45px;
      border: solid 1px whitesmoke;
    }
    
    .thumbbox {
      display: flex;
      justify-content: center;
      align-items: center;
    }
    
    .thumb {
      background-size: cover !important;
      background-position: center !important;
    }
    
    .contbox{
      margin-top: 50px;
    }
    .hide {
      display: none;
    }
     
    .show {
      display: block;
    }
    
    .cover{
      width: 200px;
      height: 200px;
      border: 1px solid red;
    }