Soru Meteor ile dosya yükleme işlemi nasıl yapılır?


Meteor ile dosya yükleme işleminin kurallı yolu ne olurdu?


76
2018-04-11 02:54


Menşei


Bu muğlak bir soru ... Müşteri tarafında veya sunucuda nasıl ele alınacağını mı soruyorsunuz? Her iki şekilde de, (hiç meteor kullanmamıştım) bir dosya yükleme işleminin üstesinden gelmenin, herhangi bir sunucuyla aynı olduğunu hayal ediyorum. İstemci tarafı: dosya ile bir URL'ye POST isteğini istek gövdesinin bir parçası olarak gönderin. Sunucu tarafı: Bu URL'deki POST isteklerini dinleyin ve biri geldiğinde, istek gövdesini okuyun ve içerdiği herhangi bir dosya ile ne isterseniz onu yapın. Bu temelde bunu düğüm / baharla nasıl yaptım ... Yardımına ihtiyacınız olan şey hakkında daha spesifik olabilirseniz, belki daha yararlı olabilirim ... - JKing
Selam JKing, Meteor'a bir göz atmalısın, bu yüzden bu ilginç bir soru: meteor.com - David


Cevaplar:


Şu anda HTTP sunucusuyla etkileşimde bulunmanın veya HTTP ile ilgili bir şey yapmanın bir yolu yok gibi görünüyor.

Yapabileceğiniz tek şey, Meteor.methods tarafından açığa çıkan RPC yöntemleri üzerinden sunucuyla konuşmak ya da maruz kalan mongoDB API'sı üzerinden doğrudan mongoDB ile konuşmaktır.


17
2018-04-11 06:24



Teşekkürler Raynos. Muhtemelen Luan'ın yolunu deneyecek ve yüklemeyi JS yükleyicileriyle S3'e veya türden bir şeye atlayacaktır. - David
@Raynos Açıktaki Mongo API'sının GridFS'yi destekleyip desteklemediğini biliyor musunuz? Bundan bahsetmiyorum. - Steve Jalim
@stevejalim Bilmiyorum, desteklediği mongo API alt kümesinin kaynak kodunu okuyun - Raynos
@stevejalim Kaynağa baktım minimongo'da GridFS desteği yok (kullandıkları paket) - bobbywilson0
Buradaki partiye biraz geç kaldım, ama aynı zamanda meteor için bir dosya yükleyici oluşturduğum eventedmind.com'un son birkaç bölümünü de kontrol edebilirsiniz. Paketin akış yükleme sürümü bu hafta yayınlanacak. Meteor dosyası denir. - cmather


kullandım http://filepicker.io. Dosyayı yükleyecekler, S3'ünüze kaydedecekler ve size dosyanın bulunduğu URL'yi döndürecekler. Sonra url'yi bir DB'ye gönderirim.

  1. Dosya klasörü komut dosyasını istemci klasörünüze kopyalayın.

    wget https://api.filepicker.io/v0/filepicker.js
    
  2. Bir dosya girişi girdi etiketi ekle

    <input type="filepicker" id="attachment">
    
  3. Başlangıçta şunları başlatın:

    Meteor.startup( function() {
        filepicker.setKey("YOUR FILEPICKER API KEY");
        filepicker.constructWidget(document.getElementById('attachment'));
    });
    
  4. Bir etkinlik işleyicisi ekle

    Templates.template.events({
        'change #attachment': function(evt){
            console.log(evt.files);
        }
    });
    

44
2017-09-18 20:47



Yay, filepicker.io! Tamamen Heroku ile bir çekicilik gibi çalıştı. - AbigailW
Sadece 10 günlük deneme süresi için ücretsizdir :( - aladine
Pfff .. Sadece S3'e dosya yüklemek için 100 dolar ödemeyeceğim. - Rijk
Echo @rijk, ücretli bir hizmetin neden 1 numaralı cevabı olduğunu bilmiyor musunuz? github.com/VeliovGroup/Meteor-Files veya themeteorchef.com/recipes/uploading-files-to-amazon-s3 Açık kaynak lib'leri uygulamak hem özgür bir çözümdür. - GFargo
kullanırım edgee:slingshotBüyük dosyalar için harika (uygulama sunucunuz üzerinden değil, doğrudan S3'e yükler). - Rijk


Resimler için benzer bir yöntem kullanıyorum Dario haricinde dosyayı diske yazmam. Verileri doğrudan veritabanında modeldeki bir alan olarak saklıyorum. Bu benim için çalışıyor çünkü sadece destekleyen tarayıcıları desteklemem gerekiyor. HTML5 Dosya API'sı. Ve sadece basit bir görüntü desteğine ihtiyacım var.

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);
  }
});

26
2018-01-04 20:53





Ben sadece ile geldim dosya yükleme uygulamaları Meteor.methods ve HTML5 Dosya API'sini kullanma. Ne düşündüğü söyle.


19
2017-10-20 05:32



