Chrome sẽ tắt tính năng sửa đổi document.domain để nới lỏng chính sách cùng nguồn gốc

Nếu trang web của bạn dựa vào chế độ cài đặt document.domain, bạn cần phải hành động.

Eiji Kitamura

Thông tin cập nhật

  • Ngày 30 tháng 5 năm 2023: chúng tôi đã thông báo rằng việc ngừng sử dụng phương thức setter document.domain sẽ có hiệu lực trong Chrome 115.
  • Ngày 7 tháng 4 năm 2023: Chúng tôi đã phát hiện một vấn đề trước khi phát hành thay đổi này trong Chrome 112. Phương thức setter document.domain sẽ bị xoá theo mặc định hiện đang bị tạm ngưng và mốc phát hành mới chưa được xác định. Vui lòng kiểm tra lại bài đăng này trên blog hoặc đăng ký blink-dev và luồng tin này.
  • Ngày 20 tháng 1 năm 2023: Tiến trình cập nhật – phương thức setter document.domain sẽ bị xoá theo mặc định kể từ Chrome 112. Ngoài ra, chúng tôi cũng thêm nội dung đề cập đến chính sách dành cho doanh nghiệp để kiểm soát hành vi document.domain.
  • Ngày 25 tháng 7 năm 2022: Tiến trình mới – phương thức setter document.domain sẽ bị xoá theo mặc định kể từ Chrome 109.
  • Ngày 4 tháng 2 năm 2022: Cập nhật theo tiến trình mới – chúng tôi sẽ hiển thị cảnh báo trong bảng điều khiển Issues (Vấn đề) kể từ Chrome 100, xoá phương thức setter document.domain theo mặc định kể từ Chrome 106.

document.domain được thiết kế để lấy hoặc đặt tên máy chủ của máy chủ gốc.

Trên Chrome, các trang web sẽ không thể đặt document.domain. Bạn sẽ cần sử dụng các phương pháp thay thế, chẳng hạn như postMessage() hoặc API Thông báo kênh, để giao tiếp trên nhiều nguồn gốc. Chúng tôi dự định sẽ phát hành thay đổi này trong Chrome 112 sớm nhất có thể, nhưng điều này phụ thuộc vào phản hồi về Ý định phát hành.

Nếu trang web của bạn dựa vào việc nới lỏng chính sách cùng nguồn gốc qua document.domain để hoạt động chính xác, thì trang web sẽ cần gửi tiêu đề Origin-Agent-Cluster: ?0, cũng như tất cả tài liệu khác yêu cầu hành vi đó (lưu ý rằng document.domain không có hiệu lực nếu chỉ có một tài liệu thiết lập hành vi đó).

Tại sao phải đặt document.domain là không thể thay đổi?

Nhiều trang web đặt document.domain để cho phép giao tiếp giữa các trang cùng trang web nhưng có nhiều nguồn gốc.

Sau đây là cách sử dụng:

Giả sử một trang trên https://parent.example.com nhúng một trang iframe từ https://video.example.com. Các trang này có cùng eTLD+1 (example.com) với các miền con khác nhau. Khi document.domain của cả hai trang được đặt thành 'example.com', trình duyệt sẽ coi hai nguồn gốc này như thể chúng có cùng nguồn gốc.

Đặt document.domain cho https://parent.example.com:

// Confirm the current origin of "parent.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

Đặt document.domain cho https://video.example.com:

// Confirm the current origin of "video.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

Bây giờ, bạn có thể tạo thao tác DOM trên nhiều nguồn gốc trên https://parent.example.com so với https://video.example.com.

Các trang web đặt document.domain để cho phép các tài liệu trên cùng một trang web giao tiếp dễ dàng hơn. Vì thay đổi này nới lỏng chính sách cùng nguồn gốc, nên trang mẹ có thể truy cập vào tài liệu của iframe và duyệt qua cây DOM, và ngược lại.

Đây là một kỹ thuật thuận tiện nhưng có thể gây ra rủi ro về bảo mật.

Mối lo ngại về bảo mật với document.domain

Các mối lo ngại về bảo mật liên quan đến document.domain đã dẫn đến một thay đổi trong quy cách cảnh báo người dùng tránh sử dụng tính năng này. Cuộc thảo luận hiện tại với các nhà cung cấp trình duyệt khác cũng đang đi theo cùng một hướng.

Ví dụ: khi hai trang đặt document.domain, các trang đó có thể giả vờ như thể chúng có cùng một nguồn gốc. Điều này đặc biệt quan trọng khi các trang này sử dụng một dịch vụ lưu trữ dùng chung với nhiều miền con. Việc đặt document.domain sẽ mở ra quyền truy cập vào tất cả các trang web khác do cùng một dịch vụ lưu trữ, giúp kẻ tấn công dễ dàng truy cập vào các trang web của bạn hơn. Điều này có thể xảy ra vì document.domain bỏ qua phần số cổng của miền.

