vue设置Authorization 后端无论如何都取值取不到

如下图所示
前端如下图所示

后端如下图所示

看请求发现发送了两次


综上所述可能时配置代理时候出问题了。

vue.config.js

const { defineConfig } = require("@vue/cli-service");
module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    port: 8888,
    //设置是否启动时打开浏览器
    open: true,
    //设置代理
    proxy: {
      //代理的根路径
      "/": {
        //是都开启ws
        ws: false,
        //代理的后端的路径
        target: "http://localhost:8000/", //这里填入你要请求的接口的前缀
        //是否开启路径转换
        changeOrigin: true, //虚拟的站点需要更管origin
        //代理路径更改
        pathRewrite: {
          "^/": "/", //重写路径
        },
      },
    },
  },
});

如果配置了代理类那么就不能在axios中配置baseurl了。
自己封装的axios类
httpCline.js

import axios from "axios";
import { ElMessage } from "element-plus";




问题就在这行没有注解掉

//**axios.defaults.baseURL = "http://localhost:8000";** 




 
axios.defaults.timeout = 10000;

// request 拦截器
// 可以自请求发送前对请求做一些处理
// 比如统一加token，对请求参数统一加密
axios.interceptors.request.use(
  (config) => {
    // eslint-disable-next-line no-debugger
    debugger;
    console.log("请求" + config);
    // config.headers["Content-Type"] = "application/json;charset=utf-8";
    // eslint-disable-next-line no-debugger
    let token = sessionStorage.getItem("token");
    if (token) {
      //给请求头加token
      config.headers["Authorization"] = token;
      config.headers.Authorization = token;
    }
    // 设置请求头
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);

// response 拦截器
// 可以在接口响应后统一处理结果
axios.interceptors.response.use(
  (response) => {
    if (response.data.flag === true) {
      return Promise.resolve(response);
    } else {
      return Promise.reject(response);
    }
  },
  (error) => {
    // eslint-disable-next-line no-debugger
    console.log("异常", error.response);
    if (error.response.status === 400) {
      ElMessage.error(error.response.data.message);
    } else if (error.response.status === 401) {
      ElMessage.error("您未登录，请登陆后操作");
    } else if (error.response.status === 403) {
      ElMessage.error(error.response.data.message);
    } else if (error.response.status === 404) {
      ElMessage.error("后端端口未找到！");
    } else if (error.response.status === 500) {
      ElMessage.error("后端端口异常！--》" + error.response.data.message);
    } else {
      ElMessage.error("未知错误");
    }
    const errorMsg = JSON.stringify(error);
    console.log("请求异常：" + errorMsg);
  }
);

export default {
  post(uri, data) {
    return new Promise((resolve, reject) => {
      axios({
        method: "post",
        url: uri,
        data: data,
      })
        .then((res) => {
          resolve(res.data);
        })
        .catch((err) => {
          reject(err);
        });
    });
  },
  get(uri) {
    return new Promise((resolve, reject) => {
      axios({
        method: "get",
        url: uri,
      })
        .then((res) => {
          resolve(res.data);
        })
        .catch((err) => {
          reject(err);
        });
    });
  },
  getTwo(uri, data) {
    return new Promise((resolve, reject) => {
      axios({
        method: "get",
        url: uri,
        params: data,
      })
        .then((res) => {
          resolve(res.data);
        })
        .catch((err) => {
          reject(err);
        });
    });
  },
};