为什么我的“多部分/表单数据”标头不阻止发送飞行前（选项）请求？

Question

我用的是角度9。我请求获取二进制图像数据。。。

headersMultiPartForm = new HttpHeaders().set('Content-Type', 'multipart/form-data');
    ...
  getImage(id) {
    let api = `${this.endpoint}/person-library-image?id=${id}`;
    return this.http
      .get(api, {headers: this.headersMultiPartForm, responseType: "blob"})
      .pipe(retry(this.retry), catchError(this.handleError));
  }

    ...
results.forEach(( componentarray, key ) => {
    ...
    this.myService.getImage(id).subscribe(data => {
      ...
      this.createImageFromBlob(data, index);
      ...
    }, () => {
      ...
    });

});

我注意到请求需要一段时间才能完成，这似乎是因为它们被阻止，等待选项请求完成。我想阻止发送这些飞行前选项请求。我认为我的“多部分/表单数据”会阻止飞行前请求，但显然不是。。。

当我通过右键单击并复制为CURL来检查实际请求时，我看到...

curl 'http://localhost:7071/api/person-library-image?id=127' -H 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:81.0) Gecko/20100101 Firefox/81.0' -H 'Accept: application/json, text/plain, */*' -H 'Accept-Language: en-US,en;q=0.5' --compressed -H 'Referer: http://localhost:4200/picture-library' -H 'Content-Type: multipart/form-data' -H 'Authorization: JWT <token>' -H 'Origin: http://localhost:4200' -H 'Connection: keep-alive' -H 'Pragma: no-cache' -H 'Cache-Control: no-cache'

我有一个拦截器添加授权头，但我不知道其他头从哪里来。你知道我如何关掉它们，这样我就可以阻止这些飞行前选项请求了吗？

Answer 1

您所说的是简单与非简单CORS请求。

事实上，POST与应用程序/x-wow-form-urlencoded内容类型是简单的，如后所述，所以不应该需要预飞行。但是，有一个重要的注意事项是你的情况：

☝ Another tricky important condition - to be simple requests must have no manually 
set headers. Default headers sent by browser are OK, we are talking only about 
headers set by you from your request maker like XHR/fetch/axios/superagent/jQuery Ajax. 
BTW request maker can set it without your agreement, so better start with pure 
browser-native XHR of fetch API, don't use superagent/axios unless you know why
you need it. If you need to set a header by yourself still  and still want keep 
request simple you are allowed to white-listed request headers and their values, they
called CORS-safelisted. You can find their list and allowed values on fetch spec: 
https://fetch.spec.whatwg.org/#cors-safelisted-request-header

检查请求中的标题，可能您有一些拦截器添加了它，它们很可能不是根据https://fetch.spec.whatwg.org/#cors-安全列表请求头