javascript - 用于本地文件系统的CreateObjectURL

为什么会出现“找不到功能”错误？

block head


script.
   function convert_local_file()  {
    var URL = window.URL || window.webkitURL
     , file = this.file;
    var value = window.webkitURL.createObjectURL("file:///home/sanika/NodeJS/Projects/project1/routes/../videosTrans/Node.js tutorial for beginners - an introduction to Node.js with Express2.js.mp4");
    return value;
   }


block content
      video(id="videolink" width="400" height="320" type="video/mp4" controls)
       script.
             document.getElementById('videolink').src = convert_local_file();

图片：

最佳答案

我不确定您的最终目标是什么，但是您在函数中对createObjectURL的引用可能不正确。您要做的是使用输入标签获取本地文件。

class LocalFileVideoPlayer {
    constructor(input, video) {
        this.input = input;
        this.video = video;
        this.input.addEventListener('change', this.onChange, false);
    }

    static createObjectURL(obj) {
        return (URL || webkitURL).createObjectURL(obj);
    }

    onChange = () => {
        const [file] = this.input.files;
        if (!file) {
            alert('No file selected');
            return;
        }
        if (!this.video.canPlayType(file.type)) {
            alert('Cannot play video of type ' + file.type);
            return;
        }
        this.playVideo(file);
    }

    destroy = () => {
        this.input.removeEventListener('change', this.onChange, false);
        this.input = null;
        this.video = null;
    }

    playVideo = (file) => {
        var url = LocalFileVideoPlayer.createObjectURL(file);
        this.video.src = url;
    }
}

var localFileVideoPlayer = new LocalFileVideoPlayer(
    document.querySelector('input'),
    document.querySelector('video')
);

video, input {
  display: block;
}

<input type="file" accept="video/*" />
<video controls autoplay></video>

关于javascript - 用于本地文件系统的CreateObjectURL，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/26513343/