前端报错解决方法：Failed to execute ‘setRequestHeader‘ on ‘XMLHttpRequest‘: Value is not a valid ByteString.

Failed to execute ‘setRequestHeader’ on ‘XMLHttpRequest’: Value is not a valid ByteString.

前端使用axios请求拦截，并设置请求头信息时，报错Failed to execute ‘setRequestHeader’ on ‘XMLHttpRequest’: Value is not a valid ByteString.

原因

在头信息中存在中文，需要对其进行编码。

解决方法

使用encodeURIComponent()对中文信息进行编码即可。

// 拦截请求
axios.interceptors.request.use(
  config => {
     
    const token = store.state.user.token
    config.headers['Page-Title'] = encodeURIComponent(router.history.current.meta.title)
    config.headers['Content-Type'] = 'application/json;charset=UTF-8'
    if (token) {
     
      config.headers['Authorization'] = token
    }
    return config
  },
  err => {
     
    return Promise.reject(err)
  }
)