Question

我正在尝试创建一个文件上传表单，该表单可以通过拖放和通用上传按钮完成，但我无法通过拖放来上传。

在代码中的这一点上，在使用jquery：

发送ajaxData对象之前

    var ajaxData = new FormData($form.get(0));

    if (droppedFiles) {
        $.each( droppedFiles, function(i, file) {
            ajaxData[i] = file;
        });
    }

    console.log(ajaxData)

ajaxData字典显示拖放文件的所有预期文件名和文件信息，但

但是当我正常上传文件时，通过<input type="file"/> ajaxData记录为一个简单的formData对象（似乎是）为空：

FormData {}__proto__: FormData

现在，当我检查所做的请求时，拖放创建的ajaxData只发送没有文件的密钥，

csv1: 
csv2:
csv3:

而通用上传按预期发送文件。

csv1: csv1.csv
...

为什么不上传拖动的文件，即使我在JavaScript控制台中看到这些文件时我还没有看到通用上传文件？

Answer 1

您可以使用FormData FordData方法将属性附加到ajaxData.append(i, file)实例

FormData

和.append()获取ajaxData.get("csv1")实例

的特定属性的值

import { Router, Request, Response, NextFunction } from 'express';
import { PostgresDataAccess } from '../dal/postgres';

const config = require('../../config/config');

export class ProjectRouter {
  public router: Router;

  dal: PostgresDataAccess;

  /**
   * Construct the Project Router.
   */
  constructor() {
    this.dal = new PostgresDataAccess(config);
    this.router = Router();
    this.init();
  }

  /**
   * Take each handler, and attach to one of the Express.Router's endpoints.
   */
  init() {
    this.router.get('/', this.get);
    this.router.get('/:id', this.getOne);
  }

  /**
   * GET: Returns all projects.
   */
  get(req: Request, res: Response, next: NextFunction) {
    let projects = this.dal.queryDb('select * from projects', null, res);
  }

  /**
   * GET: Retuns one project by id.
   */
  getOne(req: Request, res: Response, next: NextFunction) {
    let projects = this.dal.queryDb('select * from projects where id = $1', [req.params.id], res);
  }
}

const projectRouter = new ProjectRouter();
export default projectRouter.router;

拖放的文件显示在JavaScript中，但不会出现在请求中

1 个答案: