Redux Toolkit - GET 永远不会被调用，OPTIONS 永远不会返回答案

【问题标题】：Redux Toolkit - GET is never called, OPTIONS never returnsRedux Toolkit - GET 永远不会被调用，OPTIONS 永远不会返回
【发布时间】：2020-11-18 01:53:59
【问题描述】：

我正在转换我的应用程序以使用新的 React Redux 工具包，但是当我尝试调用 GET 函数时遇到了问题。 OPTIONS 调用已启动，但从未调用 GET。我想不出为什么 thunk 会部分运行的任何原因。代码结构一直在使用旧版 Redux 设置，所以基本上我从工作变为不工作的唯一改变是使用工具包，特别是 createAsyncThunk()。

在我的登录页面组件的mapDispatchToProps...

 fetchProfile: email => dispatch(fetchProfileAction({id:email})),

正在设置我的asyncThunk...

export const fetchProfileAction = createAsyncThunk(
  'profile/fetchProfile',
  async (params, thunkAPI) => {
    const response = await api.userApi.fetchProfile(params);
    return response.data;
  }
);

API 调用...

fetchProfile: (params) => axios.get(authEndpointUrl(`users/${params.id}`)).then(response => response.data),

还有日志语句。 OPTIONS 没有标头或 Cookie...

【问题讨论】：

您正在读取 response.data.data，一旦在 api 中返回 response.data，在操作中返回 response.data。你能在网络选项卡中看到请求吗？你能看到在 redux 开发工具中调度了什么，你能看到这些操作导致的状态发生了哪些变化吗？
是的，我明白您关于引用 response.data.data 的观点 - 但是，它甚至没有达到这一点。永远不会调用 GET，调用 OPTIONS 后一切都会停止。

标签： reactjs redux redux-thunk redux-toolkit

【解决方案1】：

您很可能在违反 CORS 政策的同时尝试从另一个域中获取某些内容。检查浏览器的控制台，您可能会在其中找到有关损坏 CORS 策略的警告，如果是这样，您应该联系 API 管理员并要求他修复其标头（这是后端问题）。

Axios 正在调用 OPTIONS 来检查给定 URL 可用的方法，此时 OPTIONS 标头被 CORS 阻止，或者它们返回 GET / POST 不可用的信息，因此 axios 不甚至尝试调用端点。

【讨论】：

是的，甚至比这更简单。服务器没有运行，所有登录 API 调用都转到 Cognito，所以在 GET 发生之前一切似乎都运行良好。我感谢你的常识。