使用vue-element-admin框架开发时遇到的跨域问题

本文介绍了在使用vue-element-admin开发时遇到的跨域问题及其解决方案。通过安装http-proxy-middleware插件,配置dev.evn.js, config/index.js和src/utils/request.js文件,然后重启项目,成功解决了跨域问题。" 88534138,8254541,自制C++推箱子游戏:从一维到多维数组的编程之旅,"['C/C++', '游戏开发', '数组']

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 

 

 

开发环境所用工具

1)webpack

2)vue

3)vue-element-admin

4)http-proxy-middleware[解决跨域的webpack插件]

 

解决步骤

一,安装 http-proxy-middleware 插件

$ npm install --save-dev http-proxy-middleware

 

 

二,配置dev.evn.js文件

 

module.exports = {
  NODE_ENV: '"development"',
  ENV_CONFIG: '"dev"',
  // BASE_API: '"http://localhost:8080/sct.kb.service"',
  // BASE_API: '"/apis"'
}

 

 

三,配置config/index.js文件

    proxyTable: {
      '/cloudServicePcAction.do': {
        target: baseUrl,
        changeOrigin: true
      }
    },

说明:

1)cloudServicePcAction.do:每个请求都会有的;

2)target:是真实的地址,例如:http://192.168.1.100:8080

3)changeOrigin:true,必须要加上,否则无效;

 

四、src/utils/request.js

// 创建一个axios实例
const service = axios.create({
  // baseURL: process.env.BASE_API,   
  timeout: 5000,                      // request timeout,请求超时时间,
})

说明:

    1)将baseURL注释掉;

 

 

五、重启

 

重启即可;

 

 

参考

http://www.cnblogs.com/zhixi/p/9541162.html

 

 

 

 


==============================
QQ群:143522604
群里有相关资源
欢迎和大家一起学习、交流、提升!
==============================

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值