javascript 使用fetch进行跨域请求时默认是不带cookie的,所以会造成 session失效。

fetch(url, {
method: 'POST',
credentials: 'include',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: JSON.stringify({
data: options.data
})
})
credentials: 'include' 可以是fetch 带上cookie。但是问题了来。
原来在服务器端设置header (php 服务器)
    header("Access-Control-Allow-Origin: *");

会报错:

A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' header when the credentials flag is true. Origin 'http://localhost:8000' is therefore not allowed access.

可以看到不允许 使用‘*’ 号了,那么就改成 访问域名(这里是本地调用所以是 http://localhost:8000)

header("Access-Control-Allow-Origin: http://localhost:8000");

改完后再次发送请求,还是报错

Credentials flag is 'true', but the 'Access-Control-Allow-Credentials' header is ''. It must be 'true' to allow credentials. Origin 'http://localhost:8000' is therefore not allowed access.

说'Access-Control-Allow-Credentials 头必须是true,那么继续增加

header("Access-Control-Allow-Credentials: true");

增加完后可以正常访问了,而且session也有了。

ps: fetch 有个mode 是no-cors ,发现设置后返回的status是0,查资料后

no-cors mode is only to CDN content, such as scripts, CSS and image, you cannot be used for getting data,response.status = 0 is right behavior

no-cors 模式只能用来获取CDN内容,比如脚本,css文件和图片,如果用来获取数据比如json格式就会返回status=0

 

javascript fetch 跨域请求时 session失效问题的更多相关文章

  1. ajax --- 解决ajax跨域请求导致session失效的问题

    起因:http是无状态的,因此我们通常需要用到cookie以及session来保存状态,session是在服务器端存储的,会和cookie一起使用,设置了session之后,会发送给浏览器一个cook ...

  2. SpringMVC处理跨域请求时的一个注意事项

        由于公司对SpingMVC框架里面的东西进行了扩展,在配置SpringMVC时没有使用<mvc:annotation-driven>这个标签.而且是自己手动来配置HandlerMa ...

  3. 【fetch跨域请求】cors

    当使用fetch 发起跨域请求时,CORS(跨域资源共享Cross-origin resource sharing) 请求fetch const body = {name:"Good boy ...

  4. 为什么返回的数据前面有callback? ashx/json.ashx?的后面加 callback=? 起什么作用 js url?callback=xxx xxx的介绍 ajax 跨域请求时url参数添加callback=?会实现跨域问题

    为什么返回的数据前面有callback?   这是一个同学出现的问题,问到了我. 应该是这样的: 但问题是这样的: 我看了所请求的格式和后台要求的也是相同的.而且我也是这种做法,为什么他的就不行呢? ...

  5. 【原】fetch跨域请求附带cookie(credentials)

    HTTP访问控制 https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS 解决跨域的方式有很多种,本文介绍" ...

  6. ajax 跨域 headers JavaScript ajax 跨域请求 +设置headers 实践

    解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头.正确响应options请求,正确设置 JavaScript端需要设置的headers信息 方能实现. 此处手札 供后人参 ...

  7. ajax跨域请求时,sessionId不一样,导致无法记住登陆状态

    遇到这样一个场景,就是前端的域是dev,请求接口时,接口的域是beta,即使在服务端设置了cookie存放的域,'COOKIE_DOMAIN'   =>  '.roboming.com',虽然c ...

  8. 【转】ajax 跨域 headers JavaScript ajax 跨域请求 +设置headers 实践

    解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头.正确响应options请求,正确设置 JavaScript端需要设置的headers信息 方能实现. 此处手札 供后人参 ...

  9. PHP跨页面传递时session失效

    一直都是使用wamp作为本地的PHP集成开发环境 今天遇到一个很奇怪的问题,就是在跨页面传递时session竟然失效了,而之前从来没有出现过这种问题 因为使用的是开源的php框架为了测试方便就新建了两 ...

随机推荐

  1. CentOS找不到想要的镜像版本?

    CentOS找不到想要的镜像版本? 情景: 当学习Linux时,一般教程不是最新的,教程里的CentOS版本也就不是最新的,这个时候, 在看着教程练习的时候就需要安装指定的版本,避免因为版本不同造成困 ...

  2. js-禁止微信内置浏览器调整字体大小

    js方法: (function(){      if(typeof WeixinJSBridge=="object"&& typeof WeixinJSBridge ...

  3. L1-2. 点赞【求多组数据中出现次数最多的】

    L1-2. 点赞 时间限制 200 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 陈越 微博上有个“点赞”功能,你可以为你喜欢的博文点个赞表示支持.每 ...

  4. Codeforces 877E Danil and a Part-time Job(dfs序 + 线段树)

    题目链接   Danil and a Part-time Job 题意    给出一系列询问或者修改操作 $pow$ $x$表示把以$x$为根的子树的所有结点的状态取反($0$变$1$,$1$变$0$ ...

  5. FMDB使用Cached Statement功能

    FMDB使用Cached Statement功能   在FMDB中,Cached Statement功能是一种提高SQLite数据库访问的技术.在SQLite中,所有的SQL语句都会被编译,形成预处理 ...

  6. Java并发容器,底层原理深入分析

    ConcurrentHashMap ConcurrentHashMap底层具体实现 JDK 1.7底层实现 将数据分为一段一段的存储,然后给每一段数据配一把锁, 当一个线程占用锁访问其中一个段数据时, ...

  7. Java中没有C#的out关键字,但可以通过数组实现类似的效果

    其实传递的就是数组的指针,里面的每一项的值还是那块内存,所以能直接操作里面的值.如果单纯传指定的值,那么里面操作的就是新的一块内存块. 用数组实现的效果如下: class B{ String cnt= ...

  8. Delphi Helper Record Class

    unit Unit1; {$DEFINE USESGUIDHELP} interface implementation {$IFDEF USESGUIDHELP} uses System.SysUti ...

  9. GO --微服务框架(一) goa

    当项目逐渐变大之后,服务增多,开发人员增加,单纯的使用go来写服务会遇到风格不统一,开发效率上的问题. 之前研究go的微服务架构go-kit最让人头疼的就是定义服务之后,还要写很多重复的框架代码,一直 ...

  10. Keras 最新《面向小数据集构建图像分类模型》

    本文地址:http://blog.keras.io/building-powerful-image-classification-models-using-very-little-data.html ...