vue-resource get/post请求如何携带cookie的问题

当我们使用vue请求的时候,我们会发现请求头中没有携带cookie传给后台,我们可以在请求时添加如下代码:
vue.http.options.xhr = { withCredentials: true}; 的作用就是允许跨域请求携带cookie做身份认证的;
vue.http.options.emulateJSON = true; 的作用是如果web服务器无法处理 application/json的请求,我们可以启用 emulateJSON 选项;
启用该选项后请求会以 application/x-www-form-urlencoded 作为MIME type, 和普通的html表单一样。 加上如下代码,get请求返回的代码会
携带cookie,但是post不会;

为了方便,我们这边是封装了一个get请求,只要在get请求添加参数 { credentials: true } 即可使用;

const ajaxGet = (url, fn) => {
let results = null;
Vue.http.get(url, { credentials: true }).then((response) => {
if (response.ok) {
results = response.body;
fn(1, results);
} else {
fn(0, results);
}
}, (error) => {
if (error) {
fn(0, results);
}
});
};

如上只会对get请求携带cookie,但是post请求还是没有效果的,因此在post请求中,我们需要添加如下代码:

Vue.http.interceptors.push((request, next) => {
request.credentials = true;
next();
});

Vue.http.interceptors 是拦截器,作用是可以在请求前和发送请求后做一些处理,加上上面的代码post请求就可以解决携带cookie的问题了;
因此我们的post请求也封装了一下,在代码中会添加如上解决post请求携带cookie的问题了;如下代码:

const ajaxPost = (url, params, options, fn) => {
let results = null; if (typeof options === 'function' && arguments.length <= 3) {
fn = options;
options = {};
}
Vue.http.interceptors.push((request, next) => {
request.credentials = true;
next();
});
Vue.http.post(url, params, options).then((response) => {
if (response.ok) {
results = response.body;
fn(1, results);
} else {
fn(0, results);
}
}, (error) => {
if (error) {
fn(0, results);
}
})
};

vue-resource get/post请求如何携带cookie的问题的更多相关文章

  1. vue项目使用axios发送请求让ajax请求头部携带cookie

    最近做vue项目时遇到登录权限问题,登录以后再发送的请求头部并没有携带登录后设置的cookie,导致后台无法校验其是否登录.检查发现是vue项目中使用axios发送ajax请求导致的.查看文档得知ax ...

  2. axios请求无法携带cookie

    背景 最近在用vue重构公司公司AngularJS 1.X项目,老项目身份认证采用的cookie,前端ajax库采用是angularJS的$http/$resource服务,新版采用的是axios,但 ...

  3. fetch发送Form Data请求并携带cookie

    今天我们来说说如何fetch发送Form Data请求并携带cookie,直接进入正题好吧,别问我今天为啥不在开始吹两句了,累到一句牛逼不想吹...... 步骤1: 设置头部,"Conten ...

  4. 请求不携带cookie问题

    因为后端需要用到cookie做一些判断,所以在post请求前先写入了cookie.在页面未登录时,调接口能带上cookie,登录后的请求没有携带cookie,但是能看到cookie已经保存了. (ax ...

  5. Cookie默认不设置path时,哪些请求会携带cookie数据

    默认不设置path的时候,只会在请求和servlet同路径的情况下才会携带cookie中存储的数据,包含同级目录和下级目录 例如: 在http://localhost:8080/day01/test/ ...

  6. vue resource 携带cookie请求 vue cookie 跨域

    vue resource 携带cookie请求 vue cookie 跨域 1.依赖VueResource 确保已安装vue-resource到项目中,找到当前项目,命令行输入: npm instal ...

  7. vue resource 携带cookie请求 vue cookie 跨域(六)

    1.依赖VueResource  确保已安装vue-resource到项目中,找到当前项目,命令行输入: npm install vue-resource --save 在主方法添加 过滤 Vue.h ...

  8. vue + spring boot + spring security 前后端分离 携带 Cookie 登录实现 只写了个登录

    最近想弄一下vue 所以就自己给自己找坑入   结果弄的满身是伤 哈哈哈 首先我说下 前后端分离  跨域请求  我在网上找了一些  可是都是针对于 spring boot 的 我自己还有 securi ...

  9. Glide请求图片能携带Cookie的哟!

    在Web编程中我们都很熟知一个概念,当有了seesion登录状态时,你可以访问一些资源但如果你没有登录的话很多资源是无法访问的. 在android的WebApi中当然一样拥有这个概念.比如,用户的头像 ...

随机推荐

  1. ubuntu16.04LTS更换阿里源

    ubuntu16.04LTS更换阿里源 sudo gedit /etc/apt/sources.list 替换:    # deb cdrom:[Ubuntu 16.04 LTS _Xenial Xe ...

  2. Python 类的祖宗--metaclass

    1.Python 中一切事物都是对象 2.类都是 type 类的对象 类的两种申明方法 # 方法一: class Foo: def func(self): print(666) obj = Foo() ...

  3. Wepy在VScode中的高亮显示

    小程序的wepy框架会生成后缀名为.wpy的文件,此文件用VScode打开时并不是高亮的,官方文档给我们提供了两种方案进行高亮 方案一:   1. 在 Code 里先安装 Vue 的语法高亮插件 Ve ...

  4. 【读书笔记】iOS-iPad与iPhone

    在开发通用型应用的时候,你总是需要记住,iPad并不是一个大大的iPod touch,为iPad开发的应用的界面应该更好地利用iPad的大屏幕,而不应该是iPhone应用的复制品. 参考资料:< ...

  5. vue-cli脚手架之package.json

    package.json文件配置及其含义,这个是vue-cli自动生成的文件,先贴一张代码及其含义: { "name": "secondproject",//模 ...

  6. JS点击按钮下载文件

    通过form表单提交: 由于ajax函数的返回类型只有xml.text.json.html等类型,没有“流”类型,所以通过ajax去请求该接口是无法下载文件的,所以我们创建一个新的form元素来请求接 ...

  7. Apex计划作业框架的实现

    Apex计划作业框架的实现 在本文中,我们实现一个简单的"计划作业框架",用于实现数据的定时自动处理. Apex相关接口 Apex中提供了一组接口用来实现数据的处理.我们主要使用以 ...

  8. ios开发GCD(2)-dispatch_semaphore_t信号量计数器

    思考:现在有多个线程异步执行,我们想要同时最多只能执行2个或n个,该怎么办? dispatch_semaphore_t 看代码解析: NSLog(@"开始"); dispatch_ ...

  9. 监听软件异常崩溃并且保持日志--CrashHandler编写自己的异常捕获类

    平时写代码,我们可能会抛出各种异常,这些异常有些是我们测试过程中发现进行解决的,但是也有一些异常是我们未知的,不论是代码的逻辑问题还是Android本身底层的一些bug,我们都需要及时了解并进行解决. ...

  10. Mac 的mysql5.7没有配置文件,如何解决only_full_group_by 问题

    数据库版本是5.7.19,在写语句的时候,只要涉及ORDER BY,就会报错, ERROR 1055 (42000): Expression #7 of SELECT list is not in G ...