Загрузка файла jQuery с использованием Requirejs

Question

Я пробовал this работать в среде интрасети, поэтому, очевидно, нет CDN. Позже из статьи this я обнаружил, что нам нужно загрузить «load-image», «tmpl» и «canvas-to-blob» в качестве AMD с помощью RequireJs.

У меня есть main.js следующим образом:

(function() { 
    require.config({ 
     baseUrl: '/Scripts', 
     waitSeconds: 800, 
     paths: { 
      'jquery': ['/Content/jQueryFileUpload/js/jquery', 'jquery-1.10.2'], 
      'jquery.ui.widget': ['/Content/jQueryFileUpload/js/vendor/jquery.ui.widget'], 
      'jquery.fileupload': '/Content/jQueryFileUpload/js/jquery.fileupload', 
      'jquery.fileupload-ui': '/Content/jQueryFileUpload/js/jquery.fileupload-ui', 
      'jquery.fileupload-image': '/Content/jQueryFileUpload/js/jquery.fileupload-image', 
      'jquery.fileupload-validate': '/Content/jQueryFileUpload/js/jquery.fileupload-validate', 
      'jquery.fileupload-video': '/Content/jQueryFileUpload/js/jquery.fileupload-video', 
      'jquery.fileupload-audio': '/Content/jQueryFileUpload/js/jquery.fileupload-audio', 
      'jquery.fileupload-process': '/Content/jQueryFileUpload/js/jquery.fileupload-process', 
      'jquery.fileupload-jquery-ui': '/Content/jQueryFileUpload/js/jquery.fileupload-jquery-ui', 
      'jquery.iframe-transport': ['jquery-1.10.2', '/Content/jQueryFileUpload/js/jquery.iframe-transport'], 
      'load-image': '/Content/jQueryFileUpload/js/load-image', 
      'load-image-meta': '/Content/jQueryFileUpload/js/load-image-meta', 
      'load-image-exif': ['/Content/jQueryFileUpload/js/load-image-meta', '/Content/jQueryFileUpload/js/load-image-exif'], 
      'load-image-ios': '/Content/jQueryFileUpload/js/load-image-ios', 
      'canvas-to-blob': '/Content/jQueryFileUpload/js/canvas-to-blob', 
      'tmpl': '/Content/jQueryFileUpload/js/tmpl', 
      'bootstrap': 'Content/bootstrap/js/bootstrap', 
      'app': 'app' 
     } 
    }); 

    require(['jquery', 'app'], function ($,app) { 
     $(function() { 
      app.init(); 
     }); 
    }); 

})(); 

и app.js:

define(
     ['jquery', 'tmpl', 'load-image', 'canvas-to-blob', 'jquery.iframe-transport', 'jquery.fileupload-ui'], function() { 
      return { 
       init: function ($) { 
        alert(); 
        $('#fileupload').fileupload({ 
         url: '/Upload/UploadHandler.ashx', 
         add: function (e, data) { 
          console.log("add", data); 
         }, 
         submit: function (e, data) { 
          console.log("submit", data); 
         }, 
         change: function (e, data) { 
          console.log("change", data); 
         }, 
         send: function (e, data) { 
          console.log("send", data); 
          data.url = url + "'" + data.files[0].name + "'"; 
         } 

        }); 
       } 
      } 
     } 
    ); 

Там нет ошибок в консоли, и ничего не войдя в консоли. app.init() не вызывается и при выборе файлов ничего не происходит? Не уверен, что мне не хватает или что не так в моем коде. Я искал много форумов и не мог пройти через это!

Answer 1

В моем сайте я изменить строку

'load-image-exif': ['/Content/jQueryFileUpload/js/load-image-meta', '/Content/jQueryFileUpload/js/load-image-exif'], 

по

'load-image-exif': '/Content/jQueryFileUpload/js/load-image-exif', 

и работает нормально.

Answer 2

According to the documentation запрос отправлен, когда submit() вызывается на адрес data object.

Обратный вызов по умолчанию add() - это тот, который выполняет действие отправки. Ваша ошибка заключается в том, что вы переопределяете его, не вызывая функцию отправки. Поэтому просто добавьте:

add: function (e, data) { 
    console.log("add", data); 
    data.submit(); 
}, 

Но вы можете позвонить ему в другое место.