Axios中GET请求可传Authorization Token，POST请求无法传递问题排查

我在使用Axios开发时，GET和POST请求均在Authorization请求头中携带了Token，但服务端仅能接收到GET请求的Token，POST请求的Authorization头无法被获取。

GET请求代码及验证 #

axios
  .get(
    "https://localhost:8000/user/delete/" + data + "",
    {
      headers: { Authorization: `Bearer ${localStorage.getItem('token')}` }
    }
  )
  .then((response) => {
    console.log(response)
    if(response.data.status===200){
      window.location.href='/dashboard'
    }
    else if(response.data.status===404){
      console.log('Your token has been expired')
    }
    else if(response.data.status===403){
      console.log('Incorrect Token')
    }
    else if(response.data.status===402){
      console.log('Token does not matched')
    }
  })

GET请求可正常携带Token，服务端能正常接收。

POST请求代码及问题 #

axios
  .post(
    "https://localhost:8000/user/update", 
    {
      id:document.getElementById("id").value,
      name:document.getElementById("name").value,
      email:document.getElementById("email").value,
      password:document.getElementById("password").value,
      retype:document.getElementById("retype").value,
      contact:document.getElementById("contact").value
    },
    {
      headers: {
        "Content-type": "application/json",
        "Authorization":`Bearer${localStorage.getItem('token')}`
      }
    },
  )
  .then((response) => {
    window.location.href='/dashboard'
  })

POST请求的Authorization头未被服务端识别接收。

问题原因及解决方法 #

问题根源在于POST请求的Authorization头格式错误：Bearer和Token之间缺少了必要的空格。

GET请求中Bearer后有空格（Bearer ${localStorage.getItem('token')}），符合OAuth2的Bearer Token规范；而POST请求里写成了Bearer${localStorage.getItem('token')}，没有空格，导致服务端无法正确解析这个头信息。

只需修改POST请求的Authorization头，补充空格即可：

"Authorization": `Bearer ${localStorage.getItem('token')}`

内容的提问来源于stack exchange，提问作者f180111 Yousaf Zahid