大家好，我是寒草????，一只工作一年半的草系码猿????
如果喜欢我的文章，可以关注 ➕ 点赞，与我一同成长吧~ 一起学习交流，成为更优秀的工程师～
～
背景介绍
故事是这样的，前一阵接到一个任务，一个看似很平常的任务，我和一个实习生同学开开心心的完成并等待联调。
可是事与愿违，服务端同学和对接方没有谈拢，他们就想到一个鬼点子，用 iframe 嵌入他们的页面，以实现我们的需求。可是在调研的过程中我发现了以下问题：
- 部分页面无法嵌入
- 无法通过设置 cookie 绕过该系统的登陆
可能这个问题在各位前辈面前就是常见问题，但是我也去查询了问题出现的原因。于是，就有了这篇文章。
踩坑纪实
X-Frame-Options
部分页面无法嵌入的原因
参考：developer.mozilla.org/zh-CN/docs/…
The X-Frame-Options HTTP 响应头是用来给浏览器指示允许一个页面可否在 <frame>, <iframe>, <embed> 或者 <object> 中展现的标记。站点可以通过确保网站没有被嵌入到别人的站点里面，从而避免 clickjacking 攻击。
X-Frame-Options 有三个可能的值：
X-Frame-Options: deny
X-Frame-Options: sameorigin
X-Frame-Options: allow-from https://example.com/
deny
- 表示该页面不允许在 frame 中展示，即便是在相同域名的页面中嵌套也不允许。
sameorigin
- 表示该页面可以在相同域名页面的 frame 中展示。
allow-from uri
- 表示该页面可以在指定来源的 frame 中展示。
配置方法
- Apache
- nginx
- IIS
- HAProxy
- Express
具体方法请参考上方 mdn 链接
SameSite cookies
无法通过设置 cookie 绕过该系统的登陆的原因
参考：developer.mozilla.org/zh-CN/docs/…
SameSite 是HTTP响应头 Set-Cookie 的属性之一。它允许您声明该Cookie是否仅限于第一方或者同一站点上下文。
SameSite 接受下面三个值：
Lax
- Cookies允许与顶级导航一起发送，并将与第三方网站发起的GET请求一起发送。这是浏览器中的默认值。
Strict
- Cookies只会在第一方上下文中发送，不会与第三方网站发起的请求一起发送。
None
- Cookie将在所有上下文中发送，即允许跨域发送。
以前
None 是默认值，但最近的浏览器版本将 Lax 作为默认值，以便对某些类型的跨站请求伪造 （CSRF） 攻击具有相当强的防御能力。使用
None 时，需在最新的浏览器版本中使用 Secure 属性。Chrome76版本更新：拒绝不安全的 samesite=none 的 cookie
结束语
工作中遇到问题在所难免，也请各位做好总结，这样才能进步～
✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨
弓背霞明剑照霜，秋风走马出咸阳。
未收天子河湟地，不拟回头望故乡。
✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨
一起学习交流，成为更优秀的前端工程师～
