77

Meteorでファイルのアップロードを処理するための標準的な方法は何でしょうか?

4

12 に答える 12

44

http://filepicker.ioを使用しました。彼らはファイルをアップロードし、それをS3に保存し、ファイルがある場所のURLを返します。次に、URLをDBに挿入します。

  1. filepickerスクリプトをクライアントフォルダーに入れます。

    wget https://api.filepicker.io/v0/filepicker.js
    
  2. filepicker入力タグを挿入します

    <input type="filepicker" id="attachment">
    
  3. スタートアップで、それを初期化します:

    Meteor.startup( function() {
        filepicker.setKey("YOUR FILEPICKER API KEY");
        filepicker.constructWidget(document.getElementById('attachment'));
    });
    
  4. イベントハンドラーをアタッチする

    Templates.template.events({
        'change #attachment': function(evt){
            console.log(evt.files);
        }
    });
    
于 2012-09-18T20:47:24.320 に答える
26

画像については、ファイルをディスクに書き込まないことを除いて、 Darioと同様の方法を使用します。モデルのフィールドとしてデータをデータベースに直接保存します。HTML5 File APIをサポートするブラウザーのみをサポートする必要があるため、これは私にとってはうまくいきます。そして、単純な画像サポートだけが必要です。

Template.myForm.events({
  'submit form': function(e, template) {
    e.preventDefault();
    var file = template.find('input type=["file"]').files[0];
    var reader = new FileReader();
    reader.onload = function(e) {
      // Add it to your model
      model.update(id, { $set: { src: e.target.result }});

      // Update an image on the page with the data
      $(template.find('img')).attr('src', e.target.result);
    }
    reader.readAsDataURL(file);
  }
});
于 2013-01-04T20:53:01.607 に答える
19

Meteor.methods と HTML5 File の API を使用して、ファイル アップロードの実装を考え出しました。どう考えているか教えてください。

于 2012-10-20T05:32:49.670 に答える
17

現在、HTTP サーバーとやり取りしたり、HTTP に関連することを行う方法はないようです。

できることは、Meteor.methods によって公開された RPC メソッドを介してサーバーと対話するか、公開された mongoDB API を介して直接 mongoDB と対話することだけです。

于 2012-04-11T06:24:18.820 に答える
7

それを可能にするルーターと呼ばれる雰囲気パッケージがあります。

実際、ファイルのアップロードを処理する最良の方法はcollectionFSになりました

于 2013-03-24T15:57:57.977 に答える
4

非常に大きなファイルを必要としない場合、またはファイルを短期間だけ保存する場合は、この単純なソリューションが非常にうまく機能します。

あなたのhtmlで...

<input id="files" type="file" />

テンプレート イベント マップで...

Template.template.events({
  'submit': function(event, template){
    event.preventDefault();
    if (window.File && window.FileReader && window.FileList && window.Blob) {
      _.each(template.find('#files').files, function(file) {
        if(file.size > 1){
          var reader = new FileReader();
          reader.onload = function(e) {
            Collection.insert({
              name: file.name,
              type: file.type,
              dataUrl: reader.result
            });
          }
          reader.readAsDataURL(file);
        }
      });
    }
  }
});

コレクションを購読し、テンプレートでリンクをレンダリングします...

<a href="{{dataUrl}}" target="_blank">{{name}}</a>

これは、大きなファイルやファイル集約型のアプリケーションにとって最も堅牢で洗練されたソリューションではないかもしれませんが、ファイルの単純なアップロードとダウンロード/レンダリングを実装したい場合は、あらゆる種類のファイル形式で非常にうまく機能します.

于 2014-09-06T22:27:51.903 に答える
3

js アップローダーなどでいくつかのトリックを実行して、Amazon S3 に直接アップロードしてみることができます。 http://aws.amazon.com/articles/1434

于 2012-04-11T12:57:47.037 に答える
2

「ファイルアップロードパターン」機能は「1.0以降」に予定されていることが流星のロードマップでわかります。したがって、正式な方法が表示されるまで待つ必要があります。

今のところ、最良の方法の 1 つは「collectionFS」を使用することです (これは執筆時点で 0.3.x dev プレビューです)。

または、ここで提案されているように、inkfilepicker (例: filepicker.io) 。使い方は簡単ですが、これには明らかにユーザー側からのインターネット接続が必要です。

遊んでみるだけなら、html5 の機能を利用することもできます。そのようなもの

于 2013-09-22T02:21:21.367 に答える