Question

如何使用grunt-connect和livereload来测试上传文件到服务器？

我正在为我的项目使用Yeoman和angular-seed。其中一个要求是能够将文件上传到服务器。我没有为项目设置一些外部服务器，而是希望能够保留当前设置中包含的所有内容。

此解决方案将中间件直接添加到Gruntfile.js中以进行grunt-connect。

首先加载connect bodyParser，这样可以更轻松地解析上传的文件和表单元素。

接下来，它在'/ upload'设置端点。这将是开发和测试期间使用的路线。此中间件返回具有文件属性的基本响应。

最后，Yeoman自动配置的静态路由将附加到中间件列表中，然后返回到grunt-connect。

Answer 1

用于向grunt-connect添加文件上载处理程序的配置属性。

livereload: {
  options: {
    open: true,
    base: [ '.tmp', '<%= yeoman.app %>' ],
    middleware: function (connect, options) {
      var middlewares = [

        connect().use(connect.bodyParser({ uploadDir: '.tmp' })),
        connect().use('/upload', function(req, res, next) {
          /*
          console.log(req.files); // files properties
          console.log(req.body); // form properties
          */
          res.setHeader('Content-Type', 'application/json');

          // response with basic file stats
          res.end(JSON.stringify({ 
            'size': req.files.file.size, 
            'path' : req.files.file.path, 
            'other' : null }));
        })
      ];

      // add the static paths in options.base
      options.base.forEach(function (base) {
        middlewares.push(connect.static(base));
      });

      return middlewares;
    }
  }
}

用于测试文件上传的grunt-connect中间件

1 个答案: