背景:

后台跨域使用通配符:context.Response.Headers.Add("Access-Control-Allow-Origin", "*");

前端使用VUE axios 请求:

getData() {
this.$axios.get('http://127.0.0.1:8080/xxx/xxxxx',{
headers: {
"Content-Type":"application/json;charset=utf-8"
}
}).then( (response) => {
if( response.data.code === '0000'){
this.items = response.data.data.xxx;
console.log(this.items)
}
})
}

调试:

  报错:The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'
 

添加  credentials: 'omit',

getData() {
this.$axios.get('http://127.0.0.1:8080/xxx/xxxxx',{
headers: {
"Content-Type":"application/json;charset=utf-8"
},
credentials: 'omit',
}).then( (response) => {
if( response.data.code === '0000'){
this.items = response.data.data.xxx;
console.log(this.items)
}
})
}

释义:https://developer.mozilla.org/zh-CN/docs/Web/API/Request/credentials

credentials 是Request接口的只读属性,用于表示用户代理是否应该在跨域请求的情况下从其他域发送cookies。这与XHR的withCredentials 标志相似,不同的是有三个可选值(后者是两个):

  • omit: 从不发送cookies.
  • same-origin: 只有当URL与响应脚本同源才发送 cookies、 HTTP Basic authentication 等验证信息.(浏览器默认值,在旧版本浏览器,例如safari 11依旧是omit,safari 12已更改)
  • include: 不论是不是跨域的请求,总是发送请求资源域在本地的 cookies、 HTTP Basic authentication 等验证信息.

VUE AXIOS 跨域问题的更多相关文章

  1. vue axios跨域

    现在应用都是前后端分离,这也造成前端在调用接口时出现跨域问题,在控制台会这样提示 ,如果有类似于此图的提示,就已经表明你的接口调用出现了跨域问题,此文章是我对于vue跨域其中一种方式的一些经验,如果错 ...

  2. vue+axios跨域解决方法

    通过这种方法也可以解决跨域的问题. 使用http-proxy-middleware 代理解决(项目使用vue-cli脚手架搭建) 例如请求的url:“http://f.apiplus.cn/bj11x ...

  3. vue axios 跨域

    qs是一个npm仓库所管理的包,可通过npm install qs命令进行安装. 1. qs.parse()将URL解析成对象的形式 2. qs.stringify()将对象 序列化成URL的形式,以 ...

  4. vue axios跨域请求,apache服务器设置

    问题所在axios请求会发送两次请求 也就是说,它会先使用options去测试,你这个接口是否能够正常通讯,如果不能就不会发送真正的请求过来,如果测试通讯正常,则开始正常请求. 思路: 跨域--> ...

  5. Vue axios 跨域访问Session,两次得到的Session不是同一个Session

    这个问题是因为,后台无法确认你是同一个“人”访问服务器,两次访问都给了你一个全新的Session,所以第一次保存的信息第二次请求无法得到,我的理解是,在跨域中,携带Cookie信息访问,即可让服务器确 ...

  6. vue axios跨域请求,代理设置

    在config下的index.js中的dev下的 proxyTable{}中设置代理 proxyTable: { '/api': { target: 'http://10.0.100.7:8081', ...

  7. $Django 前后端之 跨域问题(同源策略) vue项目(axios跨域请求数据)

    1 跨域问题(多个域之间的数据访问) #同源策略(ip port 协议全部相同) #本站的只能请求本站域名的数据 #CORS实现(跨域资源共享) #实现CORS通信的关键是服务器.只要服务器实现了CO ...

  8. Vue用axios跨域访问数据

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

  9. axios,vue-echarts, async, vue 图表数据处理; axios 跨域代理; 异步同步请求接口;生命周期函数

    1.vue-echarts 安装和组件引用 插件官网 https://github.com/ecomfe/vue-echarts 安装 npm install eacharts vue-echarts ...

随机推荐

  1. 前端解析zip文件

    使用jszip.js,read.js. 传入fileinput选中的文件对象 function handleFile(f) { JSZip.loadAsync(f) .then(function(zi ...

  2. Windows8系统下设置Mongodb开机启动

    1. 官网下载安装 MongoDB https://www.mongodb.com/ 2. 环境变量设置 把 mongod.exe 所在路径加入到环境变量的PATH, 我这里安装的路径是 D:\db\ ...

  3. SQL注入科普

    技术交流,安全交友联系渔夫”小白“,微信号(xz116035) SQL注入介绍 SQL注入攻击是最为常见的Web应用安全漏洞之一,国外知名安全组织OWASP针对web应用安全漏洞进行了一个排名,SQL ...

  4. 【非原创】Game23

    #include<stdio.h>int main(){ int n,m,x=0,flag=0; scanf("%d%d",&n,&m); x=m/n; ...

  5. 原生js三级联动

    <!DOCTYPE html> <html lang="en"> <head> <title> 三级联动 </title> ...

  6. linux——高级文本处理命令之wc、cut、sort

    1.  wc :Word Count 命令的功能为统计指定文件中的字节数.字数.行数,并将统计结果显示输出 1.1 命令格式: wc [选项]文件... 1.2 命令参数: -c 统计字节数. -l  ...

  7. Python-dataframe合并(merge函数)

    import pandas as pd import numpy as np df1=pd.DataFrame({'key':['b','b','a','c','a','a','b'],'data1' ...

  8. fixed layout android

    http://benfrain.com/easy-css-fix-fixed-positioning-android-2-2-2-3/ http://caniuse.com/#feat=css-fix ...

  9. week14课上测试

    说明 本次测试老师将所有课下测试的易错题全部重新考察了一遍,虽然是第二次做,还提前复习过,还是错了很多,回到寝室发现老师还没有结束测试,43分的我又忍不住再做了一遍. 做第二遍发现了有几个题目是蓝墨云 ...

  10. DataGrid中的DataGridCheckBoxColumn用法 ..

    <my:DataGridCheckBoxColumn Header=" /> private void btnDeleteNote_Click(object sender, Ro ...