一、前言

针对Chrome版本67及以上

不能将其他域的Cookie传递过来

注意,这个里面的SameSite不能设为null,设空的话,还是会走默认值Lax

其中,SameSite的值可以填3个:Strict、Lax、None.
缺省的值为Lax,而且当你设置其为空时,在新的Chrome中还是会给予默认值Lax.

注意:IE和FireFox等可以直接跨域携带Cookie

1.1、前端请求

前端发送的请求必须告知携带了Cookie并进行跨域请求

xhrFields: {
withCredentials: true
},
crossDomain: true,

例如:ajax

        function getTest() {
$.ajaxSetup({
type: 'get',
url: 'https://manage.hk.com:8443/s/test',
// 跨域携带Cookie
xhrFields: {
withCredentials: true
},
crossDomain: true,
success: function (res) {
console.log(res);
$("#test").html(res);
return false;
},
error: function () {
alert('请求错误');
return false;
} });
$.ajax();
} function postTest() {
$.ajaxSetup({
type: 'post',
url: 'https://manage.hk.com:8443/s/test1',
// 跨域携带Cookie
xhrFields: {
withCredentials: true
},
crossDomain: true,
success: function (res) {
console.log(res);
$("#test").html(res);
return false;
},
error: function () {
alert('请求错误');
return false;
}
});
$.ajax();
}
    <button onclick="getTest()">Get</button>
<button onclick="postTest()">POST</button>
<p id="test"></p>

1.2. 三模式介绍

Strict(严格模式)

Lax(宽松模式 默认)

None(可以在第三方环境中发送cookie 在这种模式下,必须同时启用Secure才行)

Chrome 计划将Lax变为默认设置。这时,网站可以选择显式关闭SameSite属性,将其设为None。不过,前提是必须同时设置Secure属性(Cookie 只能通过 HTTPS 协议发送),否则无效。

二、Tomcat下配置

位置:apache-tomcat-8.5.66\conf目录下

找到context.xml文件打开

<!-- 加入 -->
<CookieProcessor sameSiteCookies="None"/>

找到web.xml文件打开

<!-- 找到如下配置 大概在627行左右 -->
<session-config>
<session-timeout>30</session-timeout>
</session-config> <!-- 修改为该配置 -->
<session-config>
<session-timeout>30</session-timeout>
<cookie-config>
<secure>true</secure>
</cookie-config>
</session-config>

注意:此时Cookie 只能通过 HTTPS 协议发送

三、Http变Https

3.1、生成SSL证书

通过JDK生成一个SSL证书

自带的keytool命令生成

在需要保存SSL证书的文件目录下打开CMD命令窗口输入一下指令

keytool -genkey -alias tomcat -keyalg RSA

Tomcat口令和密钥口令尽量保持一致,回车即可

不然在tomcat配置完server.xml之后有可能会导致启动失败

注意:密钥库口令和新口令必须一直,具体我也不清楚哈

每一个输完按回车键进入下一项即可

此时在该目录下回看到一个名为 ".keystore" 的证书文件

3.2、配置Tomcat

位置:apache-tomcat-8.5.66\conf目录下

找到server.xml文件打开

<!--  找到如下文件 大概在91行左右  -->
<!--
<Connector port="8443" protocol="org.apache.coyote.http11.Http11NioProtocol"
maxThreads="150" SSLEnabled="true">
<SSLHostConfig>
<Certificate certificateKeystoreFile="conf/localhost-rsa.jks"
type="RSA" />
</SSLHostConfig>
</Connector> --> <!-- 打开注释,缺少那个补那个,也可直接复制替换所有 -->
<!-- Define a SSL HTTP/1.1 Connector on port 8443 -->
<Connector port="8443"
protocol="org.apache.coyote.http11.Http11Protocol"
maxThreads="150"
SSLEnabled="true"
scheme="https" secure="true"
keystoreFile="C:\Users\Master\.keystore"
keystorePass="123456"
clientAuth="false" sslProtocol="TLS" />
keystoreFile :SSL证书所在磁盘路径
keystorePass :设置的口令

