0

私は fabric.js を使用して Threes.js でテクスチャを動的に作成しています。テクスチャを AWS に保存する必要があります。通常、ファイルセレクター入力を介して渡された画像を取得します。アップローダは次のとおりです。

var uploader = new Slingshot.Upload("myFileUploads");

uploader.send(document.getElementById('input').files[0], function (error, downloadUrl) {
  if (error) {
    console.error('Error uploading', uploader.xhr.response);
    alert (error);
  }
  else {
    Meteor.users.update(Meteor.userId(), {$push: {"profile.files":downloadUrl}});
  }
});

アップロードはドライブから正常に機能します...しかし、ドライブからファイルを取得するのではなく、ブラウザでファイルを生成しています。代わりに、次のメソッドを使用して canvas 要素から生成されます。

    generateTex: function(){
        var canvTex         = document.getElementById('texture-generator');
        var canvImg         = canvTex.toDataURL('image/jpeg');
        var imageNew        = document.createElement( 'img' );
        imageNew.src        = canvImg;

    }

これもうまくいきます。imageNew を console.log にすると、base 64 エンコーディングで素敵な画像が得られます。

 <img src=​"data:​image/​jpeg;​base64,/​9j/​
4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgICAgMCAgID 
//....carries on to 15k or so characters

ファイルconsole.logピッカーを介してドライブから追加されたファイルオブジェクト（キャンバスから生成されたものではない）の場合、ファイルオブジェクトがどのように見えるかを確認できます。

file{
  lastModified: 1384216556000
  lastModifiedDate: Mon Nov 11 2013 16:35:56 GMT-0800 (PST)
  name: "filename.png"
  size: 3034
  type: "image/png"
  webkitRelativePath: ""
  __proto__: File
}

しかし、ファイル オブジェクトに実際のデータを追加する場所がないため、アップロード用の BLOB からファイルを作成できません。

要約すると、次のことができます。

  1. 画像ブロブを生成して dom 要素に表示する
  2. meteor-slingshot を使用してドライブからファイルをアップロードする
  3. 既存のファイル オブジェクトを調べる

しかし、ブロブを名前付きファイルに変換する方法がわからないので、アップローダーに渡すことができます。

画像をダウンロードしたくない (それには答えがあります)、アップロードしたいです。ファイルシステム API を使用してこれを行うには「クロムのみ」の方法がありますが、クロス ブラウザー (そして最終的にはクロス プラットフォーム) が必要です。誰かが私を助けてくれたら、私は抑えきれないほどの喜びを感じるでしょう.

4

1 に答える 1

1

Slingshot は、ファイルだけでなくブロブもサポートしています: https://github.com/CulturalMe/meteor-slingshot/issues/22

という名前のキャンバス オブジェクトと という名前canvTexのSlingshot.Uploadインスタンスがある場合uploader、キャンバス イメージのアップロードは次のように簡単です。

canvTex.toBlob(function (blob) {
  uploader.send(blob, function (error, downloadUrl) {
    //...
  });
});

BLOB には名前がないため、ディレクティブを定義するときはそのことを考慮する必要があります。ファイルの名前に基づいてキーを生成しようとしないでください。

于 2015-08-15T08:55:28.037 に答える