相思资源网 Design By www.200059.com

本文实例为大家分享了小程序实现上传视频功能的具体代码,供大家参考,具体内容如下

.js文件

// miniprogram/pages/message/messageForm/messageForm.js
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
 })
 },

 chooseVideo: function () {
 var that = this
 wx.chooseVideo({
 success: function (res) {
 that.setData({
 src: res.tempFilePath,
 })
 }
 })
 },
 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"htmlcode">
<view class='contbox'>
 <view class='thumbbox'>
 <video class="{{videoshow}}" src="/UploadFiles/2021-04-02/{{src}}">

.wxss

.thumbbox {
 display: flex;
 justify-content: center;
 align-items: center;
}

小程序实现上传视频功能

为大家推荐现在关注度比较高的微信小程序教程一篇:《微信小程序开发教程》小编为大家精心整理的,希望喜欢。

更多精彩内容请参考专题《ajax上传技术汇总》,《javascript文件上传操作汇总》和《jQuery上传操作汇总》进行学习。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

标签:
小程序,上传视频

相思资源网 Design By www.200059.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
相思资源网 Design By www.200059.com

评论“小程序实现上传视频功能”

暂无小程序实现上传视频功能的评论...

稳了!魔兽国服回归的3条重磅消息!官宣时间再确认!

昨天有一位朋友在大神群里分享,自己亚服账号被封号之后居然弹出了国服的封号信息对话框。

这里面让他访问的是一个国服的战网网址,com.cn和后面的zh都非常明白地表明这就是国服战网。

而他在复制这个网址并且进行登录之后,确实是网易的网址,也就是我们熟悉的停服之后国服发布的暴雪游戏产品运营到期开放退款的说明。这是一件比较奇怪的事情,因为以前都没有出现这样的情况,现在突然提示跳转到国服战网的网址,是不是说明了简体中文客户端已经开始进行更新了呢?