最近在使用vue axios发送请求,结果出现跨域问题,网上查了好多,发现有好几种结局方案。
1:服务器端设置跨域
header(“Access-Control-Allow-Origin:*”);
header(“Access-Control-Allow-Headers:content-type”);
header(“Access-Control-Request-Method:GET,POST”);

2:可以自己设置一个代理服务器,使用proxyTable 我比较推荐这种方法。
首先在config/index.js 里面找到proxyTable :{} ,然后在里面加入

 "/api":{
target: 'http://47.104.218.122:8087',
changeOrigin: true,
pathRewrite: {
'^/api': '/'
}
}

注意这里面 /api是你自定义的,写成什么都可以。target 设置你调用的接口域名和端口号。这里理解成用‘^/api’代替target里面的地址,后面组件中我们调接口时直接用api代替 。比如我要调用’http://47.104.218.122:8087/dictionaryType‘,直接写‘/api/dictionaryType’即可。
然后我们可以在main.js设置一个基础路径,这样你调用接口的时候可以不写api,直接写/接口名称即可。在main.js 设置 axios.defaults.baseURL = ”/api”;
然后掉接口的时候可以直接写let  _url4 = ”/dictionaryTypes”;这样就比较省事。

    this.$axios.get(_url4)
.then(response=>{
alert(response);
alert();
})
.catch(error=>{
console.log(error);
})

vue 使用axios 出现跨域请求的两种解决方法的更多相关文章

  1. Javascript跨域请求的几种解决方法

    什么情况下才会出现跨域? 假设域名是:http://www.example.com.cn/ 如果所请求的域名跟这个域名不致,这种情况就是跨域,由于跨域存在漏洞,所以一般来说正常的跨域请求方式是请求不到 ...

  2. Ajax跨域问题的两种解决方法

    浏览器不允许Ajax跨站请求,所以存在Ajax跨域问题,目前主要有两种办法解决. 1.在请求页面上使用Access-Control-Allow-Origin标头. 使用如下标头可以接受全部网站请求: ...

  3. Springboot中关于跨域问题的一种解决方法

    前后端分离开发中,跨域问题是很常见的一种问题.本文主要是解决 springboot 项目跨域访问的一种方法,其他 javaweb 项目也可参考. 1.首先要了解什么是跨域 由于前后端分离开发中前端页面 ...

  4. [1.6W字]浏览器跨域请求的原理, 以及解决方法(可以纯前端实现) #flight.Archives011

    Title/ 浏览器跨域(CrossOrigin)请求的原理, 以及解决方案详细指南 #flight.Archives011 序: 最近看到又有一波新的创作活动了, 官方给出的话题中有一个" ...

  5. PHP允许AJAX跨域请求的两种方法

    * 一. 服务端设置 header 头允许AJAX跨域 ** 代码如下: // 允许 ityangs.net 发起的跨域请求 header("Access-Control-Allow-Ori ...

  6. ASP.NET MVC 实现AJAX跨域请求的两种方法

    通常发送AJAX请求都是在本域内完成的,也就是向本域内的某个URL发送请求,完成部分页面的刷新.但有的时候需要向其它域发送AJAX请求,完成数据的加载,例如Google. 在ASP.NET MVC 框 ...

  7. ajax跨子域请求的两种现代方法

    因为面向互联网的性质,我们公司的大部分系统都采用多子域的方式进行开发和部署,以达到松耦合和分布式的目的,因此子系统间的交互不可避免.虽然通过后台的rpc框架解决了大部分的交互问题,但有些情况下,前端直 ...

  8. nginx/ajax跨子域请求的两种现代方法以及403解决

    因为面向互联网的性质,我们公司的大部分系统都采用多子域的方式进行开发和部署,以达到松耦合和分布式的目的,因此子系统间的交互不可避免.虽然通过后台的rpc框架解决了大部分的交互问题,但有些情况下,前端直 ...

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

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

随机推荐

  1. vue transtion 实现分析

    这是我用js和css3,实现的vue transition组件相同的效果核心js var btn = document.getElementById('btn'); var box = null bt ...

  2. Js中去除数组中重复元素的6种方法

    方法一: Array.prototype.method1 = function(){ var arr=[]; //定义一个临时数组 for(var i = 0; i < this.length; ...

  3. useradd 报Creating mailbox file: File exists

    问题描述:增加一个用户时,报下面的错误:[root@master ~]# useradd hadoopuseradd: warning: the home directory already exis ...

  4. 查询表中列转换为json

    DECLARE @sql VARCHAR(MAX) SET @sql= (SELECT (select '+'',"'+column_name+'":"''+CAST(' ...

  5. Windows环境中编译opencv3.0同时加入OPENCV_contrib库及解决遇到相关问题[contrib 必须要3.1以上的opencv才支持了]

    更新:现在contrib库必须要opencv3.1以上才能支持编译通过了. 方法和步骤还是和本篇文章一样. ############################################## ...

  6. deep_learning_Function_tf.argmax()解析

    tf.argmax(input,axis)根据axis取值的不同返回每行或者每列最大值的索引. 这个很好理解,只是tf.argmax()的参数让人有些迷惑,比如,tf.argmax(array, 1) ...

  7. deep_learning_Function_os.makedirs()

    Python 3.2+ os.makedirs(path, exist_ok=True) python 3.2创建目录新增了可选参数existok,把existok设置True,创建目录如果已经存在则 ...

  8. 十二,k8s集群访问控制之RBAC授权

    目录 角色访问控制RBAC (Role-Based Access Control) 常用的授权插件: RBAC控制: role 和 clusterrole rolebinding 和 clusterr ...

  9. Jmeter (四) 关联

    关联: 实例:关联登录请求的 session,方便下次自动登录( 自我理解) 关联用户session 关联 例如 京东秒杀 1000个用户 同时秒杀 怎么模拟??  使用关联啊! 一.正则表达式提取器 ...

  10. php工程师各大公司要求

    腾讯: 1.熟悉WEB应用开发技术和工具: 2.熟悉至少一种网页应用开发语言,最好使用过PHP,熟悉Javascript语言: 3.熟悉http协议,数据库技术,熟悉Apache和相关的环境配置管理: ...