标签：

在Vue项目中使用Axios发送请求，如果你想修改服务器端的CORS设置，可以通过请求拦截器和响应拦截器来实现。以下是一个示例：

1. 在 main.js 或你的入口文件中配置Axios的请求拦截器和响应拦截器：

import axios from 'axios';

// 请求拦截器
axios.interceptors.request.use(
  config => {
    // 在发送请求前做一些处理
    config.headers['Access-Control-Allow-Origin'] = 'http://localhost'; // 设置允许请求的源
    config.headers['Access-Control-Allow-Methods'] = 'GET, POST, PUT, DELETE'; // 设置允许的HTTP方法
    config.headers['Access-Control-Allow-Headers'] = 'Content-Type, Authorization'; // 设置允许的请求头
    return config;
  },
  error => {
    return Promise.reject(error);
  }
);

// 响应拦截器
axios.interceptors.response.use(
  response => {
    // 对响应数据进行处理
    return response;
  },
  error => {
    return Promise.reject(error);
  }
);

2. 然后，在你的Vue组件中，可以直接使用Axios发送请求，这样会自动应用上面定义的请求拦截器和响应拦截器：

import axios from 'axios';

axios.get('http://localhost:8081/hmapi/shop-type/list')
  .then(response => {
    // 处理成功响应数据
    console.log(response.data);
  })
  .catch(error => {
    // 处理错误响应
    console.error(error);
  });

在请求拦截器中，你可以根据需要修改请求头部信息，包括 Access-Control-Allow-Origin、Access-Control-Allow-Methods 和 Access-Control-Allow-Headers，确保与服务器端的CORS设置一致。

请注意，由于浏览器的限制，这种方式只会在浏览器端发送请求时添加请求头部，实际的CORS设置仍需要在服务器端进行配置。

标签：
来源：

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。