Axios Post 方法授權不起作用 - React

Question

我正在開發一個網站 [將 React 用於前端 // Spring 用於后端]，並且在該網站中有一個管理面板。 有一個按鈕可以讓其他管理員將用戶添加到數據庫，但我對 axios 的 post 方法有疑問。

我檢查了很多不同的來源，但找不到我正在尋找的東西。 所以我在這里。

使用以下語法時，我收到此錯誤， 401 錯誤代碼，未經授權的客戶端

async addUsers(newData){

        const headers = {
            'Content-Type': 'application/json',
            'Authorization': window.$auth
          }

        await Axios.post(
            "http://localhost:8080/admin/addUser",  
            JSON.stringify(newData),  
            {headers: headers}
            );
    }

之前，我嘗試使用我認為錯誤的不同語法，使用此語法我得到 415 錯誤代碼： 415 錯誤代碼，不支持的媒體類型

async addUsers(newData){

        await Axios.post(
            "http://localhost:8080/admin/addUser",  
            JSON.stringify(newData),  
            {auth:window.$auth},
            {headers: {'Content-Type':'application/json'}}
            );
    }

PS：我嘗試使用 Insomnia REST 客戶端手動將用戶添加到數據庫，它成功添加並返回 200 代碼。
有人可以幫我解決這個問題嗎？

Answer 1

與其隨每個請求一起發送授權令牌，不如將其添加為默認 header。 首先檢查令牌是否存在如果它存在添加它

if(authorization_token){
 axios.defaults.headers.common['Authorization'] = authorization_token;
}

Answer 2

看起來這個“授權總是返回 401 錯誤代碼”是一個已知問題。 更改完整的語法修復了它。 這是我在https 上找到解決方案的網站：//github.com/axios/axios/issues/926
這是我修復並現在可以使用的代碼部分：

async addUsers(newData){

        await Axios({
            method:'post',
            url:'http://localhost:8080/admin/addUser',
            data:JSON.stringify(newData),
            auth:window.$auth,
            headers:{'Content-Type':'application/json'}
        })
    }