连接到 slack api 中的 chat.postMessage 的 CORS 策略错误，标头已设置但未在 React 和 Redux 中设置 [重复]

Posted 2023-02-21

【中文标题】连接到 slack api 中的 chat.postMessage 的 CORS 策略错误，标头已设置但未在 React 和 Redux 中设置 [重复]

【英文标题】：CORS policy error connecting to chat.postMessage in slack api with headers set and not set in React and Redux [duplicate]

【发布时间】：2019-10-29 00:19:49

【问题描述】：

我尝试使用 React 和 axios 向 slack api 发送消息，但由于一些未知原因，我收到了 CORS 策略错误。

export const sendMessage = data => dispatch => 
    console.log(data);
    const message = 
        channel: data.currentChannelId,
        text: data.text
    ;
    const token =
        "MY_TOKEN";

    const config = 
        "Content-Type": "application/json",
        "Authorization": `Bearer $token`
    ;
    axios
        .post("https://slack.com/api/chat.postMessage", JSON.stringify(message), config)
        .then(res => 
            console.log(res);
            dispatch(
                type: actionTypes.SEND_MESSAGE,
                payload: data
            );
        )
        .catch(err =>
            dispatch(
                type: actionTypes.SEND_MESSAGE,
                payload: 
            )
        );
;

查看了这里的很多问题，也联系了slack的支持，得到如下信息：

我们已经看到开发人员通过确保他们 没有连同他们的请求一起发送任何标头？这可能导致 我们这边的预检错误。

你能试试看是否有帮助吗？

当然，不发送任何标头是不可能的，因为我们也在标头中发送授权。

我尝试只删除"Content-Type": "application/json"，但同样的错误再次发生。我也尝试将其更改为"Content-Type": "application/x-www-form-urlencoded"

在这两种情况下都不会发生任何变化。 我收到此错误：

在“https://slack.com/api/chat.postMessage”访问 XMLHttpRequest 来自原点“http://localhost:3000”已被 CORS 策略阻止： 请求标头字段内容类型不允许 预检响应中的 Access-Control-Allow-Headers。

虽然还有很多其他问题，这可能是重复的，但没有一个答案适合我的问题。

【问题讨论】：

@sideshowbarker 亲爱的朋友，我已阅读您对问题的回答。但是，它并没有解决我的问题。如您所见，我在文本中提到我曾尝试删除内容类型，但没有任何帮助。您至少可以阅读我的文字，然后将其标记为重复。

其实你没有成功移除 Content-Type 请求头。如果您有，您将不会收到一条消息，说明 “在预检响应中 Access-Control-Allow-Headers 不允许请求标头字段内容类型”

成功删除是什么意思？我真的做到了

我遇到了同样的错误，只需在 API 服务器端添加这些标头即可解决 Access-Control-Allow-Origin: * Access-Control-Allow-Methods: POST,GET,PUT,DELETE Access-Control -Allow-Headers：授权

@himanshu 我正在本地主机上尝试这个，并将Access-Control-Allow-Origin: * 这个添加到 axios 发送的标头中。你是这个意思吗？

【参考方案1】：

从您的请求中删除 Content-Type 标头。 Slack 的 API 端点不发送带有 Access-Control-Allow-Headers 的响应，因此预检失败。

【讨论】：

正如我在问题中提到的，我做到了。请重新检查我的问题！