小程序实现文件流上传视频

wxml文件代码

<view class="publish_div">
<view class="bottom_div">
                <view class="title"><span class="reds">*</span>素材视频</view>
                <ul class="goods-img-list flex-def flex-wrap">
                    <li wx:if="{{video!=''}}" class="video_li flex-def flex-cCenter flex-zCenter">
                        <view class="del_img flex-def flex-cCenter flex-zCenter"><image src="./static/images/icon_bofang.png"
                               style="height: 70rpx;width: 70rpx;" alt=""/></view>
                        <image src="{{video_img}}"
                            alt="" class="video_img"/>
                        <view class="del_video" bindtap="del_video()">删除</view>
                    </li>
                    <li class="list-one" wx:else>
                        <view class="upload-img">
                            <view class="main flex-def flex-cCenter flex-zCenter" bindtap="chooseVideo">
                                <view class="upload-ys flex-def flex-cCenter flex-zCenter">
                                    <view class="tu"><image src="./static/images/icon_up_s.png" alt=""/></view>
                                </view>
                            </view>
                        </view>
                    </li>
                </ul>
            </view>
</view>

wxss文件代码

.publish_top .goods-img-list>li {
	width: 200rpx;
	height: 200rpx;
	position: relative;
	font-size: 0;
	border-radius: 24rpx;
	margin-bottom: 30rpx;
	margin-right: 20rpx;
}

.publish_top .goods-img-list>li:nth-child(9) {
	margin-right: 0;
}

.publish_top .goods-img-list>li>image {
	height: 100px;
	width: 100%;
	border-radius: 24rpx;
}

.publish_top .goods-img-list .upload-img .main {
	width: 100%;
	height: 200rpx;
	position: relative;
	border-radius: 24rpx;
}

.publish_top .goods-img-list .upload-img input[type=file] {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 95;
	opacity: 0;
}

.publish_top .goods-img-list .upload-img .upload-ys {
	width: 100%;
	height: 100%;
	color: #999;
	border-radius: 24rpx;
	background: #F7F7F8;
}

.publish_top .goods-img-list .upload-img .upload-ys .tu {
	display: inline-block;
	width: 60rpx;
	height: 60rpx;
}

.publish_top .goods-img-list .upload-img .upload-ys .tu>image{
	width: 100%;
	height: 100%;
	display: block;
}

.publish_top .goods-img-list .upload-img .upload-ys p {
	font-size: 18rpx;
	color: #c5c5c5;
	line-height: 1;
}

.publish_top .goods-img-list .del {
	position: absolute;
	width: 40rpx;
	height: 40rpx;
	top: -14rpx;
	right: -14rpx;
	border-radius: 50%;
	z-index: 100;
}
.publish_div .title {
	font-size: 32rpx;
	color: #333;
	margin-right:30rpx;
	height: 106rpx;
	line-height: 106rpx;
}

js文件

data: {
		video: '',//视频
		video_img: '',
	},
	// 选择视频
	chooseVideo: function () {
		var _this = this
		wx.chooseVideo({
			success: function (res) {
				console.log(res)
				console.log('视频路径', res.tempFilePath)
				// 将数据转成文件流
				wx.getFileSystemManager().readFile({
					filePath: res.tempFilePath,
					success: function (res1) {
						console.log('文件流数据:', res1.data);
						_this.upVideo(res.tempFilePath, res1.data)
					},
					fail: function (error) {
						wx.showToast({
							title: '上传失败',
							icon: 'none'
						})
						console.log('上传失败', error)
					}
				});

			},
			fail: function (res) {
				wx.showModal({
					title: '提示',
					content: "请上传正确的文件格式",
				})
			}
		})
	},
	// 上传视频
	upVideo: function (tempFilePath, video) {
	//tempFilePath 视频路径
	//video 文件流数据
		var _this = this;
		wx.showLoading({
			title: '上传视频中...',
		})
		wx.uploadFile({
			url: '', //接口
			filePath: tempFilePath,//视频路径
			name: 'file',
			formData: {
				type: 2,
				video: video//后端接口需要的文件流参数
			},
			success: function (res) {
				wx.hideLoading()
				if (res.statusCode === 200) {
					var data = JSON.parse(res.data)
					if (data.errcode == 0) {
						_this.setData({
							video: data.data.url,
							video_img: data.data.video_img
						})
					} else {
						wx.showToast({
							title: data.errmsg,
							icon: 'none'
						})
					}
				}
			},
			fail: function (error) {
				console.log(error);
				wx.hideLoading()
			}
		})
	},
	// 删除视频
	del_video: function () {
		var that = this;
		that.setData({
			video: ''
		})
	},

ps:因公司后端必须要上传文件流数据，所以只能转成文件流形式