未処理約束拒否：エラー：ステータスコード500で要求が失敗しました

Question

APIを呼び出そうとしていますが、「未処理の約束拒否：エラー：要求がステータスコード500で失敗しました。私はどのように私はエラーを取得したかわからない。私はcomponentDidMountでAPIコールを入れた。私はエラーが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 }); 

    } 
} 

これは私が私のアクションファイルに書いた方法です：

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; 
} 
} 

誰も私が

エラーメッセージをpleaseeeeee助けることができます：これは私が私の減速を書いた方法です

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 }}); 
    } 

} 

を

Error received from axios.post: {"config":{"transformRequest": {},"transformResponse":{},"timeout":0,"xsrfCookieName":"XSRF- TOKEN","xsrfHeaderName":"X-XSRF-TOKEN","maxContentLength":-1,"headers": {"Accept":"application/json, text/plain, /","Content- Type":"application/json;charset=utf-8"}, "method":"post","nomatrik":"BB16160907", "url":" https://smp.ums.edu.my/api/result/GetListOfKodSesiSem ","data":" {\"Accept\":\"application/json\",\"Content- Type\":\"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":" {\"Message\":\"An error has occurred.\"}", "_url":" https://smp.ums.edu.my/api/result/GetListOfKodSesiSem ", "_timedOut":false,"_trackingName":"unknown", "_incrementalEvents":false,"responseHeaders":{"Date":"Sat, 30 Dec 2017 03:58:25 GMT","Content-Length":"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"},"_requestId":null,"_headers": {"accept":"application/json, text/plain, /","content- type":"application/json;charset=utf- 8"},"_responseType":"","_sent":true,"_lowerCaseResponseHeaders":{"date":"Sat, 30 Dec 2017 03:58:25 GMT","content-length":"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 "},"response":{"data": {"Message":"An error has occurred."},"status":500,"headers":{"date":"Sat, 30 Dec 2017 03:58:25 GMT","content-length":"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"},"config":{"transformRequest":{},"transformResponse": {},"timeout":0,"xsrfCookieName":"XSRF-TOKEN","xsrfHeaderName":"X-XSRF- TOKEN","maxContentLength":-1,"headers":{"Accept":"application/json, text/plain, /","Content-Type":"application/json;charset=utf-8"},"method": "post","nomatrik":"BB16160907", "url":" https://smp.ums.edu.my/api/result/GetListOfKodSesiSem ","data":" {\"Accept\":\"application/json\",\"Content- Type\":\"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":" {\"Message\":\"An error has occurred.\"}", "_url":" https://smp.ums.edu.my/api/result/GetListOfKodSesiSem ", "_timedOut":false,"_trackingName":"unknown","_incrementalEvents":false, "responseHeaders":{"Date":"Sat, 30 Dec 2017 03:58:25 GMT","Content- Length":"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"},"_requestId":null,"_headers": {"accept":"application/json, text/plain, /","content- type":"application/json;charset=utf- 8"},"_responseType":"","_sent":true,"_lowerCaseResponseHeaders":{"date":"Sat, 30 Dec 2017 03:58:25 GMT","content-length":"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 "}}}

ログインアクション：

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}); 
} 
} 

Answer 1

あなたは間違った場所で探しています。

リモートサーバーが要求を処理できない場合、エラーコード500が返されます。この場合、${helper.ROOT_URL}/result/GetListOfKodSesiSemへのPOSTが失敗していると思われます。 axiosライブラリは、約束ベースのライブラリです。次のような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）をクライアントに返すことです。

Answer 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); 
    }); 
    } 
}