由于Vue-cli服务器是跑在node环境下的8080端口,我们的php代码可能在Apache环境下的7070端口,这个时候就会出现跨域

此刻这段php代码在7070端口上

如果直接去访问

页面报错

此刻我们可以不用去后台配置,直接打开vue-cli目录下的config/index.js配置

 proxyTable: {
'/api': {
target: 'http://127.0.0.1:7070/',
changeOrigin: true,
pathRewrite: {
'^/api': '/'
}
}

如果用axios进行请求,为了不用再每次请求前缀都加api可以在全局main.js文件中配置axios

然后在请求

 

 数据获取成功

关于Vue-cli的跨域解决的更多相关文章

  1. axios踩坑记录+拦截器使用+vue cli代理跨域proxy+webpack打包部署到服务器

    1.小小的提一下vue cli脚手架前端调后端数据接口时候的本地代理跨域问题,如我在本地localhost访问接口http://40.00.100.100:3002/是要跨域的,相当于浏览器设置了一道 ...

  2. [转]vue跨域解决方法

      vue跨域解决方法 vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow-Origin' hea ...

  3. JavaScript跨域解决办法

    在找到跨域解决办法之前,我们要先弄清楚一些基本概念 什么是跨域? 什么是“同源策略”? 跨文档消息通信 & 跨域请求数据 主域相同而子域不同 不同域名的跨域访问 什么是跨域? 简单地理解就是因 ...

  4. JAVA联调接口跨域解决办法

    JAVA联调接口跨域解决办法 第一种代码: HttpResponse response = new BasicHttpResponse(HttpVersion.HTTP_1_1,HttpStatus. ...

  5. Vue用axios跨域访问数据

    Vue用axios跨域访问数据axios是vue-resource的替代品,vue-resource不再维护.安装axios:npm install axios使用vue-cli开发时,由于项目本身启 ...

  6. spring mvc 图片上传,图片压缩、跨域解决、 按天生成文件夹 ,删除,限制为图片代码等相关配置

    spring mvc 图片上传,跨域解决 按天生成文件夹 ,删除,限制为图片代码,等相关配置 fs.root=data/ #fs.root=/home/dev/fs/ #fs.root=D:/fs/ ...

  7. JavaScript跨域解决方法大全

    跨域的定义:JavaScript出于安全性考虑,同源策略机制对跨域访问做了限制.域仅仅是通过“URL的首部”字符串进行识别,“URL的首部”指window.location.protocol +win ...

  8. Vue开发环境跨域访问

    Vue开发环境跨域访问其他服务器或者本机其他端口,需要配置项目中config/index.js文件,修改如下 module.exports = { dev: { // Paths assetsSubD ...

  9. ssm跨域解决

    最近挑战杯项目要交了,最后一个开发的项目,还是得好好对待,不知道会不会真香,昨天还是遇到了一些问题,尤其是对接的时候,用postman对接的时候,没有啥问题,结果前端上线对接时,发现ajax无法请求到 ...

  10. vue跨域解决方法 及设置api路径方法

    vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow-Origin' header is prese ...

随机推荐

  1. ACM1598并查集方法

    find the most comfortable road Problem Description XX星有许多城市,城市之间通过一种奇怪的高速公路SARS(Super Air Roam Struc ...

  2. 浏览器发送URL的编码特性

    转载自:http://blog.csdn.net/wangjun_1218/article/details/4330244 浏览器发送URL的编码特性 尽管有很多规范URL的标准,例如RFC 3987 ...

  3. android极光推送初步了解

    推送可以及时,主动的与用户发起交互 (1)继承jar包,照示例AndroidManifest.xml添加. (2)自定义MyApp继承自Application,在onCreate方法中调用JPushI ...

  4. JAVA获取Classpath根路径的方法

    方法一: String path = Test.class.getResource("/").toString(); System.out.println("path = ...

  5. btrace 常见问题

    执行btrace命令报错:Unable to open socket file: target process not responding or HotSpot VM not loaded ---- ...

  6. 作为一名前端开发工程师,你必须掌握的WEB模板引擎:Handlebars

    作为一名前端开发工程师,你必须掌握的WEB模板引擎:Handlebars 一.为什么需要使用模板引擎? 关于为什么要使用模板引擎,按照我常对学生说的一句话就是:不用重复造轮子..   简单来说,模板最 ...

  7. Less & Sass

    CSS不是一种编程语言.它开发网页样式,但是没法用它编程.也就是说,CSS基本上是设计师的工具,它没有变量,也没有条件语句,只是一行行单纯的描述.有人就开始为CSS加入编程元素,这被叫做"C ...

  8. 在电脑中配置adb

    在环境变量的系统变量path中添加SDK中platform_tools和tools的路径 如果出现version说明配置成功

  9. 【ZJOI2016】大森林

    这题理论上可以用ETT,但是用LCT建虚点可以解决这个问题. 对于最晚的操作1建立一个虚点,然后把操作0挂上去. #include<bits/stdc++.h> ; using names ...

  10. 流程控制--if条件

    /* if ....else .... */ [root@localhost test1]# vim .py //ADD #!/usr/bin/python >: print 'hello py ...