uniapp上传500M限制实现

前言：app安卓端选择的视频最大只支持180MB，如需突破该限制请使用原生插件https://ext.dcloud.net.cn/search?q=%E6%96%87%E4%BB%B6%E9%80%89%E6%8B%A9
最终选择uniapp自带的扩展组件: uFilePicker
地址：
https://uniapp.dcloud.net.cn/component/uniui/uni-file-picker.html#

注意：
在模拟器端上传160MB请求1.5min后会取消请求,
网络请求的 超时时间 可以统一在 manifest.json 中配置 networkTimeout，
默认超时时间为60000 ms 即 1min
在manifest.json文件和name同级的部分添加代码
“networkTimeout” : {
“request” : 2000000,
“uploadFile” : 2000000
}

核心代码：

结构:
    <u-form-item label="宣教视频(不超过500M):" label-width="150" prop="videos">
                    <view class="chooseVideo">
                    // 显示视频
                        <view class="item" v-if="videoValue.url">
                            <view v-if="videoValue.url" class="videoBox">
                                <video
                                    :id="videoValue.url"
                                    class="video"
                                    play-btn-position="center"
                                    :src="videoValue.url"
                                    :show-progress="false"
                                    :show-play-btn="true"
                                    :show-center-play-btn="true"
                                    :enable-play-gesture="true"
                                    :show-casting-button="true"
                                    :show-screen-lock-button="true"
                                    :enable-progress-gesture="false"
                                    :show-mute-btn="true"
                                    :muted="false"
                                    :debug="true"
                                ></video>
                            </view>
                            <view v-else class="videoBox">
                                <image
                                    class="video"
                                    :src="`${baseUrl}static-wechat/hw/icon/no-video.png`"
                                />
                            </view>
                            <view class="deleteIcon" @click="deleteVideo()">
                                <u-icon name="close" color="#ffffff" size="20"> </u-icon>
                            </view>
                        </view>
                        // 没有视频时显示添加按钮
                        <view class="addBtn item" v-if="!videoValue.url">
                        // 扩展组件
                            <uni-file-picker
                                :disabled="isUploadVideo"
                                v-model="videoValue"
                                fileMediatype="video"
                                return-type="object"
                                @select="select"
                                @progress="progress"
                                @success="success"
                                @fail="fail"
                            >
                                <view class="box">
                                    <u-icon name="plus" size="40"></u-icon>
                                    <view class="txt">选择视频</view>
                                </view>
                            </uni-file-picker>
                        </view>
                    </view>
                </u-form-item>
 逻辑:
import uniFilePicker from '@/components/uniFilePicker'
export default {
    data() {
        // 视频
        videoValue: {},
        // 视频上传的地址
        baseUrl: config.baseUrl,
    },
    components: {
        uniFilePicker,
    },
    method: {
        // 上传音频
        uploadVoice(voicePath) {
            let me = this;
            let promise = new Promise((resolve, reject) => {
                uni.showLoading({
                    icon: 'loading',
                    title: '正在上传',
                    mask: true,
                });
                uni.uploadFile({
                    url: e.baseUrl + 'cloudFile/common/uploadFile',
                    filePath: voicePath,
                    name: 'file',
                    formData: {
                        user: 'test',
                    },
                    success: (res) => {
                        console.log(res, 'success');
                        let r = JSON.parse(res.data);
                        if (r.result == 0) {
                            resolve(r.data[0]);
                            console.log(r.data, '上传文件返回');
                            this.isUploadVideo = false;
                            uni.hideLoading();
                        } else {
                            this.$refs.uToast.show({
                                title: err.errMsg,
                                type: 'error',
                            });
                            this.isUploadVideo = false;
                            uni.hideLoading();
                            reject({});
                        }
                    },
                    error: (err) => {
                        console.log(err, 'err');
                        this.$refs.uToast.show({
                            title: err.errMsg,
                            type: 'error',
                        });
                        this.isUploadVideo = false;
                        uni.hideLoading();
                        reject({});
                    },
                    complete: (r) => {
                        if (!r?.data) {
                            this.$refs.uToast.show({
                                title: r.errMsg,
                                type: 'error',
                            });
                            this.isUploadVideo = false;
                            uni.hideLoading();
                            reject({});
                        }
                        console.log(r, 'rrrrr');
                    },
                });
            });
            return promise;
        },
         // 获取上传状态
        async select(e) {
            var self = this;
            console.log('选择文件：', e);
            const res = e.tempFiles[0];
            self.isUploadVideo = true;
            if (res.size > 1024 * 1024 * 500) {
                self.$refs.uToast.show({
                    title: '视频最大上传500MB',
                    type: 'error',
                });
                self.videoValue = {};
                self.videoList = [];
                self.isUploadVideo = false;
                return;
            } else {
                self.videoValue = {
                    name: res.name,
                    extname: res.extname,
                    url: res.url,
                };
                let data = await self.uploadVoice(res.url);
                self.videoList.push({
                    id: data.id,
                    name: data.fileName,
                    type: 'video/mp4',
                });
            }
        },
        // 删除一条视频
        deleteVideo(i) {
            uni.showModal({
                title: '提示',
                content: '是否要删除此视频',
                success: (res) => {
                    if (res.confirm) {
                        this.videoValue = {};
                        this.videoList = [];
                        this.isUploadVideo = false;
                        uni.hideLoading();
                        // this.videoList.splice(i, 1);
                    }
                },
            });
        },
        
    }
}
样式:
       .chooseVideo {
            margin-bottom: 100upx;
            display: flex;
            flex-wrap: wrap;
            .item {
                width: 200upx;
                height: 200upx;
                overflow: hidden;
                margin: 10rpx;
                background: #f4f5f6;
                position: relative;
                border-radius: 10rpx;
                display: flex;
                align-items: center;
                justify-content: center;
                .deleteIcon {
                    position: absolute;
                    top: 10rpx;
                    right: 10rpx;
                    z-index: 10;
                    background-color: #fa3534;
                    border-radius: 100rpx;
                    width: 44rpx;
                    height: 44rpx;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                }
            }
            .addBtn {
                flex-direction: column;
                color: #606266;
                font-size: 26rpx;
                .box {
                    width: 200upx;
                    height: 200upx;
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    u-icon {
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                    }
                    .txt {
                        margin-top: 20rpx;
                        line-height: 40rpx;
                    }
                    .delete {
                        position: absolute;
                        top: 10rpx;
                        right: 10rpx;
                        z-index: 10;
                        background-color: #fa3534;
                        border-radius: 100rpx;
                        width: 44rpx;
                        height: 44rpx;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                    }
                }
            }
        }