相关疑难解决方法(0)

的XMLHttpRequest的2级标准(还是工作草案)定义FormData的接口.此接口允许将File对象附加到XHR请求(Ajax请求).

顺便说一句,这是一个新功能 - 在过去,使用了"隐藏iframe技巧"(在我的另一个问题中阅读).

这就是它的工作原理(例子):

var xhr = new XMLHttpRequest(),
    fd = new FormData();

fd.append( 'file', input.files[0] );
xhr.open( 'POST', 'http://example.com/script.php', true );
xhr.onreadystatechange = handler;
xhr.send( fd );

where input是一个<input type="file">字段,handler是Ajax请求的成功处理程序.

这在所有浏览器中都很漂亮(除了IE之外).

现在,我想使这个功能与jQuery一起使用.我试过这个:

var fd = new FormData();    
fd.append( 'file', input.files[0] );

$.post( 'http://example.com/script.php', fd, handler );

不幸的是,这不起作用(抛出"非法调用"错误 - 截图在这里).我假设jQuery需要一个表示form-field-names/values的简单键值对象,而FormData我传入的实例显然是不兼容的.

现在,由于可以将FormData实例传入xhr.send(),我希望它也可以使它与jQuery一起使用.

更新:

我在jQuery的Bug Tracker上创建了一个"功能票".它在这里:http://bugs.jquery.com/ticket/9995

我被建议使用"Ajax prefilter"...... …

我一直在寻找一段时间ReactJS component来允许你从a上传文件browser并将其保存到服务器ReactJS上运行.

我找到了各种各样的components drag and drop以及superagent可能将文件保存到服务器但是我想有人可能已经创建了component所有这些？

后端是一个使用Spring Boot,Spring Data JPA和Spring Data REST的Java应用程序.

有没有人知道有关设置将文件保存到服务器的基本方法的一个或教程？

解

最后,我使用dropzone和superagent的部分解决方案,然后使用Spring指南(https://spring.io/guides/gs/uploading-files/)

上传者组件

'use strict';

const React = require('react');
const ReactDOM = require('react-dom');

const log = require('./log'); // logger to enable debug alerts

// import the components
const Dropzone = require('react-dropzone');
const request = require('superagent');

//'application/java-archive'
class Uploader extends React.Component {
  constructor(props) {
    super(props);
    this.dropHandler = this.dropHandler.bind(this);
  }

  dropHandler(file) {
    var jsonFile …