[stable10] [revived] Retry chunks in web UI on stalled uploads

apps/files/js/app.js

@@ -95,7 +95,9 @@
  },
  config: this._filesConfig,
  enableUpload: true,
- maxChunkSize: OC.appConfig.files && OC.appConfig.files.max_chunk_size
+ maxChunkSize: OC.appConfig.files && OC.appConfig.files.max_chunk_size,
+ uploadStallTimeout: OC.appConfig.files && OC.appConfig.files.upload_stall_timeout,
+ uploadStallRetries: OC.appConfig.files && OC.appConfig.files.upload_stall_retries
  }
  );
  this.files.initialize();

apps/files/js/file-upload.js

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2014
+ * Copyright (c) 2018
  *
  * This file is licensed under the Affero General Public License version 3
  * or later.
@@ -332,10 +332,22 @@ OC.FileUpload.prototype = {
  if (this.data.isChunked) {
  this._deleteChunkFolder();
  }
+ this.data.stalled = false;
  this.data.abort();
  this.deleteUpload();
  },
 
+ /**
+ * retry the upload
+ */
+ retry: function() {
+ if (!this.data.stalled) {
+ console.log('Retrying upload ' + this.id);
+ this.data.stalled = true;
+ this.data.abort();
+ }
+ },
+
  /**
  * Fail the upload
  */
@@ -484,6 +496,17 @@ OC.Uploader.prototype = _.extend({
  */
  davClient: null,
 
+ /**
+ * Upload progressbar element
+ *
+ * @type Object
+ */
+ $uploadprogressbar: null,
+
+ /**
+ * @type int
+ */
+ _uploadStallTimeout: 60,
  /**
  * Function that will allow us to know if Ajax uploads are supported
  * @link https://github.com/New-Bamboo/example-ajax-upload/blob/master/public/index.html
@@ -806,34 +829,40 @@ OC.Uploader.prototype = _.extend({
  var self = this;
  window.clearInterval(this._progressBarInterval);
  $('#uploadprogresswrapper .stop').fadeOut();
- $('#uploadprogressbar').fadeOut(function() {
+ this.$uploadprogressbar.fadeOut(function() {
  self.$uploadEl.trigger(new $.Event('resized'));
  });
  },
 
  _showProgressBar: function() {
- $('#uploadprogressbar').fadeIn();
+ this.$uploadprogressbar.fadeIn();
  this.$uploadEl.trigger(new $.Event('resized'));
  if (this._progressBarInterval) {
  window.clearInterval(this._progressBarInterval);
  }
  this._progressBarInterval = window.setInterval(_.bind(this._updateProgressBar, this), 1000);
  this._lastProgress = 0;
- this._lastProgressStalledSeconds = 0;
  },
- 
+
  _updateProgressBar: function() {
- var progress = parseInt($('#uploadprogressbar').attr('data-loaded'), 10);
- var total = parseInt($('#uploadprogressbar').attr('data-total'), 10);
+ var progress = parseInt(this.$uploadprogressbar.attr('data-loaded'), 10);
+ var total = parseInt(this.$uploadprogressbar.attr('data-total'), 10);
  if (progress !== this._lastProgress) {
  this._lastProgress = progress;
- this._lastProgressStalledSeconds = 0;
+ this._lastProgressTime = new Date().getTime();
  } else {
- if (this._lastProgressStalledSeconds < 1) {
- this._lastProgressStalledSeconds++;
- } else if (progress >= total) {
+ if (progress >= total) {
  // change message if we stalled at 100%
- $('#uploadprogressbar .label .desktop').text(t('core', 'Processing files...'));
+ this.$uploadprogressbar.find('.label .desktop').text(t('core', 'Processing files...'));
+ } else if (new Date().getTime() - this._lastProgressTime >= this._uploadStallTimeout * 1000 ) {
+ // TODO: move to "fileuploadprogress" event instead and use data.uploadedBytes
+ // stalling needs to be checked here because the file upload no longer triggers events
+ // restart upload
+ this.log('progress stalled'); // retry chunk (and prevent IE from dying)
+ _.each(this._uploads, function(upload) {
+ // FIXME: harden by only retry pending, not the finished ones
+ upload.retry();
+ });
  }
  }
  },
@@ -870,6 +899,9 @@ OC.Uploader.prototype = _.extend({
  var self = this;
  options = options || {};
 
+ this._uploads = {};
+ this._knownDirs = {};
+
  this.fileList = options.fileList;
  this.filesClient = options.filesClient || OC.Files.getClient();
  this.davClient = new OC.Files.Client({
@@ -883,10 +915,15 @@ OC.Uploader.prototype = _.extend({
  if (options.url) {
  this.url = options.url;
  }
+ if (options.uploadStallTimeout) {
+ this._uploadStallTimeout = options.uploadStallTimeout;
+ }
 
  $uploadEl = $($uploadEl);
  this.$uploadEl = $uploadEl;
 
+ this.$uploadprogressbar = $('#uploadprogressbar');
+
  if ($uploadEl.exists()) {
  $('#uploadprogresswrapper .stop').on('click', function() {
  self.cancelUploads();
@@ -897,10 +934,12 @@ OC.Uploader.prototype = _.extend({
  dropZone: options.dropZone, // restrict dropZone to content div
  autoUpload: false,
  sequentialUploads: true,
+ maxRetries: options.uploadStallRetries || 3,
+ retryTimeout: 500,
  //singleFileUploads is on by default, so the data.files array will always have length 1
  /**
  * on first add of every selection
- * - check all files of originalFiles array with files in dir
+
  * - on conflict show dialog
  * - skip all -> remember as single skip action for all conflicting files
  * - replace all -> remember as single replace action for all conflicting files
@@ -1061,6 +1100,53 @@ OC.Uploader.prototype = _.extend({
  },
  fail: function(e, data) {
  var upload = self.getUpload(data);
+ if (upload && upload.data && upload.data.stalled) {
+ self.log('retry', e, upload);
+ // jQuery Widget Factory uses "namespace-widgetname" since version 1.10.0:
+ var fu = $(this).data('blueimp-fileupload') || $(this).data('fileupload'),
+ retries = upload.data.retries || 0,
+ retry = function () {
+ var uid = OC.getCurrentUser().uid;
+ upload.uploader.davClient.getFolderContents(
+ 'uploads/' + uid + '/' + upload.getId()
+ )
+ .done(function (status, files) {
+ data.uploadedBytes = 0;
+ _.each(files, function(file) {
+ // only count numeric file names to omit .file and .file.zsync
+ if (!isNaN(parseFloat(file.name))
+ && isFinite(file.name)
+ // only count full chunks
+ && file.size === fu.options.maxChunkSize
+ ) {
+ data.uploadedBytes += file.size;
+ }
+ });
+
+ // clear the previous data:
+ data.data = null;
+ // overwrite chunk
+ delete data.headers['If-None-Match'];
+ data.submit();
+ })
+ .fail(function (status, ex) {
+ self.log('failed to retry', status, ex);
+ fu._trigger('fail', e, data);
+ });
+ };
+ if (upload && upload.data && upload.data.stalled &&
+ data.uploadedBytes < data.files[0].size &&
+ retries < fu.options.maxRetries) {
+ retries += 1;
+ upload.data.retries = retries;
+ window.setTimeout(retry, retries * fu.options.retryTimeout);
+ return;
+ }
+ fu.prototype
+ .options.fail.call(this, e, data);
+ return;
+ }
+
  var status = null;
  if (upload) {
  status = upload.getResponseStatus();
@@ -1158,14 +1244,14 @@ OC.Uploader.prototype = _.extend({
  self.log('progress handle fileuploadstart', e, data);
  $('#uploadprogresswrapper .stop').show();
  $('#uploadprogresswrapper .label').show();
- $('#uploadprogressbar').progressbar({value: 0});
- $('#uploadprogressbar .ui-progressbar-value').
+ self.$uploadprogressbar.progressbar({value: 0});
+ self.$uploadprogressbar.find('.ui-progressbar-value').
  html('<em class="label inner"><span class="desktop">'
  + t('files', 'Uploading...')
  + '</span><span class="mobile">'
  + t('files', '...')
  + '</span></em>');
- $('#uploadprogressbar').tipsy({gravity:'n', fade:true, live:true});
+ self.$uploadprogressbar.tipsy({gravity:'n', fade:true, live:true});
  self._showProgressBar();
  self.trigger('start', e, data);
  });
@@ -1184,25 +1270,25 @@ OC.Uploader.prototype = _.extend({
  lastSize = data.loaded;
  diffSize = diffSize / diffUpdate; // apply timing factor, eg. 1mb/2s = 0.5mb/s
  var remainingSeconds = ((data.total - data.loaded) / diffSize);
- if(remainingSeconds >= 0) {
+ if (isFinite(remainingSeconds) && remainingSeconds >= 0) {
  bufferTotal = bufferTotal - (buffer[bufferIndex]) + remainingSeconds;
  buffer[bufferIndex] = remainingSeconds; //buffer to make it smoother
  bufferIndex = (bufferIndex + 1) % bufferSize;
  }
  var smoothRemainingSeconds = (bufferTotal / bufferSize); //seconds
  var h = moment.duration(smoothRemainingSeconds, "seconds").humanize();
- $('#uploadprogressbar').attr('data-loaded', data.loaded);
- $('#uploadprogressbar').attr('data-total', data.total);
- $('#uploadprogressbar .label .mobile').text(h);
- $('#uploadprogressbar .label .desktop').text(h);
- $('#uploadprogressbar').attr('original-title',
+ self.$uploadprogressbar.attr('data-loaded', data.loaded);
+ self.$uploadprogressbar.attr('data-total', data.total);
+ self.$uploadprogressbar.find('.label .mobile').text(h);
+ self.$uploadprogressbar.find('.label .desktop').text(h);
+ self.$uploadprogressbar.attr('original-title',
  t('files', '{loadedSize} of {totalSize} ({bitrate})' , {
  loadedSize: humanFileSize(data.loaded),
  totalSize: humanFileSize(data.total),
  bitrate: humanFileSize(data.bitrate) + '/s'
  })
  );
- $('#uploadprogressbar').progressbar('value', progress);
+ self.$uploadprogressbar.progressbar('value', progress);
  self.trigger('progressall', e, data);
  });
  fileupload.on('fileuploadstop', function(e, data) {
@@ -1232,6 +1318,9 @@ OC.Uploader.prototype = _.extend({
  '/' + encodeURIComponent(chunkId);
  delete data.contentRange;
  delete data.headers['Content-Range'];
+
+ // reset retries
+ upload.data.retries = 0;
  });
  fileupload.on('fileuploadchunkdone', function(e, data) {
  $(data.xhr().upload).unbind('progress');

apps/files/js/filelist.js

@@ -344,7 +344,9 @@
  fileList: this,
  filesClient: this.filesClient,
  dropZone: $('#content'),
- maxChunkSize: options.maxChunkSize
+ maxChunkSize: options.maxChunkSize,
+ uploadStallTimeout: options.uploadStallTimeout,
+ uploadStallRetries: options.uploadStallRetries
  });
 
  this.setupUploadEvents(this._uploader);

apps/files/lib/App.php

@@ -45,8 +45,12 @@ public static function getNavigationManager() {
 
  public static function extendJsConfig($array) {
  $maxChunkSize = (int)(\OC::$server->getConfig()->getAppValue('files', 'max_chunk_size', (10 * 1024 * 1024)));
+ $uploadStallTimeout = (int)(\OC::$server->getConfig()->getAppValue('files', 'upload_stall_timeout', 60)); // in seconds
+ $uploadStallRetries = (int)(\OC::$server->getConfig()->getAppValue('files', 'upload_stall_retries', 100));
  $array['array']['oc_appconfig']['files'] = [
- 'max_chunk_size' => $maxChunkSize
+ 'max_chunk_size' => $maxChunkSize,
+ 'upload_stall_timeout' => $uploadStallTimeout,
+ 'upload_stall_retries' => $uploadStallRetries
  ];
  }
 }