谷歌浏览器跨域丢失Cookie问题

「爱情、让人受尽委屈。」 2022-12-17 12:58 822阅读 0赞

### 文章目录 ###

*   *  谷歌浏览器跨域丢失Cookie问题
     *   *  一、问题背景交代
         *  二、分析
         *   *  2.1、整体调用链路
             *  2.2、复现
             *  2.3、分析
         *  三、原因
         *  四、解决
         *   *  4.1、治标
             *  4.2、治本

## 谷歌浏览器跨域丢失Cookie问题 ##

### 一、问题背景交代 ###

公司内部系统A页面内嵌系统B的界面。当在A系统的界面中点击B系统图标跳转时此时跨域，导致跳转后的界面空白，A系统会向B系统发送一些请求参数，而B系统没有拿到这些参数，导致重定向后的界面空白。

### 二、分析 ###

#### 2.1、整体调用链路 ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lhbmd6YWlMZUhlSGU_size_16_color_FFFFFF_t_70_pic_center]

#### 2.2、复现 ####

这个问题在Chrome浏览器【我本地的】100%复现，后来切换到了Edge浏览器【首先要清除历史浏览记录cookie】，发现可以访问，那么怀疑是浏览器的限制导致的。

#### 2.3、分析 ####

因为A系统界面内点击B系统图标访问B系统时会向B系统传递参数，而当B系统单点之后由B系统后端重定向到内嵌的B系统界面的时候参数丢失，分析应该是cookie丢失导致的参数丢失。

在各自的域进行SSO认证的时候是不会丢失cookie的，见下图：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lhbmd6YWlMZUhlSGU_size_16_color_FFFFFF_t_70_pic_center 1]

cookie的丢失发生在跨域的时候 也就是2.1 图中的虚线部分。

### 三、原因 ###

随着Chrome浏览器的升级，对于cookie的安全校验策略也在随之改变  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lhbmd6YWlMZUhlSGU_size_16_color_FFFFFF_t_70_pic_center 2]

我这边使用的是86版本，

>     Reject insecure SameSite=None cookies
>     Network / Connectivity
>     Deprecate and remove the use of cookies with the SameSite=None attribute but without the Secure attribute. Any cookie that requests SameSite=None but is not marked Secure will be rejected.
>     
>     This feature is available as of Chrome 76 by enabling the cookies-without-same-site-must-be-secure flag.
>     
>     This feature will be rolled out gradually to Stable users starting July 14, 2020. See https://www.chromium.org/updates/same-site for full timeline and more details.
>     
>     Motivation
>     Cookies delivered over plaintext channels may be cataloged or modified by network attackers. Requiring secure transport for cookies intended for cross-site usage reduces this risk, and encourages entities that produce embeddable content to migrate to HTTPS.
>     
>     
>     The use of non-Secure cookies facilitates pervasive monitoring, a widespread attack on users’ privacy. This change will mitigate the risks presented by pervasive monitoring by curtailing the use of non-Secure third-party cookies. Third-party cookies are widely used for tracking and may contain sensitive data that pertains to user identity. Cookies with SameSite=None are specifically marked for use in third-party contexts. By requiring SameSite=None cookies to be Secure, users are protected by default from attacks on their identifying data that may compromise their privacy.
>     
>     
>     In addition, non-secure embeds are a risk to users’ privacy and security. The use of non-secure embeds degrades users’ security and user experience on first-party sites by hampering first-party upgrades to secure transport because of limitations imposed on mixed content. The use of HTTPS protects users and sites, and the presence of mixed embedded content downgrades its security benefits. Requiring Secure for SameSite=None cookies will increase the security of the web by encouraging embeddable content producers to migrate to HTTPS.

*  出处： https://www.chromestatus.com/feature/5633521622188032
 *  什么是Samesite ： https://web.dev/samesite-cookies-explained/

### 四、解决 ###

#### 4.1、治标 ####

> ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lhbmd6YWlMZUhlSGU_size_16_color_FFFFFF_t_70_pic_center 3]

> 我们可以看到我们的请求的cookie 的Samesite属性是没有设置的所以按照默认的Lax
> 
> <table> 
>  <thead> 
>   <tr> 
>    <th>请求类型</th> 
>    <th>示例</th> 
>    <th>正常情况</th> 
>    <th>Lax</th> 
>   </tr> 
>  </thead> 
>  <tbody> 
>   <tr> 
>    <td>链接</td> 
>    <td><code>&lt;a href="..."&gt;&lt;/a&gt;</code></td> 
>    <td>发送 Cookie</td> 
>    <td>发送 Cookie</td> 
>   </tr> 
>   <tr> 
>    <td>预加载</td> 
>    <td><code>&lt;link rel="prerender" href="..."/&gt;</code></td> 
>    <td>发送 Cookie</td> 
>    <td>发送 Cookie</td> 
>   </tr> 
>   <tr> 
>    <td>GET 表单</td> 
>    <td><code>&lt;form method="GET" action="..."&gt;</code></td> 
>    <td>发送 Cookie</td> 
>    <td>发送 Cookie</td> 
>   </tr> 
>   <tr> 
>    <td>POST 表单</td> 
>    <td><code>&lt;form method="POST" action="..."&gt;</code></td> 
>    <td>发送 Cookie</td> 
>    <td>不发送</td> 
>   </tr> 
>   <tr> 
>    <td>iframe</td> 
>    <td><code>&lt;iframe src="..."&gt;&lt;/iframe&gt;</code></td> 
>    <td>发送 Cookie</td> 
>    <td>不发送</td> 
>   </tr> 
>   <tr> 
>    <td>AJAX</td> 
>    <td><code>$.get("...")</code></td> 
>    <td>发送 Cookie</td> 
>    <td>不发送</td> 
>   </tr> 
>   <tr> 
>    <td>Image</td> 
>    <td><code>&lt;img src="..."&gt;</code></td> 
>    <td>发送 Cookie</td> 
>    <td>不发送</td> 
>   </tr> 
>  </tbody> 
> </table>
> 
> 1、 输入 chrome://flags/ 搜索 SameSite by default cookies
> 
> 2、将SameSite by default cookies和Cookies without SameSite must be secure设置为 Disable
> 
> 3、relaunch 重新加载

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lhbmd6YWlMZUhlSGU_size_16_color_FFFFFF_t_70_pic_center 4]

*  此方法指标不治本，我们总不能让用户自己设置这个吧。

#### 4.2、治本 ####

> Set-Cookie: widget\_session=abc123; SameSite=None; Secure
> 
> 可以在Nginx反向代理部分做这个 配置也可以
> 
> 再就是不跨域 其他的等待后续补充。

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lhbmd6YWlMZUhlSGU_size_16_color_FFFFFF_t_70_pic_center]: /images/20221122/7b964a8eed144c75a23159bd27bc1449.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lhbmd6YWlMZUhlSGU_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20221122/2f0bad5266aa4800b6fe8ca6c8531aa3.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lhbmd6YWlMZUhlSGU_size_16_color_FFFFFF_t_70_pic_center 2]: /images/20221122/b3540cb7d9cc435ba4f3efda579f6c67.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lhbmd6YWlMZUhlSGU_size_16_color_FFFFFF_t_70_pic_center 3]: /images/20221122/e7769aed797842d39511626f6c3d2b4a.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lhbmd6YWlMZUhlSGU_size_16_color_FFFFFF_t_70_pic_center 4]: /images/20221122/1344bcfcc5a7409f9a55714137dec935.png