未处理的承诺拒绝：错误：请求失败，状态码为 500答案

【问题标题】：Unhandled promise rejection: Error: Request failed with status code 500未处理的承诺拒绝：错误：请求失败，状态码为 500
【发布时间】：2018-06-10 06:42:10
【问题描述】：

我正在尝试调用 api，但收到错误“未处理的承诺拒绝：错误：请求失败，状态码 500”。我不知道我是如何得到错误的。我将 api 调用放在 componentDidMount 中。我不确定错误是来自 redux 实现还是来自我调用 api 的方式。

这就是我调用 api 的方式。登录成功后，我把用户名作为令牌，用它来调用另一个api。

 state={
    username: '',
    semcode: [
        {}
    ]
}

componentWillMount() {
    AsyncStorage.getItem('Login_token').then((token) => {
        console.log('this is coursescreen',token);
        let Login_token = token;
        this.setState({ username: Login_token });

    });   

}

componentDidMount(){
    this.props.getSemcode(this.state.username);  
}
componentWillReceiveProps(nextProps) {
    console.log('xx',nextProps);
    if (nextProps.semCode != undefined) {
        this.setState({ semcode: nextProps.semCode });

    }
}

这就是我编写动作文件的方式：

export const getSemcode = (username) => async dispatch => {

    let param = {
        nomatrik: username,
    }   

    console.log(`${helper.ROOT_URL}/result/GetListOfKodSesiSem`)
    let code_res = await 
    axios.post(`${helper.ROOT_URL}/result/GetListOfKodSesiSem`, param)
    console.log(code_res.data);    
    if (code_res.data.length > 0) {
        const { code } = code_res.data;          
        dispatch({ type: SEMCODE_FETCH_SUCCESS, payload: { semCode: code }});
    }

}

这就是我写reducer的方式：

import { SEMCODE_FETCH_SUCCESS} from '../actions/types';

const INITIAL_STATE={
semCode:[],
}
export default function (state=INITIAL_STATE, action){
switch(action.type){
    case SEMCODE_FETCH_SUCCESS:
      return action.payload
    default:
      return state;
}
}

谁能帮帮我，拜托了

错误信息

从 axios.post 收到错误：{"config":{"transformRequest": {},"transformResponse":{},"timeout":0,"xsrfCookieName":"XSRF- TOKEN","xsrfHeaderName":"X-XSRF-TOKEN","maxContentLength":-1,"headers": {"Accept":"application/json, text/plain, /","Content- 类型":"application/json;charset=utf-8"}, “方法”：“发布”，“nomatrik”：“BB16160907”， "网址":"https://smp.ums.edu.my/api/result/GetListOfKodSesiSem","数据":" {\"接受\":\"应用程序/json\",\"内容- 类型\":\"application/json\"}"},"request": {"UNSENT":0,"OPENED":1,"HEADERS_RECEIVED":2,"LOADING":3,"DONE":4, "readyState":4,"status":500,"timeout":0,"withCredentials":true,"upload": {},"_aborted":false,"_hasError":false,"_method":"POST","_response":" {\"消息\":\"发生错误。\"}", "_url":"https://smp.ums.edu.my/api/result/GetListOfKodSesiSem", "_timedOut":false,"_trackingName":"未知", "_incrementalEvents":false,"responseHeaders":{"日期":"2017 年 12 月 30 日星期六 03:58:25 GMT","Content-Length":"36","X-Powered-By":"ARR/3.0","X-AspNet- 版本":"4.0.30319","Expires":"-1","Content-Type":"application/json; charset=utf-8","Server":"Microsoft-IIS/10.0","Pragma":"no-cache","Cache- 控制":"no-cache"},"_requestId":null,"_headers": {"accept":"application/json, text/plain, /","content- 类型":"应用程序/json;charset=utf- 8"},"_responseType":"","_sent":true,"_lowerCaseResponseHeaders":{"date":"星期六, 2017 年 12 月 30 日 03:58:25 GMT","内容长度":"36","x-powered-by":"ARR/3.0","x- aspnet-version":"4.0.30319","expires":"-1","content-type":"application/json; charset=utf-8","server":"Microsoft-IIS/10.0","pragma":"no-cache","cache- control":"no-cache"},"_subscriptions":[],"responseURL": "https://smp.ums.edu.my/api/result/GetListOfKodSesiSem"},"响应":{"数据": {"Message":"有一个错误发生。"},"status":500,"headers":{"date":"Sat, 30 Dec 2017 03:58:25 GMT","内容长度":"36","x-powered-by":"ARR/3.0","x- aspnet-version":"4.0.30319","expires":"-1","content-type":"application/json; charset=utf-8","server":"Microsoft-IIS/10.0","pragma":"no-cache","cache- 控制":"no-cache"},"config":{"transformRequest":{},"transformResponse": {},"timeout":0,"xsrfCookieName":"XSRF-TOKEN","xsrfHeaderName":"X-XSRF- TOKEN","maxContentLength":-1,"headers":{"Accept":"application/json, 文本/纯文本， /","Content-Type":"application/json;charset=utf-8"},"method":"post","nomatrik":"BB16160907", "url":"https://smp.ums.edu.my/api/result/GetListOfKodSesiSem","数据":" {\"接受\":\"应用程序/json\",\"内容- 类型\":\"application/json\"}"},"request": {"UNSENT":0,"OPENED":1,"HEADERS_RECEIVED":2,"LOADING":3,"DONE":4, "readyState":4,"status":500,"timeout":0,"withCredentials":true,"upload": {},"_aborted":false,"_hasError":false,"_method":"POST","_response":" {\"消息\":\"发生错误。\"}", "_url":"https://smp.ums.edu.my/api/result/GetListOfKodSesiSem", "_timedOut":false,"_trackingName":"unknown","_incrementalEvents":false, "responseHeaders":{"Date":"星期六，2017 年 12 月 30 日 03:58:25 GMT","Content- 长度":"36","X-Powered-By":"ARR/3.0","X-AspNet- 版本":"4.0.30319","Expires":"-1","Content-Type":"application/json; charset=utf-8","Server":"Microsoft-IIS/10.0","Pragma":"no-cache","Cache- 控制":"no-cache"},"_requestId":null,"_headers": {"accept":"application/json, text/plain, /","content- 类型":"应用程序/json;charset=utf- 8"},"_responseType":"","_sent":true,"_lowerCaseResponseHeaders":{"date":"星期六, 2017 年 12 月 30 日 03:58:25 GMT","内容长度":"36","x-powered-by":"ARR/3.0","x- aspnet-version":"4.0.30319","expires":"-1","content-type":"application/json; charset=utf-8","server":"Microsoft-IIS/10.0","pragma":"no-cache","cache- 控制":"无缓存"},"_subscriptions": [],"responseURL":"https://smp.ums.edu.my/api/result/GetListOfKodSesiSem"}}}

