firefox 中的多个问题，但在 chrome 中正常工作，没有一个问题

Question

我在使用 firefox 时遇到了多个问题，但在 chrome 中没有。

1) TypeError 中的问题：response.body 为空。

2) 上传图片时出现类型错误：FormData.constructor 的参数 1 未实现 HTMLFormElement 接口。

显示问题的代码是

对于第 1 个问题（我为此使用了 superagent）

  search( query='Ganesh Chowk' ){
    let url = "/api/v1/rental/?place__startswith="+encodeURIComponent(query);
    Request.get(url).then((response) => {
    if (response) {
        this.setState({
            place:response.body.objects,
        });
    } else {
        this.setState({
            place: [],
        });
    }
});

第 2 期

  let image = [];
 class RenderPhotos extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.state = {
            files: []
        };
    }

    onDrop(files) {
      console.log('Received files: ', files);
      this.setState({
          files: files
      });

    image = new FormData(files);
    $.each(files,function(i,file){
      image.append('image',file);
    });

    }

为什么此代码适用于 chrome 而不适用于 firefox？要使此代码在所有浏览器中工作，应该更改什么？

Answer 1

关于错误 2：如果将 parameter 传递给 FormData 构造函数，则它必须是 HTML <Form> 元素，而在你的代码。所以只需删除参数：

image = new FormData();

更新：

关于错误 1：正如您自己发现请求需要接受 header application/json。由于 Chrome 和 Firefox 默认接受 headers 的差异，服务器似乎 return json 有效负载 Chrome 而不是 Firefox。无论如何，明确的 header 解决了这个问题。

firefox 中的多个问题，但在 chrome 中正常工作，没有一个问题

Multiple issues in firefox but works properly in chrome with no single issue

javascript

ajax

form-data

superagent

reactjs