浏览器原理+跨域+解决方案

news2024/11/25 1:01:45

原网址:浏览器部分笔记_浏览器不同窗口cookie共享吗_JackieChan_的博客-CSDN博客

一、浏览器存储对象

1.cookie
cookie是一种纯文本文件,大小只有4kb,每次发送非跨域html请求时都会自动携带。特性如下:
cookie一旦创建,名称就无法更改
cookie的大小为4kb,一个域名下不能超过二十个
cookie默认是不能跨域名的,即a域名与b域名的cookie不共享。
若想要跨域共享cookie,可以在一个站点登录后往另一个网站写cookie,服务端把session存储到一个站点,cookie存储sessionid。

说明:cookie是一个对象,它有一些字段信息:

Name:名字
Value:值
Size:大小
Path: 可以访问该cookie的路径,如值为a,则只有该域名下路径为a的页面才能访问
Secure: 指定是否使用https协议发送cookie
Domain:可以访问该cookie的,域名,由于cookie并未严格遵循同源策略,即允许子域名可以访问或修改父域名的cookie。
HTTP:包含httponly属性,该属性设置cookie能否用脚本设置,默认为空,即可以通过脚本设置。如果设置的httponly属性,则cookie只能通过服务端设置。
Expires:cookie的超时时间,默认为session。

2.localstorage
localstorage是html5新特性,它的存储大小为5MB,可以存储更多信息。
它是持久存储,除非用户手动清除网站缓存,否则都不会消失。
它受同源策略限制,即协议、域名、端口任意一个不同都不会访问。
仅存储在本地,http请求不会自动携带

3.sessionstorage
sessionstorage与localstorage大致相同,区别在于sessionstorage只在一个窗口内共享,即在这个窗口(标签页)进行跳转、刷新,sessionstorage不会清除,但关闭这个标签页(窗口)sessionstorage会被清除。

二、什么是同源策略

同源指的是协议、域名、端口号一致,同源策略限制了同一个源加载的文档和脚本如何与另一个源的资源进行交互。主要是这几个方面:
当前域下的脚本不能访问其他域的cookie、localstorage、sessionstorage
当前域下的脚本不能操作其他域的dom节点
当前域下不能发送跨域的ajax请求。

三、如何解决跨域

1.CORS
首先请求分为简单请求和非简单请求,如果是简单请求,最少需要设置access-control-allow-origin,这个字段用来说明允许请求的源的地址。如果origin指定的域名不在范围内,则会返回一个不带有cors请求头的回应,该错误不能通过http状态码识别。
如果是非简单请求,则cors会在请求前发送一次预检请求,请求的方法是options,用于检查请求的域名、请求方式、头信息等,如果不符合则会报错。非简单请求还需要设置access-control-request-method和access-control-request-headers
2.JSONP
利用script标签没有跨域限制,通过src属性发送待有callback的get方法,注意,只能发送get请求。
3.postmessage

https://www.cnblogs.com/chenzhiyu/p/7840473.html

4.nginx反向代理
nginx就是通过监听一个端口,比如说是8080,通过判断请求路径,来代理到不同的端口,比如说请求路径为/,就是访问html页面所在的端口,访问路径为/api,就是访问服务端所在的端口,这样由于在浏览器都是一个端口内的操作,就不会产生跨域问题。

或者搞个后台网关系统,专门做转发请求用(比nginx重,且效率性能低)
5.nodejs中间件代理跨域
实质上与nginx相同,用到了html-proxy-middleware

6.浏览器事件机制
事件捕获与事件冒泡
事件捕获是由最外层元素到最内层元素,事件冒泡是由最内层元素到最外层元素,

 

在addEventListener方法中有三个参数,第一个是event,第二个是function,第三个是useCapture,这个第三个参数设置为true,则在事件捕获阶段执行,设置为false,则表示在事件冒泡阶段执行。
事件代理
事件委托本质上利用了事件冒泡机制,由于事件在冒泡过程中会上传到父节点,父节点可以通过事件对象获取到子节点,因此可以把子节点的监听事件放到父节点上。

7.localstorage跨域存储原网址:https://blog.csdn.net/sinat_20203869/article/details/124124501

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/571478.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

华为开源自研AI框架昇思MindSpore应用案例:Pix2Pix实现图像转换

目录 一、环境准备1.进入ModelArts官网2.使用CodeLab体验Notebook实例 在实际应用场景中,由于训练数据集不足,所以很少有人会从头开始训练整个网络。普遍的做法是,在一个非常大的基础数据集上训练得到一个预训练模型,然后使用该模…

Java程序设计入门教程--主函数

情形 在Java中,主函数就是主方法,即main()方法。它是Java应用程序的入口方法,也就是说,程序在运行的时候,第一个执行的方法就是main()方法,这个方法和其他的方法有很大的不同,比如方法的名字必…

Python100天:01.初识python

❝ 本教程计划通过100天的时间,每天分享一篇关于python的知识点,与大家一起学习python这门编程语言。 ❞ Python 对初学者来说是一门很棒的语言: 容易学 有一个积极的支持社区 在网络开发、游戏、数据科学方面提供多种机会。 Python的应用领域…

PMP课堂模拟题目及解析(第13期)

121. 项目经理、团队成员以及若干干系人共同参与一次风险研讨会。已经根据风险管理计划生成并提供一份风险报告。若要为各个项目风险进行优先级排序,现在必须执行哪一项分析? A. 定量风险分析 B. 根本原因分析 C. 偏差分析 D. 定性风险分析 122. …

Yarn资源调度详解

第1章 Yarn资源调度器 思考: 1)如何管理集群资源? 2)如何给任务合理分配资源? Yarn是一个资源调度平台,负责为运算程序提供服务器运算资源,相当于一个分布式的操作系统平台,而MapRe…

