获取最新的文件使用Ajax和PHP时（通过FTP）避免部分上传的文件 [英] Avoiding partially uploaded files (via FTP) when getting newest file with ajax and PHP

问题描述

我知道这个题目是有点怪，但我会在那里。

I'm aware the title of this is a little strange, but I'll get there.

我拴在一台笔记本电脑的摄像头。使用遥控拍摄，当摄影师拍照被保存到笔记本电脑的硬盘驱动器上的文件夹。有设置，每当一个新的文件时，它会调整它，推它使用传输的FTP文件夹上的Automator（Mac OS X的）行动。

I have a camera tethered to a laptop. Using Remote Shooting, when the photographer takes a photo it is saved into a folder on the laptop's hard drive. There is an Automator (Mac OS X) action set up on the folder that whenever a new file appears, it resizes it and pushes it up to an FTP using Transmit.

下面是其中code的用武之地。

Here's where the code comes in.

我有显示最新拍摄的照片的网页。它使用AJAX反复检查新文件是否已经上传，如果有，加载新的照片，并与老照片交叉衰减了。这里所运行的网页上的Javascript的

I have a web page displaying the most recent photo taken. It uses ajax to repeatedly check whether or not a new file has been uploaded, and if it has, load the new photo and crossfade it with the old photo. Here is the Javascript running on the page.

(function() {
  var delay, refreshLoop;

  // Alias to setTimeout that reverses the parameters, making it much cleaner in code (for CoffeeScript)
  delay = function(time, callback) {
    return setTimeout(callback, time);
  };

  // Function that drives the loop of refreshing photos
  refreshLoop = function(currentFolderState, refreshRate) {
    // Get the new folder state
    $.get("ajax/getFolderState.php", function(newFolderState) {
      // If the new folder state is different
      if (newFolderState !== currentFolderState) {
        // Get the newest photo 
        $.get("ajax/getNewestPhoto.php", function(photoFilename) {
          var img;
          // Create the new image element
          img = $('<img class="new-photo"/>')
            // Append the src attribute to it after so it can BG load
            .attr('src', "/events/mindsmack/booth/cinco-de-mindsmack-2012/" + photoFilename)
            // When the image is loaded
            .load(function() {
              // Append the image to the photos container
              $('#photos').append(img);
              // Crossfade it with the old photo
              $('#photos .current-photo').fadeOut();
              $('#photos .new-photo').fadeIn().removeClass("new-photo").addClass("current-photo");
            });
        });
      }
      // Wait for the refresh rate and then repeat
      delay(refreshRate, function() {
        refreshLoop(newFolderState, refreshRate);
      });
    });
  };

  // Document Ready
  $(function() {
    var refreshRate;

    // Load the first photo 
    $.get("ajax/getNewestPhoto.php", function(photoFilename) {
      $('#photos').append("<img src='/events/mindsmack/booth/cinco-de-mindsmack-2012/" + photoFilename + "' class='current-photo' />");
    });
    refreshRate = 2000;
    // After the timeout
    delay(refreshRate, function() {
      // Get the initial folder state and kick off the loop
      $.get("ajax/getFolderState.php", function(initialFolderState) {
        refreshLoop(initialFolderState, refreshRate);
      });
    });
  });

}).call(this);

在这里是被称为在Javascript的两个PHP文件

And here are the two PHP files that are called in that Javascript

getFolderState.php

getFolderState.php

<?php

    $path = $_SERVER['DOCUMENT_ROOT'] . "/events/mindsmack/booth/cinco-de-mindsmack-2012/";

    // Get a directory listing of the path where the photos are stored
    $dirListing = scandir( $path );

    // Echo an md5 hash of the directory listing
    echo md5(serialize($dirListing));

getNewestPhoto.php

getNewestPhoto.php

<?php

    $path = $_SERVER['DOCUMENT_ROOT'] . "/events/mindsmack/booth/cinco-de-mindsmack-2012/";

    // Get a directory listing of the path where the photos are stored
    $listing = scandir($path);

    $modTime = 0;
    $mostRecent = "";

    // Find the most recent file
    foreach ( $listing as $file ) {
        if ( is_file($path.$file) && $file !== ".DS_Store" && filectime($path.$file) > $modTime) {
            $modTime = filectime($path.$file);
            $mostRecent = $file;
        }
    }

    // Echo the most recent filename
    echo $mostRecent;

所有这些作品大多完美无缺。这个问题，我相信，是当循环被触发，而一个文件是在被上载的中间。偶尔照片将采取它只会在页面中​​途出现。一个没有引发错误，在所有的脚本将继续运行得很好，并把影像文件实际上是缓存在这种状态下，导致我相信，我的code正在追赶一个文件上传正在进行中，只显示了一部分已上载到在那一刻的文件

All of this works mostly flawlessly. The problem, I believe, is when the loop is fired while a file is in the middle of being uploaded. Occasionally a photo will be taken and it will only show up on the page partway. An error isn't thrown at all, the script continues to run just fine, and the image file is actually cached in that state, leading me to believe that my code is catching a file upload in progress and only showing the part of the file that has been uploaded at that moment.

我不介意改变我的解决办法，如果我要为了克服这个问题，我只是不知道到底该怎么做。

I don't mind changing my solution if I need to in order to overcome this issue, I'm just not sure exactly what to do.

修改

按照下面的建议之一，我加code我getNewestPhoto.php，检查照片的文件大小，等待了一下，并检查一遍。如果它们是不同的，它可以追溯到并再次检查，直到文件大小是相同的。我希望这会赶上那些中等上传，因为文件大小将环，但即使照片都上来了部分渲染，文件大小检查没有捕获到它的更改文件。

As per one of the suggestions below, I added code to my getNewestPhoto.php that checks the file size of the photo, waits a bit, and checks it again. If they're different, it goes back and checks again until the file sizes are the same. I was hoping this would catch the files that are mid-upload because the filesize would change between loops but even when photos are coming up partially rendered, the filesize check didn't catch it.

这里的code我加了

$currFilesize = filesize($path . $mostRecent);
$newFilesize;

while ( true ) {
    sleep(.5);
    $newFilesize = filesize($path . $mostRecent);

    if ( $newFilesize == $currFilesize) {
        break;
    }
    else {
        $currFilesize = $newFilesize;
    }
}

我想（通过另一个建议），我需要添加某种对上传锁定的文件，它停止code，从刷新照片并上载完成被删除，但看到我是没有运行拴在相机的计算机上的任何类型的Web服务器，我不知道如何做到这一点。我很想建议。

I'm thinking (via another suggestion) that I need to add some kind of lock file on upload that stops the code from refreshing the photo and is removed when the upload is done, but seeing that I'm not running any kind of web server on the computer tethered to the camera, I'm not sure how to accomplish that. I would love suggestions.

推荐答案

有很多途径来解决这个问题，比我将建议大多数更好。我想最简单，最快捷的解决方案，但是，到FTP到TMP目录，并在转让完成后触发文件到生产目录的举动。请问您当地的Automator工作有这样一个机制，它与传输打交道？

There are many routes to solve this, most better than what I am about to suggest. I think the simplest and quickest solution, however, is to FTP to a tmp dir and when the transfer is completed trigger a move of the file to the production directory. Does your local automator job have such a mechanism in it's dealings with transmit?

这篇关于获取最新的文件使用Ajax和PHP时（通过FTP）避免部分上传的文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！