0

私は (残念ながら) Windows マシンで作業しているため、手動で FileCollection パッケージをアプリに追加する必要がありましたが、アプリを実行すると、ブラウザー コンソールからファイル コレクションとファイル コレクション メソッドにアクセスできます。ただし、実際のページにイベントリスナーを設定できないようです。(参考までに、テンプレート アーキテクチャに Iron-router を使用しています。)

呼び出す必要があるコードが正しい順序で来ていないようですが、コードを配置する場所を試してみましたが、違いはないようです。

サーバー側のコード:

// Create a file collection, and enable file upload and download using HTTP
Images = new fileCollection('images',
  { resumable: true,   // Enable built-in resumable.js upload support
    http: [
      { method: 'get',
        path: '/:_id',  // this will be at route "/gridfs/images/:_id"
        lookup: function (params, query) {  // uses express style url params
          return { _id: params._id };       // a mongo query mapping url to myFiles
        }
      }
    ]
  }
);

if (Meteor.isServer) {

  // Only publish files owned by this userId, and ignore
  // file chunks being used by Resumable.js for current uploads
  Meteor.publish('myImages',
    function () {
      return Images.find({ 'metadata._Resumable': { $exists: false },
                   'metadata.owner': this.userId });
    }
  );

  // Allow rules for security. Should look familiar!
  // Without these, no file writes would be allowed
  Images.allow({
    remove: function (userId, file) {
      // Only owners can delete
      if (userId !== file.metadata.owner) {
        return false;
      } else {
        return true;
      }
    },
    // Client file document updates are all denied, implement Methods for that
    // This rule secures the HTTP REST interfaces' PUT/POST
    update: function (userId, file, fields) {
      // Only owners can upload file data
      if (userId !== file.metadata.owner) {
      return false;
      } else {
        return true;
      }
    },
    insert: function (userId, file) {
      // Assign the proper owner when a file is created
      file.metadata = file.metadata || {};
      file.metadata.owner = userId;
      return true;
    }
  });
}

クライアント側のコード (現在、クライアント ディレクトリのトップ レベルの main.js にあります):

if (Meteor.isClient) {
    // This assigns a file upload drop zone to some DOM node
Images.resumable.assignDrop($(".fileDrop"));

// This assigns a browse action to a DOM node
Images.resumable.assignBrowse($(".fileBrowse"));

// When a file is added via drag and drop
Images.resumable.on('fileAdded', function(file) {
// Create a new file in the file collection to upload
    Images.insert({
  _id : file.uniqueIdentifier, // This is the ID resumable will use
      filename : file.fileName,
      contentType : file.file.type
      }, function(err, _id) {// Callback to .insert
        if (err) {throwError('Image upload failed');}
    // Once the file exists on the server, start uploading
        Images.resumable.upload();
});
  });
  Images.resumable.on('fileSuccess', function(file) {
var userId = Meteor.userId();
var url = '/gridfs/images/' + file._id;
Meteor.users.update(userId, {
  $set : {
    "profile.$.imageURL" : url
  }
    });
Session.set('uploading', false);
  });
  Images.resumable.on('fileProgress', function(file) {
Session.set('uploading', true);
  });
}
4

1 に答える 1

0

問題は、IronRouter の使用にある可能性があると思います。Iron ルーター経由でいくつかの layout.html を使用していて、その中にファイル テーブルを表示するためのテンプレートを追加していると仮定します。（fileCollectionに付属のsampleAppに従っていると思います。）これを行ったときに問題が発生しました。それは、リスナーをアタッチするコードがどこにあるかに関係していました。問題は、コード「Images.resumable.assignDrop($(".fileDrop"));」がある場所です。クライアントファイルで。現在の方法では、テンプレートが layout.html 内でレンダリングされる前に、そのコード行が実行されます。そのため、コードは DOM 要素「.fileDrop」を見つけることができません。これを修正するには、layout.js ファイルを作成し、次のような render メソッドを使用します...

Template.layout.rendered = function(){
    Images.resumable.assignDrop($(".fileDrop"));
}
于 2014-05-19T14:28:27.120 に答える