file文件上传获取地址将其渲染出来不经过后台

мо仙堡杠把子ご灬

已于 2023-04-07 09:18:53 修改

阅读量210

点赞数 1

文章标签：做一个有知识的流氓

于 2019-07-26 17:20:04 首次发布

本文链接：https://blog.csdn.net/weixin_43553701/article/details/97397394

版权

都说强扭的瓜不甜，可我尝了还不错

当咱们使用input ref="fileads" id="file" @change="change" type="file" accept="video/*" />上传文件的时候需要一些操作,但是又不能上传服务器,如果上传服务器的话就会出现一堆脏数据,
这是在vue中的

<input ref="fileads" id="file" @change="change" type="file" accept="video/*" />
<br />
<img src="" alt="Image to be upload." />
<video controls src=""></video>
<div id="info"></div>

getObjectURL(file) {  
                var url = null;  
                if (window.createObjcectURL != undefined) {  
                    url = window.createOjcectURL(file);  
                } else if (window.URL != undefined) {  
                    url = window.URL.createObjectURL(file);  
                } else if (window.webkitURL != undefined) {  
                    url = window.webkitURL.createObjectURL(file);  
                }  
                return url;  
            },
            change() {
                var dFile = this.$refs.fileads;
                var imgurl = this.getObjectURL(dFile.files[0]);
                var file = this.files[0];
                var url = getObjectURL(file);//blob:http://doamin.com/5376c16a-02f9-489f-b30c-97a1808d5724
                console.log(url);
                var asad = url.substr(5,url.length)
                var dImg = document.getElementsByTagName('img')[0];
                var dvideo = document.getElementsByTagName('video')[0];
                console.log(dvideo);
                dvideo.src = imgurl
                alert(imgurl)
            },