对于protocol有多种配置方法,如是否启用apr的方式,不同的方式有不同的配置,具体可以参考官方文档
http://tomcat.apache.org/tomcat-7.0-doc/ssl-howto.html ,这里我采用Http11Protocol,它采用的是BIO的方式处理网络连接请求。至于bio,nio,apr三种方式的区别是什么不在本文讨论之列

注意:在Tomcat里配置完成后,如果你使用的idea,记得勾选下面,否则,好像无法加载上面改动的配置信息,具体大家可以自己研究

然后启动tomcat,在启动过程输出的信息中可以看到多了一个监听在8443端口上的连接处理器,如下图所示:

在中间那一行出现了[“http-bio-8443”]这就是用来处理https安全连接的处理器的名字。8443代表的是在Connector中port指定的值,可以配置成其他的,生产环境中显然是配置成默认的443端口。”http-bio-8443”中间的“bio”是因为我们上面配置的是org.apache.coyote.http11.Http11Protocol,它采用的就是bio的方式来处理网络连接请求。(最前面的“http”感觉输出“https”比较合适一点)

此时通过https://codecrazy.cn:8443访问tomcat还是没有建立安全的连接,因为浏览器中并没有安装证书,https的原理以及如何通过CA认证等不在本文讨论之列。本文采用的是一种叫做自签名证书的方法。

3.3、导出SSL证书

通过JDK的keytool指令生成并导出证书

# 一下命令我是在SSL证书所在位置下使用的,所在没有文件路径,默认所在路径
# -keystore 'SSL证书位置' -file 'SSL证书导出位置及以.crt为后缀的文件如tomcat.crt' -storepass '口令'

keytool -export -alias tomcat -keystore .keystore -file tomcat.crt -storepass 123456

3.4、将文件导入到浏览器中

不同的浏览器会有略有差别

一下以Google浏览器做案例

在地址栏输入chrome://settings/进入设置界面

搜索栏搜索 “安全”

点击进入之后下翻找到 “管理证书” 点击

*切换到如下图红框所示“受信任的根证书颁发机构”*

点击导入,再点击下一步,选择“浏览”找到我们上面生成的tomcat.crt文件,然后一路“下一步”,最后完成。

需要的话,可以重启浏览器后使用https访问应用

3.5、配置应用使用SSL

打开应用的web.xml加入一下配置