登录操作：

export const attemptLogin = (username, password) => async dispatch => {

let param = {
    txtNomatrik: username,
    txtPwd: password,
    public_key: helper.PUBLIC_KEY,
    secret_key: helper.SECRET_KEY

}

console.log(`${helper.ROOT_API_URL}/v1/basic/ad/std/login`)
let login_res = await 
axios.post(`${helper.ROOT_API_URL}/v1/basic/ad/std/login`, param)

console.log(login_res.data);
await AsyncStorage.setItem('jwtToken',login_res.data.token);
if (login_res.data.status == 'Successful login') {
    const { login } = login_res.data;    
    dispatch({ type: LOGIN_SUCCESS});   
}
}

【问题讨论】：

嘿gdphy，我建议你下载邮递员。这是一个非常简洁的应用程序，可让您在一个漂亮的 GUI 中测试您的 API 调用。它将向您显示响应并帮助您调试应用程序。 getpostman.com祝你好运！
API 在邮递员中运行良好。我尝试调试错误，但出现如下错误，我不知道如何解决它
酷我很乐意帮助你。告诉我几件事。 1.你使用什么API。 2.您确定您将任何必要的令牌传递给api端点吗？ 3. 有没有 API 的文档可以给我看？看起来您将令牌传递给变量用户名并将其设置为参数。然后发出 axios POST 请求。我以前遇到过这样的问题，100% 的时间是 API 期望你以某种方式格式化你的查询，而我做的有点不对。它可以像确保设置标头 Content-Type: application/json 一样简单。尝试将信息发送给我。
天哪，我真是个傻瓜，现在我意识到了。我忘了包括 jwt 令牌。我可以知道在发出 axios 请求时如何在标头中包含 jwt 令牌吗？我真的不知道该怎么做。我确实在登录操作中将 jwt 令牌存储在 asyncstorage 中，但不知道如何继续。
没问题。我在想它是这样的。我刚刚为你添加了一个答案。请接受我的回答。我也将快速添加更多示例。您可能面临的另一个问题是，有时您必须根据您正在访问的 api 端点以特殊方式形成请求。通常它会给你一个例子。因此，如果您能给我一个指向我可以查看的 api 的链接。否则，请尝试使用下面我的答案中的示例。

标签： react-native react-redux

【解决方案1】：

你找错地方了。

远程服务器无法处理请求时返回错误代码 500。在这种情况下，我怀疑到 ${helper.ROOT_URL}/result/GetListOfKodSesiSem 的 POST 失败。 axios 库是一个基于 Promise 的库。将调用包装在一个 try-catch 块中，如下所示：

try {
  console.log(`${helper.ROOT_URL}/result/GetListOfKodSesiSem`)
  let code_res = await 
  axios.post(`${helper.ROOT_URL}/result/GetListOfKodSesiSem`, param)
  console.log(code_res.data);    
  if (code_res.data.length > 0) {
    const { code } = code_res.data;          
    dispatch({ type: SEMCODE_FETCH_SUCCESS, payload: { semCode: code }});
  }
} catch (err) {
  console.error(`Error received from axios.post: ${JSON.stringify(err)}`);
}

这至少可以让您在调试控制台中了解正在发生的事情。然后，您可以将该调用与来自后端的任何调试日志进行协调，以找出真正的错误。

但是，您的根本原因是远程服务器正在向您的客户端返回服务器错误（HTTP 代码 500）。

【讨论】：

【解决方案2】：

问题

您的请求失败，因为您没有将 JWT 令牌添加到标头中。

解决方案

使用 Axios 和您的代码应该可以。显然我们这里的大问题是你必须通过data，即使它是空的。如果我们没有通过data，它会以error 500 失败。

export const getSemcode = (username) => async dispatch => {

  let jwtToken = await AsyncStorage.getItem('jwtToken').then((data) => {
        console.log('this is semcode',data);
    });   


    let config = {
      method: 'POST',
      url: 'url/to/sem',
        headers: {
          'content-type': 'application/x-www-form-urlencoded',
          AntiTemperSignature: jwtToken,
          UserID: '123456',
        },
        data: '',
      json: true
    };

  try {
    return axios(config)
     .then((response) => {
       console.log(response);
       if (response.data.length > 0) {
           const { code } = response.data;
           dispatch({ type: SEMCODE_FETCH_SUCCESS, payload: { semCode: code } });
       }
     })
     .catch((error) => {
       console.log(error);
     });
   }
}

【讨论】：