1、config/index.js下添加proxyTable

dev: {
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable:{
"/api/*":{
target: 'http://*.*.*.*:9502',//后端接口地址
secure:false,
changeOrigin:true,
pathRewrite:{
"^/api":""
}
}
}, // Various Dev Server settings // can be overwritten by process.env.HOST
// if you want dev by ip, please set host: '0.0.0.0'
host: '192.168.1.127',
port: 9527, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: true,
}

  2、配置config/dev.env.js  (本地地址+api)

module.exports = {
NODE_ENV: '"development"',
ENV_CONFIG: '"dev"',
// BASE_API: '"http://172.17.92.255:9502"'
BASE_API: '"http://192.168.1.127:9527/api"'
}

  3、创建request.js请求接口

// create an axios instance
const service = axios.create({
baseURL: process.env.BASE_API, // api 的 base_url
timeout: 5000,// request timeout,
headers: {
'Content-Type': 'application/json; charset=utf-8'
}
})

  4、实例

export function getContractList(data = {}, headData={}) {
return request({
url: '/cms/companyList',
method: 'post',
data: data,
headers:headData
})
}

  

vue.js 本地解决跨域的更多相关文章

  1. vue.js vue-jsonp解决跨域问题

    安装jsonp npm install vue-jsonp --save main.js中引入 import VueJsonp from 'vue-jsonp' Vue.use(VueJsonp) 组 ...

  2. vue.js学习之 跨域请求代理与axios传参

    vue.js学习之 跨域请求代理与axios传参 一:跨域请求代理 1:打开config/index.js module.exports{ dev: { } } 在这里面找到proxyTable{}, ...

  3. vue webpack配置解决跨域问题

    现在基本项目都是实行前后端分离的原则,不管是ng 或者是vue 在开发中都无法避免跨域的这个问题 本人刚上手第一个vue项目,在调用api的时候出现了跨域的这个问题 这是封装好一个简单的post 请求 ...

  4. vue+nodejs+express解决跨域问题

    nodejs+express解决跨域问题,发现网上的大部分都是误导人,花了不少时间,终于弄懂了, 我在vue+nodejs+express+mongodb的项目里面,发现本地用vue代理正常调用远程的 ...

  5. nuxt.js 本地开发跨域问题(Access-Control-Allow-Origin)及其解决方案

    先运行npm i @gauseen/nuxt-proxy -D 再nuxt.config.js的module.exports 里面添加如下代码 modules:[ '@nuxtjs/axios', / ...

  6. [转] js前端解决跨域问题的8种方案(最新最全)

    1.同源策略如下: URL 说明 是否允许通信 http://www.a.com/a.jshttp://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.j ...

  7. Nginx反向代理和Node.js后端解决跨域问题

    最近在写自己的博客,涉及到跨域的问题,自己捣鼓许久,终于解决了.然后总结一下,记录一下,日后遇到类似的问题的时候也可以得到一些启发. 一.什么是跨域 跨域,指的是浏览器不能执行其他网站的脚本.它是由浏 ...

  8. Vue.js 2.0 跨域请求数据

    Vuejs由1.0更新到了2.0版本.HTTP请求官方也从推荐使用Vue-Resoure变为了 axios .接下来我们来简单地用axios进行一下异步请求.(阅读本文作者默认读者具有使用npm命令的 ...

  9. Springboot html vue.js 前后分离 跨域 Activiti6 工作流 集成代码生成器 shiro 权限

    官网:www.fhadmin.org 特别注意: Springboot 工作流  前后分离 + 跨域 版本 (权限控制到菜单和按钮) 后台框架:springboot2.1.2+ activiti6.0 ...

随机推荐

  1. go学习第三天、数据类型

    基本数据类型 bool string int int8 int16 int32 int64 uint uint8 uint16 uint32 uint64 uintptr byte // alias ...

  2. checkbox多选框取值

    var SelectQuestionAnswer = $("input:checkbox[name='SelectQuestionAnswer']:checked").map(fu ...

  3. idea实现简单热部署

    首先我们打开设置tomcat的页面         

  4. Seata 配置中心实现原理

    Seata 可以支持多个第三方配置中心,那么 Seata 是如何同时兼容那么多个配置中心的呢?下面我给大家详细介绍下 Seata 配置中心的实现原理. 配置中心属性加载 在 Seata 配置中心,有两 ...

  5. unittest自动化测试框架

    目录 框架的概念 Unittest单元测试框架 常用的assert语句 unittest创建测试代码的方式: unittest构建测试套件(测试用例集合): unittest忽略测试用例: 运行测试集 ...

  6. IP地址的配置

    1.右击 网上邻居 → 属性 2.右击 本地连接 → 属性 3.选择Internet协议(TCP/IP) → 属性 配置如下, 默认网关始终是网段的第一个地址 4.打开cmd → 输入 ipconfi ...

  7. leetcode-164、最大间距

    export default (arr) => { // 如果数组长度小于2返回0 if (arr.length < 2) { return 0 } // 排序 arr.sort() // ...

  8. 【Java SE】使用Javacv截取视频图片

    [Java Web开发学习]使用Javacv截取视频图片 转载:https://www.cnblogs.com/yangchongxing/p/9482935.html github地址:https: ...

  9. 201871010119-帖佼佼《面向对象程序设计(java)》第四周学习总结

      项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.com/nwnu-daizh ...

  10. Spring、SpringMVC、SpringBoot、SpringCloud的区别与联系

    前言 Spring是一个轻量级的控制反转(IoC)和面向切面(AOP)的容器框架.Spring使你能够编写更干净.更可管理.并且更易于测试的代码. Spring MVC是Spring的一个模块,一个w ...