由于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. FreeRTOS 问题归纳

    分配给FreeRTOS的heap过少,可能出现任务创建不成功:也可能调用vTaskStartScheduler()后有返回(也就是执行下一条程序),实质上也是vTaskStartScheduler() ...

  2. 主机不能访问虚拟机CentOS中的站点

    主机能ping通虚拟机 虚拟机也能ping通主机 主机不能telenet通虚拟机 原因:虚拟机开启了防火墙, 解决办法:关闭虚拟机防火墙. Centos 7 firewall 命令: 查看已经开放的端 ...

  3. nodejs与mongo

    1.连接URL (使用数据用户名与密码连接或不使用连接数据库) npm install mongodb --save var mon = require('mongodb').MongoClient; ...

  4. 使用python脚本配置zabbix发送报警邮件

    #前提得在zabbix_server配置文件中配置触发脚本的目录,例如,我配置的在/usr/local/zabbix/server/scripts目录下 编写python脚本如下 因为我的服务器在腾讯 ...

  5. position的用法与心得

    position的四个属性值: relative absolute fixed static 为了便于理解,首先创建对应的div <div class="main"> ...

  6. 4.0docker部署

    设置容器的端口映射 -P  :容器暴露的所有端口映射 -p :指定映射容器暴露的端口 Nginx部暑流程 docker run -p 80 --name web -t -i ubuntu /bin/b ...

  7. Struts2+Hibernate实现图书管理系统

    效果图 部分代码 Books.java package entity; import java.util.Date; public class Books { //书籍编号 private Strin ...

  8. 【Python学习】Jupyter解决单个变量输出问题

    使用Jupyter的时候有时候发现,我明明写了好几个变量打印,但是它只显示最后一个.Out只有一个. 但是使用下面的语句.就可以实现多个输出. from IPython.core.interactiv ...

  9. 移动端测试===Android内存泄露和GC机制(转)

    本文转自:https://www.testwo.com/article/1153 1.前言 Hello,小伙伴们,相信大家在项目测试中都遇到过内存泄露问题,小编也着实爬过很多坑.比如小编所测项目,更换 ...

  10. linux===linux后台运行和关闭、查看后台任务(转)

    fg.bg.jobs.&.ctrl + z都是跟系统任务有关的,虽然现在基本上不怎么需要用到这些命令,但学会了也是很实用的 一.& 最经常被用到这个用在一个命令的最后,可以把这个命令放 ...