reactjs 使用模式时：no-cors for a request，browser isn't adding request header I've set in my frontend code

vd2z7a6w 于 2023-04-20 发布在 React

关注(0)|答案(2)|浏览(150)

在我的React应用程序中，我有以下API POST来允许用户编辑他们的配置文件（名称和图像）。

static updateProfile(formData, user_id) {
    const request = new Request(`http://localhost:4300/api/v1/profiles/${user_id}`, {
      headers: new Headers({
        'Authorization': getBearerToken()
      }),
      mode: 'no-cors',
      method: "POST",
      body: formData
    });

    return fetch(request).then(response => {
      return response.json();
    }).catch(error => {
      return error;
    });
  }

上面的问题是在POST中没有发送带有授权令牌的标头...
我怎样才能获得上面的获取请求中要发送的Authorization头？
仅供参考，对于非多部分表单，授权令牌成功发送如下：

static loadProfile(user_id) {
    const request = new Request(`http://localhost:4300/api/v1/profiles/${user_id}`, {
      headers: new Headers({
        'Authorization': getBearerToken(),
        'Accept'       : 'application/json',
        'Content-Type' : 'application/json',
      })
    });

    return fetch(request).then(response => {
      return response.json();
    }).catch(error => {
      return error;
    });
  }

reactjs

来源：https://stackoverflow.com/questions/44747874/when-using-mode-no-cors-for-a-request-browser-isn-t-adding-request-header-i-ve

2条答案

按热度按时间

yeotifhr1#

如果设置了任何特殊的请求头，则不能使用no-cors模式，因为使用它的一个效果是：它告诉浏览器不允许你的前端JavaScript代码设置任何请求头，除了CORS-safelisted request-headers。请参阅规范要求：
要将 name/value 对附加到Headers对象（headers），请运行以下步骤：
1.否则，如果 guard 是“request-no-cors“并且 name/value 不是CORS-safelisted请求头，则返回。
在该算法中，return等同于“返回而不将该头添加到Headers对象”。
Authorization不是一个CORS-safelisted请求头，所以你的浏览器不允许你设置是否使用no-cors模式进行请求。Content-Type: application/json也是如此。
如果您尝试使用no-cors模式的原因是为了避免在不使用时发生其他问题，那么解决方案就是解决其他问题的根本原因。因为无论您尝试解决什么问题，no-cors模式最终都不会成为解决方案。它只会产生不同的问题，例如您遇到的问题。

赞(0）回复(0）举报 2023-04-20

wmtdaxz32#

通过使用下面的代码，您可以使用Authorization或Bearer进行获取请求

var url = "https://yourUrl";
    var bearer = 'Bearer '+ bearer_token;
    fetch(url, {
    method: 'GET',
    withCredentials: true,
    credentials: 'include',
    headers: {
        'Authorization': bearer,
        'X-FP-API-KEY': 'iphone',
        'Content-Type': 'application/json'}
    }).then((responseJson) => {
        var items = JSON.parse(responseJson._bodyInit);
    })
    .catch(error => this.setState({
    isLoading: false,
    message: 'Something bad happened ' + error
    }));

赞(0）回复(0）举报 2023-04-20

我来回答

reactjs 使用模式时：no-cors for a request，browser isn't adding request header I've set in my frontend code

2条答案

相关问题

热门标签

最新问答