Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

having trouble in uploading large files with plupload and vimeo #275

Open
rochella0527 opened this issue Sep 27, 2020 · 0 comments
Open

Comments

@rochella0527
Copy link

this is my html

The video is on the Queue uploads try another one.
Title
                        <div class="col-sm-4">
                            <div class="form-group ">
                                <label for="usr">Select Subject:</label>
                                <select type="text" class="form-control w-100 dropdown btn-lg btn-default dropdown-toggle" name="subject" id="subject" >
                                    <option></option> 
                                    <option  value="IC-1">IC-1</option>
                                    <option value="IC-2">IC-2</option>
                                    <option value="IC-3">IC-3</option>
                                </select>
                            </div>
                        </div>

                        <div class="col-sm-12">
                            <div class="form-group">
                                <label>Video Description:</label>
                                <textarea type="text" name="description" class="form-control" rows="3" style="width: 100%;" id="description"></textarea>
                            </div>
                        </div>
                    </div>    

                    <div class="row">
                        <!-- <div class="col-sm-6">
                            <div class="form-group">
                            <label for="usr">Image :</label>
                            <input type="file" class="form-control" id="image" class="item" name="image" accept="image/*" style="display: block; width: 220px; height: 250px; opacity: 0.3; background-position: center; background-repeat: no-repeat, repeat; background: url('uploads/images/video.jpg')" >
                            </div>
                            
                        </div> -->
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label for="usr">Image :</label>
                                <!-- <input type="file" class="form-control" id="img" name="img_url" placeholder="example.jpg" accept="image/*" onchange="validateImage();" required> -->
                                <textarea type="text"  id="img" name="img_url" class="form-control" style="width: 100%;" placeholder="e.g. https://pinterest.com/example.png"></textarea>
                            </div>
                         </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                            <label>Video File:</label>
                            <input type="file" id="browse" class="img-fluid item" name="file" accept="video/*" style="display: block; width: 220px; height: 250px; opacity: 0.3; background-size: cover; background-position: center; background-repeat: no-repeat, repeat; background: url('uploads/images/video.jpg')" required></input>
                            </div>
                            <button  id="start-upload" href="javascript:;" class="btn btn-primary float-right">START UPLOAD</button>
                        </div>
                                        
                        
                        
                    </div>             
                </form>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="container">
               
            <ul id="filelist"><h4><b>Upload in Queue</b></h4></ul>
 
            <pre id="console"></pre>
            </div>
        </div>
    </div>
</div>
<!-- end of container add  -->

<div class="container">
<div class="row">
   <div class="col-lg-4">
        <div class="container w-100">
          <h5>INTEGRATED COURSE 1</h5>
            <div class="card ">  
                <div class="col-md-12">
                <?php while($row = $ICI_1->fetch_assoc()): ?>
                    <div class="recent-videos d-flex flex-row mt-4 mb-2">
                         <iframe src="<?php echo $row['url']; ?>" class="img-thumbnail rounded float-left" style="width: 150px; height: 150px;"> </iframe>
                        <div class="details p-2" >
                            <h5 style="text-transform: uppercase;"><?php echo $row['title']; ?></h5>
                            <span>Description: <?php echo $row['description']; ?></span>
                            <a href="video-manage.php?delete=<?php echo $row['id']; ?>" class="btn btn-sm btn-danger">Delete</a>
                        </div>
                    </div>
                     <?php endwhile; ?>
                </div>
            </div>
        </div>
  </div>

  <div class="col-lg-4">
        <div class="container w-100">
          <h5>INTEGRATED COURSE 2</h5>
            <div class="card ">  
                <div class="col-md-12">
                  <?php while($row = $ICI_2->fetch_assoc()): ?>
                    <div class="recent-videos d-flex flex-row mt-4 mb-2">
                         <iframe src="<?php echo $row['url']; ?>" class="img-thumbnail rounded float-left" style="width: 150px; height: 150px;"> </iframe>
                        <div class="details p-2" >
                            <h5 style="text-transform: uppercase;"><?php echo $row['title']; ?></h5>
                            <span>Description: </br><?php echo $row['description']; ?></span>
                            <a href="video-manage.php?delete=<?php echo $row['id']; ?>" class="btn btn-sm btn-danger">Delete</a>
                        </div>
                    </div>
                     <?php endwhile; ?>
                </div>
            </div>
        </div>
  </div>
  <div class="col-lg-4">
        <div class="container w-100">
          <h5>INTEGRATED COURSE 3 VIMEO API TEST</h5>
            <div class="card ">  
                <div class="col-md-12">
                  <?php while($row = $ICI_3->fetch_assoc()): ?>
                    <div class="recent-videos d-flex flex-row mt-4 mb-2">
                         <iframe src="<?php echo $row['url']; ?>" class="img-thumbnail rounded float-left" style="width: 150px; height: 150px;"> </iframe>
                        <div class="details p-2" >
                            <h5 style="text-transform: uppercase;"><?php echo $row['title']; ?></h5>
                            <span>Description: </br><?php echo $row['description']; ?></span>
                            <a href="video-manage.php?delete=<?php echo $row['id']; ?>" class="btn btn-sm btn-danger">Delete</a>
                        </div>
                    </div>
                     <?php endwhile; ?>
                </div>
            </div>
        </div>
  </div>
