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. NRF52833蓝牙5.1可用于105℃环境温度的Nordic蓝牙5.1 SoC能实现更广泛的并发多协议低功耗蓝牙、mesh和Thread应用

    Nordic Semiconductor宣布推出nRF52833先进多协议系统级芯片(SoC),这是其广受欢迎且验证通过的nRF52系列的第五个新成员.nRF52833是一款功耗超低的低功耗蓝牙 (B ...

  2. 第八章 使用jQuery操作DOM

    DOM操作: jQuery中提供了一系列操作DOM强有力的方法,它们不仅简化了传统JavaScript操作DOM时繁冗的代码,更加解决了令开发者苦不堪言的跨平台浏览器的兼容. 它还让有页面元素真正动起 ...

  3. 统计学习方法与Python实现(一)——感知机

    统计学习方法与Python实现(一)——感知机 iwehdio的博客园:https://www.cnblogs.com/iwehdio/ 1.定义 假设输入的实例的特征空间为x属于Rn的n维特征向量, ...

  4. Python之Flask项目开发【入门必学】

    前言 本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理.作者:藤藤菜丶 Flask 安装Flask模块 创建一个Flask项目 运行 ...

  5. 【JPA】开始

    Java SE中使用 实体Bean package cn.ycx.entity; import javax.persistence.Entity; import javax.persistence.I ...

  6. Java8 Stream —— 更丝滑的集合操作方式

    一.概念 Stream是一种可供流式操作的数据视图有些类似数据库中视图的概念它不改变源数据集合如果对其进行改变的操作它会返回一个新的数据集合. 总的来讲它有三大特性:在之后我们会对照着详细说明     ...

  7. Internet History,Technology,and Security -Technology: Application Protocols(Week7)

    Week7 Technology: Application Protocols This week, we’ll be covering application protocols. With rel ...

  8. Python:日期和时间的处理模块及相关函数

    Python:日期和时间的处理模块及相关函数 Python 提供 time 模块和 calendar 模块用于格式化日期和时间. 一.时间戳 在Python中,时间戳是以秒为单位的浮点小数,它是指格林 ...

  9. C# 几种常见数据结构

    一.内存上连续存储,节约空间,可以索引访问,读取快,增删慢 Array:在内存上连续分配的,而且元素类型是一样的,可以坐标访问;读取快--增删慢,长度不变 { //Array:在内存上连续分配的,而且 ...

  10. Winform中实现自定义屏保效果(附代码下载)

    场景 效果 注: 博客主页: https://blog.csdn.net/badao_liumang_qizhi 关注公众号 霸道的程序猿 获取编程相关电子书.教程推送与免费下载. 实现 新建form ...