Mỗi cookie chứa một cặp khoá-giá trị cùng với một số thuộc tính kiểm soát thời điểm và vị trí sử dụng cookie đó.
Việc giới thiệu thuộc tính SameSite
(được định nghĩa trong RFC6265bis) cho phép bạn khai báo liệu cookie của mình bị hạn chế cho bối cảnh bên thứ nhất hay bối cảnh cùng trang web. Sẽ rất hữu ích nếu bạn hiểu rõ ý nghĩa của từ "trang web" ở đây là rất hữu ích.
Trang web là sự kết hợp của hậu tố miền và một phần của miền ngay trước hậu tố miền đó. Ví dụ: miền www.web.dev
là một phần của trang web web.dev
.
Từ khoá: Nếu người dùng đang sử dụng www.web.dev
và yêu cầu hình ảnh từ static.web.dev
, thì đó là yêu cầu cùng trang web.
Danh sách hậu tố công khai xác định những trang được coi là nằm trên cùng một trang web. Điều này không chỉ phụ thuộc vào các miền cấp cao nhất như .com
,
mà còn có thể bao gồm các dịch vụ như github.io
. Thao tác này cho phép your-project.github.io
và my-project.github.io
được tính là các trang web riêng biệt.
Từ khoá: Nếu người dùng đang sử dụng your-project.github.io
và yêu cầu hình ảnh từ my-project.github.io
, thì đó là yêu cầu trên nhiều trang web.
Dùng thuộc tính SameSite
để khai báo việc sử dụng cookie
Thuộc tính SameSite
trên một cookie cung cấp 3 cách để kiểm soát hành vi này. Bạn có thể chọn không chỉ định thuộc tính này, hoặc sử dụng Strict
hoặc Lax
để giới hạn cookie cho các yêu cầu trên cùng trang web.
Nếu bạn đặt SameSite
thành Strict
, thì cookie của bạn chỉ có thể được gửi trong ngữ cảnh bên thứ nhất; tức là khi trang web dành cho cookie đó khớp với trang web hiển thị trong thanh địa chỉ của trình duyệt. Do đó, nếu cookie promo_shown
được đặt như sau:
Set-Cookie: promo_shown=1; SameSite=Strict
Khi người dùng truy cập vào trang web của bạn, cookie sẽ được gửi cùng với yêu cầu đúng như dự kiến.
Tuy nhiên, nếu người dùng nhấp vào một đường liên kết đến trang web của bạn từ một đường liên kết khác, thì cookie này sẽ không được gửi theo yêu cầu ban đầu đó.
Cách này phù hợp với cookie liên quan đến các tính năng luôn đòi hỏi thao tác điều hướng ban đầu (chẳng hạn như thay đổi mật khẩu hoặc mua hàng), nhưng quá hạn chế đối với các cookie như promo_shown
. Nếu độc giả theo đường liên kết đến trang web, thì họ muốn cookie được gửi để có thể áp dụng lựa chọn ưu tiên của họ.
SameSite=Lax
cho phép trình duyệt gửi cookie với các thành phần điều hướng cấp cao nhất này. Ví dụ: nếu một trang web khác tham chiếu nội dung trang web của bạn, trong trường hợp này bằng cách sử dụng ảnh mèo của bạn và cung cấp đường liên kết đến bài viết của bạn như sau:
<p>Look at this amazing cat!</p>
<img src="https://blog.example/blog/img/amazing-cat.png" />
<p>Read the <a href="https://blog.example/blog/cat.html">article</a>.</p>
Với cookie được đặt thành Lax
như sau:
Set-Cookie: promo_shown=1; SameSite=Lax
Khi trình duyệt yêu cầu amazing-cat.png
cho blog của người khác, trang web của bạn sẽ không gửi cookie đó. Tuy nhiên, khi người đọc theo đường liên kết đến cat.html
trên trang web của bạn, yêu cầu đó sẽ bao gồm cookie.
Theo cách này, bạn nên sử dụng SameSite
, đặt cookie ảnh hưởng đến việc hiển thị trang web thành Lax
và những cookie liên quan đến thao tác của người dùng đối với Strict
.
Bạn cũng có thể đặt SameSite
thành None
để cho biết rằng bạn muốn gửi cookie trong mọi ngữ cảnh. Nếu bạn cung cấp dịch vụ mà các trang web khác sử dụng, chẳng hạn như tiện ích, nội dung được nhúng, chương trình liên kết, quảng cáo hoặc đăng nhập trên nhiều trang web, hãy sử dụng None
để đảm bảo ý định của bạn là rõ ràng.
![3 cookie có nhãn Không có, Lax hoặc Nghiêm ngặt tuỳ thuộc vào ngữ cảnh](https://web.dev/static/articles/samesite-cookies-explained/image/three-cookies-labelled-no-495f9afccf1cd.png?authuser=5&hl=vi)
None
, Lax
hoặc Strict
.
Thay đổi về hành vi mặc định không có SameSite
Hỗ trợ trình duyệt
- 80
- 86
- x
Thuộc tính SameSite
được hỗ trợ rộng rãi nhưng chưa được sử dụng rộng rãi.
Trước đây, việc đặt cookie không có SameSite
theo mặc định sẽ gửi các cookie này trong mọi ngữ cảnh, điều này khiến người dùng dễ bị CSRF và rò rỉ thông tin không chủ ý. Để khuyến khích các nhà phát triển nêu rõ ý định và mang đến cho người dùng trải nghiệm an toàn hơn, đề xuất của IETF, Gia tăng cải thiện cookie đưa ra hai thay đổi chính:
- Cookie không có thuộc tính
SameSite
sẽ được xem làSameSite=Lax
. - Cookie có
SameSite=None
cũng phải chỉ địnhSecure
, nghĩa là chúng yêu cầu ngữ cảnh bảo mật.
Cả hai thay đổi này đều tương thích ngược với các trình duyệt đã triển khai chính xác phiên bản trước của thuộc tính SameSite
, cũng như các trình duyệt không hỗ trợ các phiên bản SameSite
trước đó. Các trình duyệt này nhằm giảm sự phụ thuộc vào hành vi mặc định của trình duyệt bằng cách làm rõ hành vi và mục đích sử dụng cookie. Bất kỳ ứng dụng nào không nhận ra SameSite=None
đều nên bỏ qua.
SameSite=Lax
theo mặc định
Nếu bạn gửi một cookie mà không chỉ định thuộc tính SameSite
, trình duyệt sẽ coi cookie đó như thể bạn đã đặt thành SameSite=Lax
. Bạn vẫn nên thiết lập SameSite=Lax
một cách rõ ràng để làm cho trải nghiệm người dùng nhất quán hơn trên các trình duyệt.
SameSite=None
phải bảo mật
Khi tạo cookie trên nhiều trang web bằng SameSite=None
, bạn cũng phải đặt các cookie này thành Secure
để trình duyệt chấp nhận các cookie này:
Set-Cookie: widget_session=abc123; SameSite=None; Secure
Bạn có thể kiểm thử hành vi này kể từ Chrome 76 bằng cách bật about://flags/#cookies-without-same-site-must-be-secure
và từ Firefox 69 bằng cách đặt network.cookie.sameSite.noneRequiresSecure
trong about:config
.
Bạn cũng nên cập nhật cookie hiện tại lên Secure
càng sớm càng tốt.
Nếu bạn dựa vào các dịch vụ cung cấp nội dung của bên thứ ba trên trang web của mình, hãy đảm bảo nhà cung cấp dịch vụ đó cập nhật cookie của họ, đồng thời cập nhật mọi đoạn mã hoặc phần phụ thuộc trên trang web của bạn để đảm bảo nhà cung cấp dịch vụ đó sử dụng hành vi mới.
Công thức làm bánh quy SameSite
Để biết thêm thông tin chi tiết về cách cập nhật cookie để xử lý thành công các thay đổi này đối với SameSite=None
cũng như sự khác biệt về hành vi của trình duyệt, hãy xem bài viết tiếp theo, công thức làm bánh cookie SameSite.
Trân trọng cảm ơn những đóng góp và ý kiến phản hồi của Lily Chen, Malte Ubl, Mike West, Rob Dodson, Tom Steiner và Vivek Sekhar.
Hình ảnh chính về cookie của Pille-Riin Priske trên Unsplash