VUE+php跨域session问题

  • VUE+php跨域session问题
    • cookie
    • 跨域请求中 cookie
    • php跨域session

VUE+php跨域session问题

闲来无事,公司又处于下滑期,于是就自学了vue.js,但是作为初学者,遇到很多问题,这里要感谢我的Big Brother @Dires.t帮助我许多,因此解决了问题,好了言归正传!

cookie

首先必须明确一点,存储cookie是浏览器提供的功能。cookie 其实是存储在浏览器中的纯文本,浏览器的安装目录下会专门有一个 cookie 文件夹来存放各个域下设置的cookie。

当网页要发http请求时,浏览器会先检查是否有相应的cookie,有则自动添加在request header中的cookie字段中。这些是浏览器自动帮我们做的,而且每一次http请求浏览器都会自动帮我们做。这个特点很重要,因为这关系到“什么样的数据适合存储在cookie中”。

存储在cookie中的数据,每次都会被浏览器自动放在http请求中,如果这些数据并不是每个请求都需要发给服务端的数据,浏览器这设置自动处理无疑增加了网络开销;但如果这些数据是每个请求都需要发给服务端的数据(比如身份认证信息),浏览器这设置自动处理就大大免去了重复添加操作。所以对于那设置“每次请求都要携带的信息(最典型的就是身份认证信息)”就特别适合放在cookie中,其他类型的数据就不适合了。

但在 localStorage 出现之前,cookie被滥用当做了存储工具。什么数据都放在cookie中,即使这些数据只在页面中使用而不需要随请求传送到服务端。当然cookie标准还是做了一些限制的:每个域名下的cookie 的大小最大为4KB,每个域名下的cookie数量最多为20个(但很多浏览器厂商在具体实现时支持大于20个)。

跨域请求中 cookie

默认情况下,在发生跨域时,cookie 作为一种凭据信息是不会被传送到服务端的。必须要进行额外设置才可以,这里给大家推荐一篇关于阮一峰的跨域资源共享 CORS 详解

php跨域session

session被用于表示一个持续的连接状态,在网站访问中一般指代客户端浏览器的进程从开启到结束的过程。session其实就是网站分析的访问(visits)度量,表示一个访问的过程。

session的常见实现形式是会话cookie(session cookie),即未设置过期时间的cookie,这个cookie的默认生命周期为浏览器会话期间,只要关闭浏览器窗口,cookie就消失了。实现机制是当用户发起一个请求的时候,服务器会检查该请求中是否包含sessionid,如果未包含,则系统会创造一个名为JSESSIONID的输出 cookie返回给浏览器(只放入内存,并不存在硬盘中),并将其以HashTable的形式写到服务器的内存里面;当已经包含sessionid是,服务端会检查找到与该session相匹配的信息,如果存在则直接使用该sessionid,若不存在则重新生成新的 session。这里需要注意的是session始终是有服务端创建的,并非浏览器自己生成的。 但是浏览器的cookie被禁止后session就需要用get方法的URL重写的机制或使用POST方法提交隐藏表单的形式来实现。

当发生跨域请求使用session是,浏览器不会加上cookie,从而使服务器无法读取该cookie下对应的session;那么我们的PHP页面就需要加上:

header('Access-Control-Allow-Origin:http://127.0.0.1:8080');//表示接受http://127.0.0.1:8080的请求
header('Access-Control-Allow-Credentials:true');//表示是否允许发送Cookie

另一方面,开发者必须在AJAX请求中打开withCredentials属性

//jquery写法
$.ajax({data:param,url:url,type:"get",dataType: 'json',xhrFields:{withCredentials:true},success:function(res){_this.spans = res;}})
//axios写法
axios.post('http://101.132.138.141:8888/service/pageUsers', objectToForm({'currentPage': '1','pageSize': '10','token': '7e987daa-6c84-46d2-be26-f345dfaed8a7',}), {withCredentials: true}).then(function(res) {}).catch(function(err) {});

完结。。。。。

最后附上一些参考资料:
1、你真的会使用XMLHttpRequest吗?
2、跨域资源共享 CORS 详解

