2017-06-18 78 views
5

我已經寫了愛可信POST請求從NPM包的文檔建議像與愛可信POST請求傳遞頭[ReactJS]

var data = { 
     'key1': 'val1', 
     'key2': 'val2' 
} 
axios.post(Helper.getUserAPI(), data) 

      .then((response) => { 
       dispatch({type: FOUND_USER, data: response.data[0]}) 
      }) 
      .catch((error) => { 
       dispatch({type: ERROR_FINDING_USER}) 
      }) 

和它的作品,但現在我已經修改了我的後端API接受頭

的Content-Type: '應用/ JSON的'

授權: 'JWT fefege ......'

現在這個請求在POSTMAN上正常工作,但是當寫一個axios調用時,我會遵循this link並且無法完成它的工作。

我contantly越來越400 BAD Request error

這裏是我的修改請求

axios.post(Helper.getUserAPI(), { 
       headers: { 
        'Content-Type': 'application/json', 
        'Authorization': 'JWT fefege...' 
       }, 
       data 
      }) 

      .then((response) => { 
       dispatch({type: FOUND_USER, data: response.data[0]}) 
      }) 
      .catch((error) => { 
       dispatch({type: ERROR_FINDING_USER}) 
      }) 

任何幫助是極大的讚賞提前

感謝。

回答

12

當使用Axios公司,爲了通過自定義首部,提供一個包含標頭的最後一個參數

修改您Axios的請求等

 var headers = { 
      'Content-Type': 'application/json', 
      'Authorization': 'JWT fefege...' 
     } 
     axios.post(Helper.getUserAPI(), data, headers) 

      .then((response) => { 
       dispatch({type: FOUND_USER, data: response.data[0]}) 
      }) 
      .catch((error) => { 
       dispatch({type: ERROR_FINDING_USER}) 
      }) 
+0

感謝它的工作:) – Jagrati

+0

不工作,獲得500.你能幫助我嗎? –

+0

@KishoreJethava,500是內部服務器錯誤,你可以檢查服務器端,如果標題來了或有一些其他的錯誤 –

0

對象下面是一個Axios公司的一個完整的例子。自定義頁眉POST請求

var postData = { 
 
    email: "[email protected]", 
 
    password: "password" 
 
}; 
 

 
let axiosConfig = { 
 
    headers: { 
 
     'Content-Type': 'application/json;charset=UTF-8', 
 
     "Access-Control-Allow-Origin": "*", 
 
    } 
 
}; 
 

 
axios.post('http://<host>:<port>/<path>', postData, axiosConfig) 
 
.then((res) => { 
 
    console.log("RESPONSE RECEIVED: ", res); 
 
}) 
 
.catch((err) => { 
 
    console.log("AXIOS ERROR: ", err); 
 
})