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, thì bạn bắt buộc phải thực hiện hành động.

Eiji Kitamura

Bản 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 đã xác định một vấn đề trước khi triển khai thay đổi này trong Chrome 112. Phương thức setter document.domain cần bị xoá theo mặc định hiện đang bị tạm ngưng và mốc vận chuyển mới chưa được xác định. Vui lòng kiểm tra lại bài đăng trên blog này hoặc đăng ký theo dõi blink-dev và chuỗi bài đăng này.
  • Ngày 20 tháng 1 năm 2023: Tiến trình cập nhật — Theo mặc định, phương thức setter document.domain sẽ bị xoá kể từ Chrome 112. Ngoài ra, một đề cập về chính sách doanh nghiệp để kiểm soát hành vi document.domain sẽ được thêm vào.
  • Ngày 25 tháng 7 năm 2022: Tiến trình cập nhật – Kể từ Chrome 109, phương thức setter document.domain sẽ bị xoá theo mặc định.
  • Ngày 4 tháng 2 năm 2022: Cập nhật 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 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 nguồn gốc.

Trên Chrome, các trang web sẽ không thể thiết lập 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 Channel Messaging API, để giao tiếp trên nhiều nguồn gốc. Chúng tôi dự định gửi Chrome 112 sớm nhất có thể, nhưng thay đổi này phụ thuộc vào phản hồi với Ý định giao hàng.

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 thông 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ả các tài liệu khác yêu cầu hành vi đó (lưu ý rằng document.domain không có tác dụng nếu chỉ có một tài liệu đặt tiêu đề đó).

Tại sao nên đặt document.domain ở chế độ không thể thay đổi?

Nhiều trang web thiết lập document.domain để cho phép giao tiếp giữa các trang cùng một trang web nhưng trên nhiều nguồn gốc.

Dưới đâ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 bạn đặt document.domain của cả hai trang thành 'example.com', trình duyệt sẽ xử lý 2 nguồn 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);

Giờ đây, bạn có thể tạo thao tác DOM trên nhiều nguồn gốc trên https://parent.example.com dựa trên https://video.example.com.

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

Đây là một kỹ thuật tiện lợi, nhưng kỹ thuật này tiềm ẩn rủi ro bảo mật.

Các 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 xung quanh document.domain đã dẫn đến sự thay đổi trong quy cách nhằm cảnh báo người dùng nên tránh sử dụng ứng dụ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 diễn ra theo hướng tương tự.

Ví dụ: khi 2 trang thiết lập document.domain, các trang đó có thể giả vờ như có cùng 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 các miền con khác nhau. Việc đặt document.domain sẽ mở ra quyền truy cập vào tất cả trang web khác do cùng dịch vụ đó lưu trữ, giúp kẻ tấn công dễ dàng truy cập 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 vấn đề bảo mật khi đặt document.domain, hãy đọc trang"document.domain" trên MDN.

Chrome dự định biến document.domain thành 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 sự thay đổi này ảnh hưởng đến trang web của bạn, 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. Chú ý lá 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ẽ xuất hiện trong bảng điều khiển Vấn đề.
Khi document.domain được sửa đổi, một cảnh báo sẽ xuất hiện trong bảng Vấn đề.

Nếu đã thiết lập điểm cuối báo cáo, bạn cũng sẽ nhận được 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 tự 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 cho LightHouse để tìm tất cả các API được lên lịch xóa khỏi Chrome.

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

Tại thời điểm này, bạn có ba lựa chọn để thay thế document.domain cho trang web của mình.

Dùng postMessage() hoặc Channel Messaging API

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

Trong ví dụ sau đây:

  1. https://parent.example.com yêu cầu https://video.example.com trong một iframe để thao tác 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 thành phần mẹ.
  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 thức hoạt động của công cụ này. Nếu bạn có yêu cầu cụ thể không hoạt động được với postMessage() hoặc Channel Messaging API, hãy cho chúng tôi biết trên Twitter qua @ChromiumDev hoặc 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 rõ rà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 bằng cụm tác nhân theo khoá nguồn gốc 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 tiêu đề 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ủa bạn có thể đị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 trên tổ chức của bạn. Để tìm hiểu thêm, hãy đọc Danh sách và quản lý 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 của Braydon Anderson trên Unsplash