</div>
<script type="text/javascript"> var uploader = new plupload.Uploader({ browse_button: 'browse', url: 'upload.php', runtimes: 'html5,html4', chunk_size: '100mb', max_retries: 3, filters: { mime_types : [{ title : "Video files", extensions : "mp4,mpeg,mkv" }] } // multipart: true }); uploader.init(); uploader.bind('FilesAdded', function(up, files) { var html = ''; plupload.each(files, function(file) { html += '
  • ' + file.name + ' (' + plupload.formatSize(file.size) + ')
  • '; console.log(file); }); document.getElementById('filelist').innerHTML += html; }); uploader.bind("BeforeUpload", function(up,file) { console.log(file.id); var titleField = $("#title").val(); var subjectField = $("#subject").val(); var descriptionField = $("#description").val(); var imageSrcField = $("#img_url").val(); uploader.settings.multipart_params = {title: titleField,subject:subjectField,description:descriptionField,image:imageSrcField}; }); uploader.bind('UploadProgress', function(up, file) { document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '' + file.percent + "%"; }); uploader.bind('Error', function(up, err) { document.getElementById('console').innerHTML += "\nError #" + err.code + ": " + err.message; }); document.getElementById('start-upload').onclick = function() { uploader.start(); document.getElementById("title").value = ""; document.getElementById("subject").value = ""; document.getElementById("description").value = ""; document.getElementById("img").value = ""; var div = document.querySelector(".fade"); div.classList.add("elementToFadeInAndOut"); setTimeout(function(){div.classList.remove("elementToFadeInAndOut");}, 4000); console.log(uploader.settings.multipart_params); </script> $ok, "info"=>$info])); } // (B) INVALID UPLOAD if (empty($_FILES) || $_FILES['file']['error']) { verbose(0, "Failed to move uploaded file."); } // (C) UPLOAD DESTINATION // ! CHANGE FOLDER IF REQUIRED ! $filePath = __DIR__ . DIRECTORY_SEPARATOR . "uploads/videos"; // $imagePath = __DIR__ . DIRECTORY_SEPARATOR . "uploads/images/"; if (!file_exists($filePath)) { if (!mkdir($filePath, 0777, true)) { verbose(0, "Failed to create $filePath"); } } $fileName = isset($_REQUEST["name"]) ? $_REQUEST["name"] : $_FILES["file"]["name"]; // $image = isset($_REQUEST["image"]) ? $_REQUEST["image"] : $_FILES['image']["name"]; $filePath = $filePath . DIRECTORY_SEPARATOR . $fileName; // $imagePath = $imagePath . DIRECTORY_SEPARATOR . $image; // (D) DEAL WITH CHUNKS $chunk = isset($_REQUEST["chunk"]) ? intval($_REQUEST["chunk"]) : 0; $chunks = isset($_REQUEST["chunks"]) ? intval($_REQUEST["chunks"]) : 0; $out = @fopen("{$filePath}.part", $chunk == 0 ? "wb" : "ab"); if ($out) { $in = @fopen($_FILES['file']['tmp_name'], "rb"); if ($in) { while ($buff = fread($in, 4096)) { fwrite($out, $buff); } } else { verbose(0, "Failed to open input stream"); } @fclose($in); @fclose($out); @Unlink($_FILES['file']['tmp_name']); } else { verbose(0, "Failed to open output stream"); } // (E) CHECK IF FILE HAS BEEN UPLOADED if (!$chunks || $chunk == $chunks - 1) { rename("{$filePath}.part", $filePath); // For Upload in Vimeo.. // $file_name = "videos/Sample.mp4"; // $file_name = "uploads/videos/". $fileName; if(file_exists($filePath)){ $uri = $client->upload($filePath, array( "name" => $title, "description" => $description, "privacy" => array( 'view' => 'disable', 'embed' => 'whitelist') )); $presets = $client->request($uri.'/presets/120724516', [], 'PUT'); $urlParts = explode("/", parse_url($uri, PHP_URL_PATH)); $videoId = (int)$urlParts[count($urlParts)-1]; $video_player_link = "https://player.vimeo.com/video/".$videoId; } $mysqli = new mysqli('localhost','u711510295_root','inGODwetrust0524','u711510295_crud_video')or die(mysqli_error($mysqli)); $mysqli->query("INSERT INTO video_info (title, subject, url, img_url, description) VALUES ('$title','$subject', '$video_player_link','$description','$description')")or die($mysqli->error); } verbose(1, "Upload OK"); $_SESSION['message'] = "Record has been saved!"; $_SESSION['msg_type'] = "success"; header("location: video-manage2.php"); if(isset($_GET['delete'])){ $id = $_GET['delete']; $mysqli->query("DELETE FROM video_info WHERE id=$id")or die($mysqli->error()); $_SESSION['message'] = "Record has been deleted!"; $_SESSION['msg_type'] = "warning"; header("location: video-manage2.php"); } ?>

    here's my code, I'm trying to upload from server to vimeo api, I used plupload library to chunk large video files. and send to the server then the vimeo api will take the video to the root folder of the project then send to vimeo, it work in short videos but not working in large videos ,, can someone help me about this .

    Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
    Labels
    None yet
    Projects
    None yet
    Development

    No branches or pull requests

    1 participant