Yani, bu talimatlar şaşırtıcı derecede iyi çalıştı. Çözüm beklediğimden 10 kat daha kolaydı ve kod çok fazla sorunsuz çalıştı. Çözüm, görüntüyü doğrudan node.js yerel dosya sistemine yükler. İlk başta yerel dev makineler üzerinde çok çalıştı, ancak Heroku ve Nodjitsu dahil olmak üzere bir hizmetçi (PaaS) sağlayıcıları ile ilgili sorunları vardı. Bu çözüm ile dosya sistemi izin sorunları olduğu için sorun. Bu nedenle, bu çözüm kendi sunucunuzu ya da Amazon Elasticbeanstalk gibi daha sağlam bir altyapıya sahip olmayı gerektirir. - AbigailW


Yeni bir paket var: edgee: sapan. Dosyaları meteor sunucunuza yüklemez, ancak meteor sunucusunun, maliyetli dosya aktarımlarını işlemek yerine, meteor uygulamasına hizmet etmenin birincil amacına odaklanmasını sağladığı için bu şekilde daha iyidir.

Bunun yerine, dosyaları bulut depolama hizmetlerine yükler. Şu anda AWS S3 ve Google Cloud Files'ı destekliyor, ancak aynı zamanda gelecekte Rackspace Cloud Dosyalarını ve belki de Cloudinary'yi destekleyecektir.

Meteor sunucunuz sadece bir koordinatör gibi davranır.

Direct VS Indirect uploads

Aynı zamanda çok yönlü ve hafif bir pakettir.


11
2018-01-12 23:35





adında bir atmosfer paketi var yönlendirici sadece buna izin verir.

aslında, dosya yüklemelerini işlemenin en iyi yolu şuan collectionFS


7
2018-03-24 15:57



CFS grup eklentileri üretim için uygun değildir - çünkü özellikle Meteor 1.0 uygulamasına geçtikten sonra, özellikle Meteor uygulama yayılımımız sürekli olarak başarısız oldu. CFS paketlerini kullanmamanızı şiddetle tavsiye ederim. - Shahriyar Imanov


İşte bu zaman için en iyi çözüm. Kullanır collectionFS.

meteor add cfs:standard-packages
meteor add cfs:filesystem

Müşteri:

Template.yourTemplate.events({
    'change .your-upload-class': function(event, template) {
        FS.Utility.eachFile(event, function(file) {
            var yourFile = new FS.File(file);
            yourFile.creatorId = Meteor.userId(); // add custom data
            YourFileCollection.insert(yourFile, function (err, fileObj) {
                if (!err) {
                   // do callback stuff
                }
            });
        });
    }
});

Sunucu:

YourFileCollection = new FS.Collection("yourFileCollection", {
    stores: [new FS.Store.FileSystem("yourFileCollection", {path: "~/meteor_uploads"})]
});
YourFileCollection.allow({
    insert: function (userId, doc) {
        return !!userId;
    },
    update: function (userId, doc) {
        return doc.creatorId == userId
    },
    download: function (userId, doc) {
        return doc.creatorId == userId
    }
});

Şablon:

<template name="yourTemplate">
    <input class="your-upload-class" type="file">
</template>

7
2017-09-09 06:12



Tüm kodlarını kullanıyorum. Meteor normal başlar, ancak bir öğeyi tıklattıktan sonra sunucuya yüklemez mi? Hiçbir şey olmuyor. - Erdem Güngör
@ ErdemGüngör Bunu kontrol edin yourTemplate ve your-yükleme sınıfı html'de Şablon ile aynıdır. yourTemplate .events ve 'değişiklik .Bu bilgilerin ışığında-yükleme sınıfı'. Olay işleyici işlevinde console.log dosyasını eklemek. - Raz
@Raz Onları kullanmanızı tavsiye eder misiniz? Onların devel şubesi (Github'da varsayılan gibi görünüyor) diyor ki - "Bu şube şu an aktif bir gelişme gösteriyor (2015-01-26). Hatalar var ve API değişmeye devam edebilir. Lütfen test edin ve hataları düzeltin. ama henüz üretimde kullanmayın. " Üstad şubeleri oldukça yaşlı görünüyor. Riske girmeyi düşünüyorum. Sen ne önerirsin? - Ayrton Senna
@AyrtonSenna Küçük projede üretimde kullanıyoruz ve iyi çalışıyor. Ama her seferinde güzel regresyon testleri yapmalısın meteor update. Sadece bu paket yüzünden değil. - Raz
Kulağa iyi geliyor. Bir deneyecek. Girdiniz için teşekkürler. - Ayrton Senna


Sen javascripter ve şeyler ile bazı hile yaparak, doğrudan S3'e yüklemeyi deneyebilirsiniz. http://aws.amazon.com/articles/1434


3
2018-04-11 12:57



Var Meteor için S3 yüklemelerini işleyen paketler şimdi. - Dan Dascalescu


Çok büyük dosyalara ihtiyacınız yoksa veya sadece kısa bir süre için dosyaları saklamak istiyorsanız, bu basit çözüm çok iyi çalışır.

Senin html içinde ...

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

Şablon etkinlik haritanızda ...

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);
        }
      });
    }
  }
});

Koleksiyona abone olun ve bir şablonda bağlantı oluştur ...

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

Bu, büyük dosyalar veya dosya yoğun bir uygulama için en sağlam veya zarif çözüm olmasa da, dosyaların basitçe yüklenmesini ve indirilmesini / oluşturulmasını uygulamak istiyorsanız, her tür dosya formatı için çok iyi çalışır.


3
2017-09-06 22:27