Để tìm hiểu thêm về các hệ quả bảo mật khi đặt document.domain, hãy đọc trang "Document.domain" trên MDN.

Chrome dự định làm cho document.domain không thể thay đổi trong Chrome 112.

Làm cách nào để biết trang web của tôi có bị ảnh hưởng hay không?

Nếu trang web của bạn bị ảnh hưởng bởi thay đổi này, thì Chrome sẽ cảnh báo trong bảng điều khiển Vấn đề của Công cụ cho nhà phát triển. Hãy lưu ý đến cờ màu vàng ở góc trên cùng bên phải.

Khi document.domain được sửa đổi, một cảnh báo sẽ hiển thị trong bảng điều khiển Các vấn đề.
Khi bạn sửa đổi document.domain, một cảnh báo sẽ xuất hiện trong bảng Issues (Vấn đề).

Nếu đã thiết lập một điểm cuối báo cáo, bạn cũng sẽ được gửi các báo cáo về việc ngừng sử dụng. Tìm hiểu thêm về cách sử dụng API Báo cáo với các dịch vụ thu thập báo cáo hiện có hoặc bằng cách xây dựng giải pháp nội bộ của riêng bạn.

Bạn có thể chạy trang web của mình thông qua quy trình kiểm tra API không dùng nữa của LightHouse để tìm tất cả API dự kiến sẽ bị xoá khỏi Chrome.

Giao tiếp trên nhiều nguồn gốc thay thế

Hiện tại, bạn có 3 lựa chọn để thay thế document.domain cho trang web của mình.

Sử dụng postMessage() hoặc API nhắn tin qua kênh

Trong hầu hết các trường hợp sử dụng, postMessage() hoặc Channel Messaging API (API Thông báo kênh) có thể thay thế document.domain trên nhiều nguồn gốc.

Trong ví dụ sau:

  1. https://parent.example.com yêu cầu https://video.example.com trong một khung iframe để thao tác với DOM bằng cách gửi thông báo qua postMessage().
  2. https://video.example.com thao tác DOM ngay khi nhận được thông báo và thông báo lại thành công cho cấp độ gốc.
  3. https://parent.example.com xác nhận thành công.

Trên https://parent.example.com:

// Send a message to https://video.example.com
iframe.postMessage('Request DOM manipulation', 'https://video.example.com');

// Receive messages
iframe.addEventListener('message', (event) => {
  // Reject all messages except ones from https://video.example.com
  if (event.origin !== 'https://video.example.com') return;

  // Filter success messages
  if (event.data === 'succeeded') {
    // DOM manipulation is succeeded
  }
});

Trên https://video.example.com:

// Receive messages
window.addEventListener('message', (event) => {
  // Reject all messages except ones from https://parent.example.com
  if (event.origin !== 'https://parent.example.com') return;

  // Do a DOM manipulation on https://video.example.com.

  // Send a success message to https://parent.example.com
  event.source.postMessage('succeeded', event.origin);
});

Hãy dùng thử và xem cách hoạt động. Nếu bạn có các yêu cầu cụ thể không hoạt động với postMessage() hoặc API nhắn tin qua kênh, hãy cho chúng tôi biết trên Twitter qua @ChromiumDev hoặc đặt câu hỏi trên Stack Overflow bằng thẻ document.domain.

Khi không còn cách nào khác, hãy gửi tiêu đề Origin-Agent-Cluster: ?0

Nếu có lý do chính đáng để tiếp tục đặt document.domain, bạn có thể gửi tiêu đề phản hồi Origin-Agent-Cluster: ?0 cùng với tài liệu mục tiêu.

Origin-Agent-Cluster: ?0

Tiêu đề Origin-Agent-Cluster hướng dẫn trình duyệt xem có nên xử lý tài liệu do cụm tác nhân theo khoá nguồn gốc xử lý hay không. Để tìm hiểu thêm về Origin-Agent-Cluster, hãy đọc bài viết Yêu cầu tách biệt hiệu suất bằng tiêu đề Origin-Agent-Cluster.

Khi bạn gửi tiêu đề này, tài liệu của bạn có thể tiếp tục đặt document.domain ngay cả khi nó trở thành không thể thay đổi theo mặc định.

Định cấu hình OriginAgentClusterDefaultEnabled cho chính sách doanh nghiệp

Quản trị viên có thể tuỳ ý định cấu hình chính sách OriginAgentClusterDefaultEnabled thành false để đặt document.domain theo mặc định trên các phiên bản Chrome trong tổ chức của bạn. Để tìm hiểu thêm, hãy đọc bài viết Quản lý và danh sách chính sách Chrome Enterprise | Tài liệu.

Khả năng tương thích với trình duyệt

Tài nguyên

Xác nhận

Ảnh chụp của Braydon Anderson trên Unsplash