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

Question

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

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

2) 上传图片时出现 TypeError: Argument 1 of FormData.constructor does not implement interface 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: [],
        });
    }
});

第二期

  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：正如您自己发现的那样，请求需要一个接受标头 application/json。由于 Chrome 和 Firefox 默认接受标头的差异，服务器似乎为 Chrome 而不是 Firefox 返回一个 json 有效负载。无论如何，显式标头解决了该问题。