VUE+php跨域session问题相关推荐

  1. vue前后分离session实现_vue2 前后端分离项目ajax跨域session问题解决

    最近学习使用vuejs前后端分离,重构一个已有的后台管理系统,遇到了下面这个问题: 实现跨域请求时,每次ajax请求都是新的session,导致无法获取登录信息,所有的请求都被判定为未登陆. 1. v ...

  2. 解决 Iframe跨域session 丢失问题

    解决 Iframe跨域session 丢失问题 参考文章: (1)解决 Iframe跨域session 丢失问题 (2)https://www.cnblogs.com/xumingxiang/arch ...

  3. 解决跨域session 同步问题

    解决跨域session 同步问题 参考文章: (1)解决跨域session 同步问题 (2)https://www.cnblogs.com/fxd980519/p/11321466.html 备忘一下 ...

  4. [Vue.js]跨域访问四种解决方法

    2019独角兽企业重金招聘Python工程师标准>>> 报错: has been blocked by CORS policy: Response to preflight requ ...

  5. 解决vue axios跨域请求发送两次问题

    解决vue axios跨域请求发送两次问题 参考文章: (1)解决vue axios跨域请求发送两次问题 (2)https://www.cnblogs.com/wordblog/p/12171875. ...

  6. 如何实现vue前端跨域,proxyTable解决开发环境前端跨域问题

    如何实现vue前端跨域,proxyTable解决开发环境前端跨域问题 参考文章: (1)如何实现vue前端跨域,proxyTable解决开发环境前端跨域问题 (2)https://www.cnblog ...

  7. Vue ajax跨域请求*

    Vue ajax跨域请求 Vue webpack-dev-server实现跨域请求 思路 配置webpack-dev-server,代理某一个路径到目标路径,同是更改源和重写 Vue里定义一个全部变量 ...

  8. vue项目跨域的问题(一个项目对接两个不同的域名、端口接口导致跨域,最好的办法是后端解决)

    vue项目跨域的问题前端解决方法(一个项目对接两个不同的域名.端口接口导致跨域,最好的办法是后端解决) 前端解决方法: ①打开config文件---->index.js文件,找到 proxyTa ...

  9. node.js后端及Vue前端跨域解决方案

    node.js后端及Vue前端跨域解决方案 从目前我了解的情况来看,前后端跨域使用的方式有很多种,这里记录我使用最顺手的一种,即在后端使用cors跨域 node.js后端跨域解决方案 先看后端的入口文 ...

最新文章

  1. 浮点运算为什么不准?有人为0.30000000000000004建了个网站
  2. [Leetcode] Simplify Path
  3. Unity 游戏框架搭建 (二十一) 使用对象池时的一些细节
  4. select使用css居右对齐
  5. python logging之multi-module
  6. meetup_使用RxNetty访问Meetup的流API
  7. 【FLink】Flink 1.12 TaskManager 内存结构
  8. 生成注释_SOLIDWORKS DimXpert 自动生成注释
  9. Hadoop-2.6.0NodeManager Restart Recover实现分析(一)
  10. 计算机缩写术语完全介绍
  11. 小米路由器青春版R1CL刷入OpenWrt
  12. Openwrt:创建编译IPK软件包
  13. SDCC 2016讲师、知名JavaScript专家周爱民议题公布:有前端思想的物联网系统架构...
  14. 2020 年高中数学联赛试题及解析
  15. 算法5:线性DP与区间DP
  16. 远程开启或唤醒休眠的计算机
  17. 当定频神器爱上多线程|ROS2定频话题发布Demo
  18. 万年历、日历——拿来即用(简单易上手,操作方便)
  19. 基于canvas的超级画板
  20. 复杂密码随机生成工具

热门文章

  1. 2021山西孕博会|山西产康展会|山西月子展会
  2. c语言如何判断字符不是空格,C语言中如何判断一个字符是空格,下一个字符不是空格...
  3. 交行上市将引招行股价下行 65亿招行转债谁买单
  4. 用pageOffice控件实现 office 文档在线编辑Word 打开文档后在页面里触发事件
  5. AndroidStudio权限记录
  6. Leetcode困难笔记 37.解数独
  7. vue定时器切换页面后停止
  8. Vue2.0 视频教程
  9. Java 快速排序法
  10. 单向循环链表改成双向循环链表