什么是产品操作手册?企业该怎样制作产品操作手册页面?

产品操作手册是一种用于指导用户如何正确使用和维护产品的文档。它通常包括产品的基本信息、操作步骤、安全警告、故障排除、维护方法等内容。产品操作手册对于企业来说非常重要,它不仅可以提高用户的使用体验,还可以为企业节省售后服务成本。本文将介绍…

cython编译加密python源码

场景 python的解释特性是将py编译为独有的二进制编码pyc 文件,然后对pyc中的指令进行解释执行,但是 pyc的反编译却非常简单,可直接反编译为源码,当需要将产品发布到外部环境的时候,源码的保护尤为重要。 一、Cpython介…

Java程序设计入门教程--标识符和关键字

目录 标识符 标识符的约定 标识符 1. 定义 用来标识类名,变量名,方法名,类型名,数组名,文件名的有效序列称为标识符。简单地说,标识符就是一个名字。 2. 标识符命名规则 (1)大小…

Tuxera for Mac2023中文版读写硬盘U盘工具

在日常生活中,我们使用Mac时经常会遇到外部设备不能正常使用的情况,如:U盘、硬盘、软盘等等一系列存储设备,而这些设备的格式大多为NTFS,Mac系统对NTFS格式分区存在一定的兼容性问题,不能正常读写。 那么什…

算法|1.二分及其扩展

算法|1.二分及其扩展 1、有序数组中找到num 题意:给定有序数组,在有序数组中找到指定数字,找到返回true,找不到返回false. 解题思路: 数组有序查找指定元素使用二分法L指针初始值设为0,R指针初始值设为…

chatgpt赋能python:Python修改配置文件内容

Python 修改配置文件内容 介绍 配置文件是软件开发中经常使用的一种文件,用于存储程序的配置参数。在实际开发中,我们经常需要修改配置文件内容来满足我们的需求。Python 提供了很多方法来操作配置文件,让我们能够方便地修改配置文件。 本…

camunda如何部署到容器云Kubernetes

部署Camunda到Kubernetes需要以下步骤: 1、将Camunda打包成Docker镜像。 2、在Kubernetes中创建一个Deployment对象,用于定义Camunda应用程序的副本数量、容器镜像、环境变量、卷挂载等信息。例如,可以使用以下命令创建一个Deployment&…

镜像二叉树和求二叉树最大深度(java)

镜像二叉树和求二叉树最大深度 镜像二叉树。有些题目叫翻转二叉树。是同一个题。二叉树的最大深度 镜像二叉树。有些题目叫翻转二叉树。是同一个题。 题目描述:给你一棵二叉树的根节点 root ,翻转这棵二叉树,并返回其根节点。 示例&#xff1…

从Redisson的RedissonSemaphore引发的信号量实际含义的思考

Semaphore到底该如何使用 事情的起因是最近在看redisson的源码&#xff0c;刚好看到了RedissonSemaphore的acquire/release实现。 public RFuture<Void> releaseAsync(int permits) {if (permits < 0) {throw new IllegalArgumentException("Permits amount ca…

微信小程序 基础模板引入sass的两种方法

推荐使用第二种方法 一、VSCode扩展引入&#xff08;旧&#xff09; 1.vscode搜索扩展 Easy Sass安装 2.微信开发者工具导入vscode安装的所有扩展 3.修改sass扩展配置 打开扩展目录 找到刚导入的sass扩展 打开package.json文件 改成这样 保存 4.重新打开此项目 配置完事 5.使…

torch.distributed.launch多卡多机

torch.distributed.launch命令介绍 我们在训练分布式时候&#xff0c;会使用到 torch.distributed.launch 可以通过命令&#xff0c;来打印该模块提供的可选参数 python -m torch.distributed.launch --help usage: launch.py [-h] [--nnodes NNODES] [--node_rank NODE_RANK]…

Flutter_环境配置

FlutterSDK 下载FlutterSDK管理工具<SideKick>下载安装<SideKick>下载FlutterSDK设置全局SDK 修改Flutter配置文件获取全局SDK路径 验证配置是否成功验证环境配置 下载FlutterSDK管理工具 下载安装 SideKick下载链接 下载FlutterSDK 打开 SideKick选择需要的SD…

基于Python/MATLAB长时间序列遥感数据处理及在全球变化、物候提取、植被变绿与固碳分析、生物量估算与趋势分析

目录 专题一、长时序遥感产品在全球变化/植被变绿/植被物候等方面的应用 专题二、MODIS遥感数据产品预处理 专题三、长时序MODIS遥感数据产品时间序列重构 专题四、基于GIMMS 3g和MODIS NDVI构建更长时序遥感数据 专题五、植被物候提取与分析实践应用 专题六、植被变绿趋…

卷S人的166页精品Java面试手册,17大java面试系列专题让你全方位暴击大厂Java面试官!

你有面试机会了吗&#xff1f; 近期&#xff0c;肯定有很多小伙伴&#xff0c;投出去的简历HR基本上都是已读不回&#xff0c;甚至都没有任何回复&#xff0c;或者平台默认筛选&#xff0c;你的简历HR根本就看不到。 即使有些小伙伴简历通过&#xff0c;收到面试邀请了&#…

RestCloud荣膺广东省优秀软件产品奖,引领国内数据集成领域!

近日&#xff0c;“2022年广东软件风云榜”名单公布&#xff0c;“谷云ETL数据交换软件”凭借其在助力企业数字化转型升级过程中的卓越表现&#xff0c;荣获由羊城晚报报业集团、广东软件行业协会、广东省大数据协会联合颁发的“优秀软件产品和解决方案”奖。 数字化转型是推动…