Javascript 使用拖放在 youtube 上上传视频

Question

我想将视频上传到 youtube。问题陈述是用户将视频拖放到我的应用程序上，当用户单击上传按钮时，视频将上传到 youtube。

这段代码是我写的

$('#drop-files').bind('drop', function(e) {
    rc = count;
    var files = e.dataTransfer.files;
    //alert("files -"+files[0].path);
    count += files.length;
    $('#uploaded-holder').show();

    $.each(files, function(index, file) {
        console.log("aaaa : "+file);

        //alert("sarthi : "+file.name);
    if (!(files[index].type.match('image.*') || files[index].type.match('pdf.*') || files[index].type.match('video.*'))) {
            alert("ONLY IMAEG AND VIDEO")
            callModel();
        } else {
           // Start a new instance of FileReader*/
            var fileReader = new FileReader();

            var obj = {};
            // When the filereader loads initiate a function
            //alert("file "+file);
            fileReader.onload = (function(file) {

                var isVideo = 1;
                return function(e) {


                    // Push the data URI into an array
                    dataArray.push({
                        name : file.name,
                        value : this.result
                    });

                    // Move each image 40 more pixels across
                    //z = z+40;

                    var image;
                    var video;

                    if(file.type.match('image.*'))
                        image = this.result;
                    else if(file.type.match('pdf.*'))
                        image = "assets/img/pdf.png";
                    else if(file.type.match('video.*')){
                        video = this.result;
                    }

                    // Just some grammatical adjustments
                    /*if(dataArray.length == 1) {
                    $('#upload-button span').html("1 file to be uploaded");
                } else {
                    $('#upload-button span').html(dataArray.length+" files to be uploaded");
                }*/


                    if(file.type.match('image.*')) {
                        //alert("1");

                        var html = tmpl(template, {
                            image:image,
                            loadingbar:"loadingbar"+rc,
                            loadper:"loadper"+rc,
                            type:"type"+rc,
                            dd:"dd"+rc,
                            ed:"ed"+rc,
                            grey:"greey"+rc,
                            upbtn: "upbtn"+rc,
                            dderrorid: "dderr"+rc,
                            ederrorid: "ederr"+rc
                        });
                        obj = {
                            htmlstring:html,
                            type:"type"+rc,
                            dd:"dd"+rc,
                            ed:"ed"+rc,
                            upbtn: "upbtn"+rc,
                            loadbar: "loadingbar"+rc,
                            loadper:"loadper"+rc,
                            grey:"greey"+rc,
                            file:file,
                            flag:0,
                            dderrorid: "dderr"+rc,
                            ederrorid: "ederr"+rc
                        }
                        $('#dropped-files').append(html);

                        var now = new Date();
                        var today =  (now.getMonth() + 1) + '-' + now.getDate() + '-' + now.getFullYear();
                        $('#'+obj.ed).val(today);

                        uploadObject[rc] = obj;
                        $("#"+obj.upbtn).click(function(e){
                            if(!($("#uid").val() == "")){
                                $('.error').hide();
                                if(!($("#"+obj.dd).val() == "")){
                                    $('#'+obj.dderrorid + " span").hide();
                                    if(!($("#"+obj.ed).val() == "")){
                                        $('#'+obj.ederrorid + " span").hide();
                                        upload(e);
                                    } else {
                                        $('#'+obj.ederrorid + " span").show();
                                    }
                                } else {
                                    $('#'+obj.dderrorid + " span").show();
                                }
                            } else {
                                $('.error').show();
                            }
                        });

                        $("#"+obj.grey).click(function(e){
                            removeFiles(e);
                        });

                        rc++;
                    } 
                    else{
                        if($('#dropped-files > .video').length < maxFiles) {
                            //alert("2");

                            var html1 = tmpl(vtemplate, {
                                video:video,
                                loadingbar:"loadingbar"+rc,
                                loadper:"loadper"+rc,
                                type:"type"+rc,
                                dd:"dd"+rc,
                                ed:"ed"+rc,
                                grey:"greey"+rc,
                                upbtn: "upbtn"+rc,
                                dderrorid: "dderr"+rc,
                                ederrorid: "ederr"+rc
                            });
                            obj = {
                                htmlstring:html1,
                                type:"type"+rc,
                                dd:"dd"+rc,
                                ed:"ed"+rc,
                                upbtn: "upbtn"+rc,
                                loadbar: "loadingbar"+rc,
                                loadper:"loadper"+rc,
                                grey:"greey"+rc,
                                file:file,
                                flag:0,
                                dderrorid: "dderr"+rc,
                                ederrorid: "ederr"+rc
                            }
                            //$('#dropped-files').append(html1);

                            now = new Date();
                            today =  (now.getMonth() + 1) + '-' + now.getDate() + '-' + now.getFullYear();
                            $('#'+obj.ed).val(today);

                            uploadObject[rc] = obj;
                            $("#"+obj.upbtn).click(function(e){
                                if(!($("#uid").val() == "")){
                                    $('.error').hide();
                                    if(!($("#"+obj.dd).val() == "")){
                                        $('#'+obj.dderrorid + " span").hide();
                                        if(!($("#"+obj.ed).val() == "")){
                                            $('#'+obj.ederrorid + " span").hide();
                                            $("input[type='file']")
                                            .prop("files", e.originalEvent.dataTransfer.files)  // put files into element
                                            .closest("form")
                                            .submit(); 
                                        } else {
                                            $('#'+obj.ederrorid + " span").show();
                                        }
                                    } else {
                                        $('#'+obj.dderrorid + " span").show();
                                    }
                                } else {
                                    $('.error').show();
                                }
                            });

                            $("#"+obj.grey).click(function(e){
                                removeFiles(e);
                            });

                            rc++;
                        } 
                        $('#dropped-files').append(html1);
                    }
                };
            })(files[index]);
            fileReader.readAsDataURL(file);
        }
    });
});

我无法获取应用程序中删除的文件的绝对路径。

提前致谢!

Answer 1

您不能在服务器端访问客户端(本地地址)。这可能对您有帮助!

Passing path to uploaded file from HTML5 drag & drop to input field和 http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html