taro小程序内如何上传本地文件(上传图片和视频,分小程序和H5页面)

// H5页面上传音频
const handleUploadRecord = async () => {
    audio.src && (audio.src = encodeURI(audio.src));
    audio.seek && audio.seek(0);
    setAudioUrl('');
​
    const _loginInfo = login._loginInfo;
    if (isH5()) {
        // <input id="file-ele" type="file" style="display: none" />
        const ele = document.createElement('input');
        ele.id = 'file';
        ele.type = 'file';
        ele.style.display = 'none';
        ele.addEventListener('change', function (e) {
            document.body.removeChild(ele);
            if (e.target.files.length === 0) {
                return;
            }
            const file = e.target.files[0];
            const fd = new FormData();
            fd.append('file', file);
            fd.append('customerId', _loginInfo.customerId);
            fd.append('compId', _loginInfo.compId);
            fd.append('fontVideoFrameId', props.fontVideoFrameId);
            fd.append('projectId', props.projectId);
            fd.append('materialType', 'uploadAudio');

            const isLimit = file.size / 1024 / 1024 < 50; // 单位M
            if (!isLimit) {
                showToast(toastId, 'fail', `音频文件超过50M,请重新上传`);
                return;
            }
            dispatch({params: {loading: true, title: '上传中'}});
            fetch(`${login.host}/projectMaterial/upload`, {
                method: 'POST',
                body: fd
            })
                .then(res => res.json())
                .catch(error => {
                    showToast(toastId, 'fail', '请上传wav格式的音频文件');
                    dispatch({params: {loading: false, title: ''}});
                })
                .then(data => {
                    console.log(data, 'datadatadatadatadatadatadata');
                    if (data.code != 8) {
                        showToast(toastId, 'fail', `${data.bean || '请上传wav格式的音频文件'}`);
                        dispatch({params: {loading: false, title: ''}});
                    } else {
                        showToast(toastId, 'success', '上传成功');
                        dispatch && dispatch({params: {loading: false, title: ''}});
                        props.handleQueryUploadAudioList && props.handleQueryUploadAudioList();
                        // 查询完后滚动到第一条记录
                        scrollToTop();
                    }
                });
        });
        document.body.appendChild(ele);
        ele.dispatchEvent(new MouseEvent('click'));
    }
};


// 小程序内上传图片
const handleCustomUpload = async () => {
        const __loginInfo = Taro.getStorageSync('__loginInfo');
        Taro.chooseImage({
            count: 1,
            sizeType: ['original', 'compressed'],
            sourceType: ['album', 'camera'],
            success(res) {
                dispatch({params: {loading: true, title: '上传中'}});
                const tempFiles = res.tempFilePaths;
                Taro.uploadFile({
                    url: `${login.host}/projectMaterial/upload`,
                    filePath: tempFiles[0],
                    name: 'file',
                    formData: {
                        customerId: __loginInfo.pcInfo.customerId,
                        compId: __loginInfo.pcInfo.compId,
                        fontVideoFrameId: props.fontVideoFrameId,
                        projectId: props.projectId,
                        materialType: 'background'
                    },
                    success(result) {
                        let data = {};
                        try {
                            data = JSON.parse(result.data);
                        } catch (error) {
                            data = {};
                        }
                        if (data.code != 8) {
                            showToast(toastId, 'fail', `${data.bean || '请上传 JPG/JPEG/PNG 格式图片'}`);
                            dispatch({params: {loading: false, title: ''}});
                        } else {
                            showToast(toastId, 'success', '上传成功');
                            dispatch({params: {loading: false, title: ''}});
                            const queryParams = {
                                curPage: 1,
                                pageSize: state.pageSize,
                                activeKeys: 1,
                                // 1:竖版 2:横板
                                backgroundSize: Taro.getCurrentInstance().router.params.type == 'v' ? 1 : 2,
                                materialType: 'background'
                            };
                            handleReset(queryParams);
                        }
                    },
                    fail() {
                        showToast(toastId, 'fail', '请上传 JPG/JPEG/PNG 格式图片');
                        dispatch({params: {loading: false, title: ''}});
                    }
                });
            },
            fail() {
                dispatch({params: {loading: false, title: ''}});
            }
        });
    };


const handleVideoWithdraw = () => {
    const __loginInfo = Taro.getStorageSync('__loginInfo');
    Taro.chooseMedia({
        count: 1,
        mediaType: ['video'],
        sizeType: ['original', 'compressed'],
        sourceType: ['album', 'camera'],
        success(res) {
            // console.log(res, 'ressssssss');
            userStore.loading = true;
            userStore.loadingText = '上传中';
            const tempFiles = res.tempFiles;
            Taro.uploadFile({
                url: `${login.host}/projectMaterial/upload`,
                filePath: tempFiles[0].tempFilePath,
                name: 'video',
                success(result) {
                    // console.log(result, 'result');
                    let data = {};
                    try {
                        data = JSON.parse(result.data);
                    } catch (error) {
                        data = {};
                    }
                    if (data.code != 8) {
                        showToast('script-withdraw', 'fail', `${data.bean || '请上传 JPG/JPEG/PNG 格式图片'}`);
                        userStore.loading = false;
                        userStore.loadingText = '';
                    } else {
                        showToast('script-withdraw', 'success', '上传成功');
                        userStore.loading = false;
                        userStore.loadingText = '';
                    }
                },
                fail() {
                    showToast('script-withdraw', 'fail', '请上传 JPG/JPEG/PNG 格式图片');
                    userStore.loading = false;
                    userStore.loadingText = '';
                }
            });
        },
        fail() {
            userStore.loading = false;
            userStore.loadingText = '';
        }
    });
};

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值