<!-- 允许通过SSL连接 -->
<security-constraint>
<web-resource-collection>
<web-resource-name>securedapp</web-resource-name>
<url-pattern>/*</url-pattern>
</web-resource-collection>
<user-data-constraint>
<transport-guarantee>CONFIDENTIAL</transport-guarantee>
</user-data-constraint>
</security-constraint>

将 URL 映射设为 /* ,这样你的整个应用都要求是 HTTPS 访问,而 transport-guarantee 标签设置为 CONFIDENTIAL 以便使应用支持 SSL。

如果你希望关闭 SSL ,只需要将 CONFIDENTIAL 改为 NONE 即可。

重启Tomcat即可

至此大功告成

虽然 JDK 的 keytool 工具也可以免费制作自签名的证书,但这只能用在练习或者测试中,因为如果数字证书颁布商不在浏览器的信任列表中,是会给用户弹出警告框的。作为电子商务网站肯定要用商业的数字证书!

3.6、如访问出现如下提示

您的连接不是私密连接
攻击者可能会试图从 x.x.x.x 窃取您的信息(例如:密码、通讯内容或信用卡信息)。了解详情
NET::ERR_CERT_INVALID

将您访问的部分网页的网址、有限的系统信息以及部分网页内容发送给 Google,以帮助我们提升 Chrome 的安全性。隐私权政策
x.x.x.x 通常会使用加密技术来保护您的信息。Google Chrome 此次尝试连接到 x.x.x.x 时,此网站发回了异常的错误凭据。这可能是因为有攻击者在试图冒充 x.x.x.x,或 Wi-Fi 登录屏幕中断了此次连接。请放心,您的信息仍然是安全的,因为 Google Chrome 尚未进行任何数据交换便停止了连接。

您目前无法访问 x.x.x.x,因为此网站发送了 Google Chrome 无法处理的杂乱凭据。网络错误和攻击通常是暂时的,因此,此网页稍后可能会恢复正常。

或 ‘不是安全连接等’

解决方案:

1、可以不用管,因为我们知道该网站是安全的,点击隐藏详情,高级,继续前往即可

2、解决方法参考百度经验:https://jingyan.baidu.com/article/fdffd1f8f704f7b3e98ca1c6.html

3、在当前页面用键盘输入  thisisunsafe  ,不是在地址栏输入,就直接敲键盘就行了,页面即会自动刷新进入网页

产生原因:

因为Chrome不信任这些自签名ssl证书,为了安全起见,直接禁止访问了,thisisunsafe 这个命令,说明你已经了解并确认这是个不安全的网站,你仍要访问就给你访问了。

3.7、其他Https方法

可参考一下:https://blog.cat73.org/20170716/2017071601.https/

新版Google浏览器跨域Cookie解决方案的更多相关文章

  1. mac上设置新版chrome浏览器跨域

    设置方法 打开一个新的可跨域的chrome窗口实现方法: 1. 打开终端 2. 输入下面的命令( 需要替换路径中的yourname ) open -n /Applications/Google\ Ch ...

  2. Chrome浏览器跨域

    配置新版Chrome浏览器跨域,需要创建用户数据文件夹,在其中保存浏览器的缓存.历史记录.收藏夹等数据. Windows系统Chrome跨域 1 下载Chrome 64位绿色版,解压缩,并在桌面创建快 ...

  3. uni-app运行到浏览器跨域H5页面的跨域问题解决方案

    官方文档对跨域的解决方案推荐: https://ask.dcloud.net.cn/article/35267 更方便的解决方案 项目根目录直接创建一个vue.config.js文件,并在里面配置代理 ...

  4. [1.6W字] 浏览器跨域请求限制的详细原理分析&寻找一种最简单的方式实现XHR跨域(9种方法, 附大招可以纯前端实现跨域!)

    Title/ 浏览器跨域(CrossOrigin)请求的原理, 以及解决方案详细指南 #flight.Archives011 序: 最近看到又有一波新的创作活动了, 官方给出的话题中有一个" ...

  5. [1.6W字]浏览器跨域请求的原理, 以及解决方法(可以纯前端实现) #flight.Archives011

    Title/ 浏览器跨域(CrossOrigin)请求的原理, 以及解决方案详细指南 #flight.Archives011 序: 最近看到又有一波新的创作活动了, 官方给出的话题中有一个" ...

  6. C#进阶系列——WebApi 跨域问题解决方案:CORS

    前言:上篇总结了下WebApi的接口测试工具的使用,这篇接着来看看WebAPI的另一个常见问题:跨域问题.本篇主要从实例的角度分享下CORS解决跨域问题一些细节. WebApi系列文章 C#进阶系列— ...

  7. C#进阶系列——WebApi 跨域问题解决方案:CORS(转载)

    C#进阶系列——WebApi 跨域问题解决方案:CORS   阅读目录 一.跨域问题的由来 二.跨域问题解决原理 三.跨域问题解决细节 1.场景描述 2.场景测试 四.总结 正文 前言:上篇总结了下W ...

  8. 跨域学习笔记2--WebApi 跨域问题解决方案:CORS

    自己并不懂,在此先记录下来,留待以后学习... 正文 前言:上篇总结了下WebApi的接口测试工具的使用,这篇接着来看看WebAPI的另一个常见问题:跨域问题.本篇主要从实例的角度分享下CORS解决跨 ...

  9. 解决浏览器跨域限制方案之CORS

    一.什么是CORS CORS是解决浏览器跨域限制的W3C标准,详见:https://www.w3.org/TR/cors/. 根据CORS标准的定义,在浏览器中访问跨域资源时,需要做如下实现: 服务端 ...

  10. java、ajax 跨域请求解决方案('Access-Control-Allow-Origin' header is present on the requested resource. Origin '请求源' is therefore not allowed access.)

      1.情景展示 ajax调取java服务器请求报错 报错信息如下: 'Access-Control-Allow-Origin' header is present on the requested ...

随机推荐

  1. o(nlogn)求最长上升子序列

    \(O(nlog_n)\)求最长上升子序列LIS 假设存在一个序列d[1..9] = 2 1 5 3 6 4 8 9 7,可以看出来它的LIS长度为5.下面一步一步试着找出它. 我们定义一个序列B,然 ...

  2. 读《mysql是怎样运行的》有感

    最近读了一本书<mysql是怎样运行的>,读完后在大体上对mysql的运行有一定的了解.在以前,我对mysql有以下的为什么: InnoDB中的表空间.段.区和页是什么? redo log ...

  3. 如何通过C#/VB.NET 代码调整PDF文档的页边距

    PDF边距是页面主要内容区域和页面边缘之间的距离.与Word页边距不同,PDF文档的页边距很难更改.因为Adobe没有提供操作页边距的直接方法.但是,您可以通过缩放页面内容来改变页边距.本文将介绍如何 ...

  4. ts中接口

    前言:ts定义接口的任意一个属性 interface IPerson { name: string age: number family?: any[] // Error,因为不是任意类型的子集 [p ...

  5. [Pytorch框架] 1.3、张量

    文章目录 PyTorch是什么? Tensors(张量) NumPy 转换 CUDA 张量 PyTorch是什么? 基于Python的科学计算包,服务于以下两种场景: 作为NumPy的替代品,可以使用 ...

  6. 简单工厂模式(Static Factory Method)

    创建性设计模式--简单工厂模式(Static Factory method) 模式动机 只需要知道参数的名字则可得到相应的对象 软件开发时,有时需要创建一些来自于相同父类的类的实例.可以专门定义一个类 ...

  7. JavaWeb之04javaScript基础&DOM目录

    目录: 1.案例:在末尾添加节点(*****) ** 创建标签 createElement方法 ** 创建文本 createTextNode方法 ** 把文本添加到标签下面 appendChild方法 ...

  8. 2022-06-03:a -> b,代表a在食物链中被b捕食, 给定一个有向无环图,返回这个图中从最初级动物到最顶级捕食者的食物链有几条。 来自理想汽车。

    2022-06-03:a -> b,代表a在食物链中被b捕食, 给定一个有向无环图,返回这个图中从最初级动物到最顶级捕食者的食物链有几条. 来自理想汽车. 答案2022-06-03: 拓扑排序. ...

  9. 2021-04-27:如果一个字符相邻的位置没有相同字符,那么这个位置的字符出现不能被消掉。比如:“ab“,其中a和b都不能被消掉 。如果一个字符相邻的位置有相同字符,就可以一起消掉。比如:“abbb

    2021-04-27:如果一个字符相邻的位置没有相同字符,那么这个位置的字符出现不能被消掉.比如:"ab",其中a和b都不能被消掉 .如果一个字符相邻的位置有相同字符,就可以一起消 ...

  10. 2022-01-09:整数转换英文表示。将非负整数 num 转换为其对应的英文表示。 示例 1: 输入:num = 123, 输出:“One Hundred Twenty Three“。 力扣273。

    2022-01-09:整数转换英文表示.将非负整数 num 转换为其对应的英文表示. 示例 1: 输入:num = 123, 输出:"One Hundred Twenty Three&quo ...