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

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

如果直接去访问

页面报错

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

  1. proxyTable: {
  2. '/api': {
  3. target: 'http://127.0.0.1:7070/',
  4. changeOrigin: true,
  5. pathRewrite: {
  6. '^/api': '/'
  7. }
  8. }

如果用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. HDU2833 最短路 floyd

    WuKong Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Subm ...

  2. Struts2入门(1)-第一个Struts2程序

    目录结构 C:\WorkSpace\java\StrutsTest\src\main C:\WorkSpace\java\StrutsTest\src\test C:\WorkSpace\java\S ...

  3. http-反向代理学习

    主要是学习了反向代理. 结合公司的方向代理使用,然后与同事进行交流,知识还是需要通过交流才能印象深刻,以后多多交流.

  4. vijos 1426 背包+hash

    背景 北京奥运会开幕了,这是中国人的骄傲和自豪,中国健儿在运动场上已经创造了一个又一个辉煌,super pig也不例外……………… 描述 虽然兴奋剂是奥运会及其他重要比赛的禁药,是禁止服用的.但是运动 ...

  5. 选择排序Selection sort

    顾名思意,就是直接从待排序数组里选择一个最小(或最大)的数字,每次都拿一个最小数字出来, 顺序放入新数组,直到全部拿完 再简单点,对着一群数组说,你们谁最小出列,站到最后边 然后继续对剩余的无序数组说 ...

  6. gitlab通过api创建组、项目、成员

    前戏 获取gitlab中admin用户的private_token Groups API 获取某个组的详细 curl --header "PRIVATE-TOKEN: *********&q ...

  7. go通过名称来调用对应的方法

    仅仅是为了学习go语言中的反射. package main import ( "errors" "fmt" "reflect" ) func ...

  8. 如何设计一个优雅健壮的Android WebView?(下)

    转:如何设计一个优雅健壮的Android WebView?(下) 前言 在上文<如何设计一个优雅健壮的Android WebView?(上)>中,笔者分析了国内WebView的现状,以及在 ...

  9. Microsoft Visual Studio TFS 切换登录用户的方法

    方法一 用VS2012开发项目,一直困扰着我的是不知道怎么去切换TFS的登录帐户,因为每次TFS都是用默认的账户连接到TFS服务器,有时想切换另一个用户登录TFS服务器, 不知道从何下手,今天总算找到 ...

  10. scikit-learn中的岭回归(Ridge Regression)与Lasso回归

    一.岭回归模型 岭回归其实就是在普通最小二乘法回归(ordinary least squares regression)的基础上,加入了正则化参数λ. 二.如何调用 class sklearn.lin ...