Question

我项目中的所有内容均应正常运行。我得到“请求”答案（200 OK），但仍然收到此警告；

（“跨域读取阻止（CORB）阻止了MIME类型为application / json的跨域响应https://api.imgur.com/3/upload。有关更多详细信息，请参见https://www.chromestatus.com/feature/5629709824032768。”）

并且数据为空，如下图所示。

我已将其用作google chrome扩展。允许控制允许来源：* 当我在使用扩展之前和之后收到跨原点错误时，没有问题。


class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      files: []
    }
    this.onFormSubmit = this.onFormSubmit.bind(this)

    this.inputRef = React.createRef(null);
  }

  onFormSubmit(e) {
    e.preventDefault();
    const formData = new FormData();
    formData.append('image', this.inputRef.current.files[0]);
    axios.post('https://api.imgur.com/3/upload', formData, {
      headers: {
        "Authorization": "Client-ID *******"
      }
    })
      .then(res => {
        console.log(res);
      })
  }
  render() {
    const files = this.state.files
    return (
      <form onSubmit={this.onFormSubmit}>
        <h1>File Upload</h1>
        <input ref={this.inputRef} type="file" onChange={this.onChange} multiple />
        <button type="submit">Upload</button>
        <div className="images">
          {
            files.map((file) => (
              <img key={file} src={file} />
            ))}
        </div>
      </form>
    )
  }
}

enter image description here

Imgur api axios请求被CORB阻止

0 个答案: