鍍金池/ 問(wèn)答/HTML/ axios 如何上傳視頻文件？

axios 如何上傳視頻文件？

<h4>上傳老師介紹視頻</h4>
            <div class="teacher-avatar">
                <!-- <IntroduceTeacherVideo/> -->
                <Button type="primary" icon="ios-search">
                    <label class="btn" for="teacherIntroductionVideo">上傳老師介紹視頻</label>
                </Button>
                <input type="file" 
                    id="teacherIntroductionVideo" 
                    style="position:absolute; clip:rect(0 0 0 0);" 
                    accept="audio/mp4, video/mp4" 
                    @change="uploadTeacherVideo($event)">
            </div>
uploadTeacherVideo(e){
            var file = e.target.files[0]
            if (!/\.(mp4|avi)$/.test(e.target.value)) {
                this.$Message.error({
                    content:'視頻類型必須是.mp4、.avi中的一種',
                    duration:3
                });
                return false
            }
            let data = window.URL.createObjectURL(new Blob([e.target.result]))

            let formdata = new FormData();
            formdata.append('imgStream',data);
            console.log('正在上傳視頻。。。')
            this.uploadFileToQiniu(formdata);
        },
        uploadFileToQiniu(formdata){
            this.$post(`${this.$url}/teacher/uploadFileToQiniu`,formdata)
            .then(res=>{
                if(res.data.success){
                    let hashKey = res.data.data;
                    this.avatarSrc = `${this.$qiniuImgUrl}/${hashKey.key}`;
                    this.$Message.success({
                        content:'上傳成功！',
                        duration:3
                    });
                }else{
                    this.$Message.error({
                        content:res.data.msg,
                        duration:3
                    });
                }
            })
            .catch(err=>{
            })

這樣寫好像報(bào)錯(cuò)
clipboard.png

回答
編輯回答
風(fēng)清揚(yáng)

改成這樣就OK了

uploadTeacherVideo(e){
            var file = e.target.files[0]
            if (!/\.(mp4|avi)$/.test(e.target.value)) {
                this.$Message.error({
                    content:'視頻類型必須是.mp4、.avi中的一種',
                    duration:3
                });
                return false
            }
            let data = e.target.result;

            let formdata = new FormData();
            formdata.append('imgStream',file);
            console.log('正在上傳視頻。。。')
            this.uploadFileToQiniu(formdata);
        },
2017年8月4日 09:17