简单的文件上传在流星

Simple File Uploads in Meteor

本文关键字:流星 文件 简单      更新时间:2023-09-26

流星中文件上传的所有解决方案似乎都指向将它们存储在DB中,或者使用外部服务(如S3)(这是我们在上一个项目中所做的)。

,

是否有一种简单的方法可以将它们直接上传到服务器上的文件夹?(理想情况下不使用autoform等)

考虑使用CollectionFS包,它将文件存储在文件系统目录中。下面是一个来自文档的例子:

Images = new FS.Collection("images", {
  stores: [new FS.Store.FileSystem("images", {path: "~/uploads"})]
});

请注意,路径可以是任何文件系统路径,包括项目公共文件夹内的路径(如果您对安全问题没有问题)。

CollectionFS还为每个文件提供了方便的方法,例如生成URL。

我们使用tomi:upload-jquery, tomi:upload-server包。使用方便,效果好。

我使用ostrio:files。尽管文档很乱,但还是可以让它工作的。

下面是一个来自https://gist.github.com/shobhitg/5b367f01b6daf46a0287的简单示例。

步骤1)在流星的"服务器"文件夹中创建一个javascript文件,即uploadImageServer.js

//Required packages
import fs from "fs";  //var fs = Npm.require("fs")
import os from "os";
import path from "path";
import busboy from "busboy";
var Busboy = Meteor.npmRequire('busboy');
import express  from 'express';
var app = express();
app.get(pageToListingFrom, function (req, res) {
    res.send('<html><head></head><body>'
               <form method="POST" enctype="multipart/form-data">'
                <input type="text" name="textfield"><br />'
                <input type="file" name="filefield"><br />'
                <input type="submit">'
              </form>'
            </body></html>');
  res.end();
});
// accept POST request on the homepage
var pageToListingFrom = "/";  // Page URL to listen from
app.post(pageToListingFrom, function (req, res) {
    var busboy = new Busboy({ headers: req.headers });
    busboy.on('file', function(fieldname, file, filename, encoding, mimetype) {
      //saves the file to this directory
      var saveTo = path.join('D:/MeteorApp/server/', filename);
      console.log('Uploading: ' + saveTo);
      file.pipe(fs.createWriteStream(saveTo));
    });
    busboy.on('finish', function() {
      console.log('Upload complete');
      res.writeHead(200, { 'Connection': 'close' });
      res.end("That's all folks!");
    });
    return req.pipe(busboy);
});
var server = app.listen(3000, function () {
  var host = server.address().address
  var port = server.address().port
  console.log('Example app listening at http://%s:%s', host, port)
});
此时,服务器应该已经开始监听来自本地主机默认主页的"POSTs",因为"var pageToListingFrom"被设置为默认主页的url"/"。您可以将其更改为任何内容,例如"/home/userprofile";

步骤2)之后,您可以通过html FORM或javascript发送到侦听服务器。例如,在你的"客户端"的默认主页,即userprofile.html,你可以使用一个类似于下面的表单上传到服务器。

<html>
  <head>
  </head>
  <body>
    <form method="POST" enctype="multipart/form-data">'
      <input type="text" name="textfield">  <br>
      <input type="file" name="filefield">  <br>
      <input type="submit"> <br>
    </form>
  </body>
</html>