Liên kết đậm ở nơi chưa có ai từng liên kết: Mảnh văn bản

Mảnh văn bản cho phép bạn chỉ định một đoạn mã văn bản trong phân đoạn URL. Khi chuyển đến một URL có một đoạn văn bản như vậy, trình duyệt có thể nhấn mạnh và/hoặc khiến người dùng chú ý đến URL đó.

Thomas Steiner

Giá trị nhận dạng mảnh

Chrome 80 là một bản phát hành lớn. Thư viện này có một số tính năng được nhiều người mong đợi như Các mô-đun ECMAScript trong trình chạy web, hợp nhất giá trị rỗng, tạo chuỗi không bắt buộc và nhiều tính năng khác. Như thường lệ, bản phát hành này được thông báo thông qua một bài đăng trên blog trên blog Chromium. Bạn có thể xem phần trích dẫn của bài đăng trên blog trong ảnh chụp màn hình dưới đây.

Có thể bạn đang tự hỏi tất cả các hộp màu đỏ có ý nghĩa gì. Đây là kết quả của việc chạy đoạn mã sau trong DevTools. Thao tác này sẽ làm nổi bật tất cả các phần tử có thuộc tính id.

document.querySelectorAll('[id]').forEach((el) => {
  el.style.border = 'solid 2px red';
});

Tôi có thể đặt đường liên kết sâu đến bất kỳ phần tử nào được đánh dấu bằng hộp màu đỏ nhờ mã nhận dạng mảnh mà sau đó tôi sử dụng trong bộ băm của URL trang. Giả sử tôi muốn liên kết sâu đến hộp Gửi ý kiến phản hồi cho chúng tôi trong Diễn đàn sản phẩm ở bên cạnh, tôi có thể thực hiện việc này bằng cách tạo thủ công URL https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#HTML1. Như bạn có thể thấy trong ngăn Elements (Thành phần) của Developer Tools (Công cụ cho nhà phát triển), phần tử có liên quan có thuộc tính id với giá trị HTML1.

Nếu tôi phân tích cú pháp URL này bằng hàm khởi tạo URL() của JavaScript, thì các thành phần khác nhau sẽ được hiển thị. Lưu ý thuộc tính hash có giá trị #HTML1.

new URL('https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#HTML1');
/* Creates a new `URL` object
URL {
  hash: "#HTML1"
  host: "blog.chromium.org"
  hostname: "blog.chromium.org"
  href: "https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#HTML1"
  origin: "https://blog.chromium.org"
  password: ""
  pathname: "/2019/12/chrome-80-content-indexing-es-modules.html"
  port: ""
  protocol: "https:"
  search: ""
  searchParams: URLSearchParams {}
  username: ""
}
*/

Tuy nhiên, việc tôi phải mở Công cụ cho nhà phát triển để tìm id của một phần tử cho thấy nhiều điều về khả năng tác giả bài đăng trên blog muốn liên kết đến phần cụ thể này của trang.

Nếu tôi muốn liên kết đến một nội dung không có id thì sao? Giả sử tôi muốn liên kết đến tiêu đề Các mô-đun ECMAScript trong Web Workers. Như bạn có thể thấy trong ảnh chụp màn hình bên dưới, <h1> có liên quan không có thuộc tính id, nghĩa là tôi không thể liên kết đến tiêu đề này. Đây là vấn đề mà Mảnh văn bản giải quyết.

Mảnh văn bản

Đề xuất Mảnh văn bản sẽ hỗ trợ thêm việc chỉ định một đoạn văn bản trong hàm băm URL. Khi điều hướng đến một URL có mảnh văn bản như vậy, tác nhân người dùng có thể làm nổi bật và/hoặc thu hút sự chú ý của người dùng.

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

Vì lý do bảo mật, tính năng này yêu cầu bạn phải mở đường liên kết trong ngữ cảnh noopener. Do đó, hãy nhớ đưa rel="noopener" vào mã đánh dấu neo <a> hoặc thêm noopener vào danh sách Window.open() gồm các tính năng chức năng của cửa sổ.

start

Ở dạng đơn giản nhất, cú pháp của Mảnh văn bản như sau: Ký hiệu dấu thăng #, theo sau là :~:text= và cuối cùng là start, đại diện cho văn bản được mã hoá theo tỷ lệ phần trăm mà tôi muốn liên kết.

#:~:text=start

Ví dụ: giả sử tôi muốn liên kết đến tiêu đề ECMAScript Modules in Web Workers (Mô-đun ECMAScript trong Web Worker) trong bài đăng trên blog thông báo về các tính năng trong Chrome 80, thì URL trong trường hợp này sẽ là:

https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#:~:text=ECMAScript%20Modules%20in%20Web%20Workers

Đoạn văn bản được nhấn mạnh như thế này. Nếu bạn nhấp vào đường liên kết trong một trình duyệt hỗ trợ như Chrome, mảnh văn bản sẽ được đánh dấu và cuộn vào chế độ xem:

start và end

Bây giờ, nếu tôi muốn liên kết đến toàn bộ phần có tiêu đề Các mô-đun ECMAScript trong trình chạy web, chứ không chỉ là tiêu đề của nó thì sao? Việc mã hoá theo tỷ lệ phần trăm toàn bộ văn bản của phần này sẽ làm cho URL kết quả trở nên dài nhất quán.

May mắn là có một cách tốt hơn. Thay vì toàn bộ văn bản, tôi có thể tạo khung cho văn bản mong muốn bằng cách sử dụng cú pháp start,end. Do đó, tôi chỉ định một vài từ được mã hoá phần trăm ở đầu văn bản mong muốn và một vài từ được mã hoá phần trăm ở cuối văn bản mong muốn, được phân tách bằng dấu phẩy ,.

Lệnh đó sẽ có dạng như sau:

https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#:~:text=ECMAScript%20Modules%20in%20Web%20Workers,ES%20Modules%20in%20Web%20Workers..

Đối với start, tôi có ECMAScript%20Modules%20in%20Web%20Workers, sau đó là dấu phẩy ,, theo sau là ES%20Modules%20in%20Web%20Workers. dưới dạng end. Khi bạn nhấp vào một trình duyệt hỗ trợ như Chrome, toàn bộ phần đó sẽ được làm nổi bật và cuộn vào chế độ xem:

Bây giờ, bạn có thể thắc mắc về lựa chọn start và end của tôi. Thực tế, URL ngắn hơn một chút https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#:~:text=ECMAScript%20Modules,Web%20Workers. chỉ có hai từ ở mỗi bên cũng sẽ hoạt động. So sánh start và end với các giá trị trước đó.

Nếu tôi tiến thêm một bước và hiện chỉ sử dụng một từ cho cả start và end, bạn có thể thấy rằng tôi đang gặp rắc rối. URL https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#:~:text=ECMAScript,Workers. hiện đã ngắn hơn nữa, nhưng phân đoạn văn bản được đánh dấu không còn là phân đoạn mong muốn ban đầu nữa. Việc làm nổi bật dừng lại ở lần xuất hiện đầu tiên của từ Workers., điều này là chính xác, nhưng không phải là nội dung tôi muốn làm nổi bật. Vấn đề là phần mong muốn không được xác định duy nhất bằng các giá trị start và end hiện tại gồm một từ:

prefix- và -suffix

Việc sử dụng các giá trị đủ dài cho start và end là một giải pháp để có được một đường liên kết riêng biệt. Tuy nhiên, trong một số trường hợp thì điều này là không thể. Ngoài ra, tại sao tôi chọn bài đăng trên blog về bản phát hành Chrome 80 làm ví dụ? Câu trả lời là trong bản phát hành này, các Mảnh văn bản đã được ra mắt:

Hãy lưu ý cách từ "text" xuất hiện bốn lần trong ảnh chụp màn hình ở trên. Lần xuất hiện thứ tư được viết bằng phông chữ mã màu xanh lục. Nếu muốn liên kết đến từ cụ thể này, tôi sẽ đặt start thành text. Vì từ "text" (văn bản) chỉ có một từ nên không thể có end. Chúng tôi nên làm gì? URL https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#:~:text=text khớp với lần xuất hiện đầu tiên của từ "Văn bản" đã có trong tiêu đề:

May mắn là có một giải pháp. Trong những trường hợp như vậy, tôi có thể chỉ định prefix​- và -suffix. Từ trước phông chữ mã màu xanh lục "text" (văn bản) là "the" (cái) và từ sau là "parameter" (thông số). Không có trường hợp nào khác của từ "text" (văn bản) có cùng các từ xung quanh. Với kiến thức này, tôi có thể điều chỉnh URL trước đó và thêm prefix- và -suffix. Giống như các tham số khác, các tham số này cũng cần được mã hoá theo tỷ lệ phần trăm và có thể chứa nhiều từ. https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#:~:text=the-,text,-parameter. Để cho phép trình phân tích cú pháp xác định rõ prefix- và -suffix, bạn cần phân tách chúng khỏi start và end (không bắt buộc) bằng dấu gạch ngang -.

Cú pháp đầy đủ

Dưới đây là cú pháp đầy đủ của Mảnh văn bản. (Dấu ngoặc vuông cho biết một tham số không bắt buộc.) Giá trị của tất cả các tham số cần được mã hoá theo tỷ lệ phần trăm. Điều này đặc biệt quan trọng đối với các ký tự dấu gạch ngang -, dấu và & và dấu phẩy ,, vì vậy, các ký tự này không được diễn giải là một phần của cú pháp lệnh văn bản.

#:~:text=[prefix-,]start[,end][,-suffix]

Mỗi prefix-, start, end và -suffix sẽ chỉ so khớp văn bản trong một phần tử cấp khối, nhưng phạm vi start,end đầy đủ có thể mở rộng trên nhiều khối. Ví dụ: :~:text=The quick,lazy dog sẽ không khớp trong ví dụ sau, vì chuỗi bắt đầu "The quick" không xuất hiện trong một phần tử cấp khối không bị gián đoạn:

<div>
  The
  <div></div>
  quick brown fox
</div>
<div>jumped over the lazy dog</div>

Tuy nhiên, trong ví dụ này, giá trị này khớp:

<div>The quick brown fox</div>
<div>jumped over the lazy dog</div>

Tạo URL mảnh văn bản bằng tiện ích trình duyệt

Việc tạo URL cho Đoạn văn bản theo cách thủ công sẽ rất tẻ nhạt, đặc biệt là khi cần đảm bảo các URL đó là duy nhất. Nếu bạn thực sự muốn làm như vậy, thông số kỹ thuật có một số mẹo và liệt kê chính xác các bước tạo URL mảnh văn bản. Chúng tôi cung cấp tiện ích trình duyệt nguồn mở có tên Liên kết đến mảnh văn bản cho phép bạn liên kết đến bất kỳ văn bản nào bằng cách chọn văn bản đó rồi nhấp vào "Sao chép đường liên kết đến văn bản đã chọn" trong trình đơn theo bối cảnh. Tiện ích này có sẵn cho các trình duyệt sau:

• Liên kết đến Mảnh văn bản cho Google Chrome
• Liên kết đến Mảnh văn bản cho Microsoft Edge
• Liên kết đến mảnh văn bản cho Mozilla Firefox
• Đường liên kết đến Mảnh văn bản cho Apple Safari

Nhiều đoạn văn bản trong một URL

Xin lưu ý rằng nhiều đoạn văn bản có thể xuất hiện trong một URL. Các đoạn văn bản cụ thể cần được phân tách bằng ký tự dấu và &. Sau đây là một đường liên kết mẫu có 3 mảnh văn bản: https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#:~:text=Text%20URL%20Fragments&text=text,-parameter&text=:~:text=On%20islands,%20birds%20can%20contribute%20as%20much%20as%2060%25%20of%20a%20cat's%20diet.

Kết hợp các mảnh văn bản và phần tử

Bạn có thể kết hợp các mảnh phần tử truyền thống với các mảnh văn bản. Bạn hoàn toàn có thể đặt cả hai trong cùng một URL, chẳng hạn như để cung cấp một phương án dự phòng có ý nghĩa trong trường hợp văn bản gốc trên trang thay đổi, khiến mảnh văn bản không khớp nữa. URL https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html#HTML1:~:text=Give%20us%20feedback%20in%20our%20Product%20Forums. liên kết đến phần Gửi ý kiến phản hồi cho chúng tôi trong Diễn đàn sản phẩm chứa cả một mảnh phần tử (HTML1) cũng như một mảnh văn bản (text=Give%20us%20feedback%20in%20our%20Product%20Forums.):

Lệnh mảnh

Có một phần tử cú pháp mà tôi chưa giải thích: lệnh phân mảnh :~:. Để tránh các vấn đề về khả năng tương thích với các mảnh phần tử URL hiện có như minh hoạ ở trên, Thông số kỹ thuật về mảnh văn bản sẽ giới thiệu lệnh mảnh. Lệnh mảnh là một phần của mảnh URL được phân tách bằng trình tự mã :~:. Phần này được dành riêng cho các hướng dẫn của tác nhân người dùng, chẳng hạn như text=, và bị xoá khỏi URL trong quá trình tải để các tập lệnh của tác giả không thể trực tiếp tương tác với phần này. Hướng dẫn tác nhân người dùng cũng được gọi là lệnh. Trong trường hợp cụ thể, text= được gọi là lệnh văn bản.

Phát hiện tính năng

Để có hỗ trợ, hãy kiểm tra thuộc tính fragmentDirective chỉ có thể đọc trên document. Chỉ thị mảnh là một cơ chế để các URL chỉ định hướng dẫn dành cho trình duyệt thay vì tài liệu. Mục đích của việc này là tránh tương tác trực tiếp với tập lệnh của tác giả, để có thể thêm các hướng dẫn về tác nhân người dùng trong tương lai mà không sợ gây ra các thay đổi có thể gây lỗi cho nội dung hiện có. gợi ý về bản dịch có thể là một ví dụ có thể xảy ra cho những hoạt động bổ sung như vậy trong tương lai.

if ('fragmentDirective' in document) {
  // Text Fragments is supported.
}

Tính năng phát hiện tính năng chủ yếu dành cho các trường hợp đường liên kết được tạo động (ví dụ: do công cụ tìm kiếm tạo) để tránh phân phát các đường liên kết mảnh văn bản đến những trình duyệt không hỗ trợ các đường liên kết đó.

Tạo kiểu cho các mảnh văn bản

Theo mặc định, trình duyệt sẽ định kiểu cho các đoạn văn bản giống như cách mà chúng định kiểu mark (thường là màu đen trên nền vàng, màu hệ thống CSS cho mark). Biểu định kiểu tác nhân người dùng chứa CSS có dạng như sau:

:root::target-text {
  color: MarkText;
  background: Mark;
}

Như bạn có thể thấy, trình duyệt hiển thị một bộ chọn giả ::target-text mà bạn có thể sử dụng để tuỳ chỉnh hoạt động làm nổi bật đã áp dụng. Ví dụ: bạn có thể thiết kế các mảnh văn bản là văn bản màu đen trên nền đỏ. Như thường lệ, hãy nhớ kiểm tra độ tương phản màu để kiểu ghi đè không gây ra vấn đề về khả năng hỗ trợ tiếp cận và đảm bảo rằng điểm đánh dấu thực sự nổi bật so với phần còn lại của nội dung.

:root::target-text {
  color: black;
  background-color: red;
}

Khả năng chèn nội dung

Tính năng Mảnh văn bản có thể được polyfill ở một mức độ nào đó. Chúng tôi cung cấp một polyfill (được tiện ích này sử dụng nội bộ) cho các trình duyệt không cung cấp tính năng hỗ trợ tích hợp cho các Mảnh văn bản khi chức năng này được triển khai trong JavaScript.

Tạo đường liên kết Mảnh văn bản có lập trình

Polyfill chứa một tệp fragment-generation-utils.js mà bạn có thể nhập và sử dụng để tạo đường liên kết Mảnh văn bản. Điều này được nêu trong mã mẫu bên dưới:

const { generateFragment } = await import('https://unpkg.com/text-fragments-polyfill/dist/fragment-generation-utils.js');
const result = generateFragment(window.getSelection());
if (result.status === 0) {
  let url = `${location.origin}${location.pathname}${location.search}`;
  const fragment = result.fragment;
  const prefix = fragment.prefix ?
    `${encodeURIComponent(fragment.prefix)}-,` :
    '';
  const suffix = fragment.suffix ?
    `,-${encodeURIComponent(fragment.suffix)}` :
    '';
  const start = encodeURIComponent(fragment.textStart);
  const end = fragment.textEnd ?
    `,${encodeURIComponent(fragment.textEnd)}` :
    '';
  url += `#:~:text=${prefix}${start}${end}${suffix}`;
  console.log(url);
}

Thu thập Mảnh văn bản cho mục đích phân tích

Nhiều trang web sử dụng mảnh để định tuyến, đó là lý do trình duyệt loại bỏ các Mảnh văn bản để không làm hỏng các trang đó. Chúng tôi nhận thấy cần thiết phải hiển thị các đường liên kết của Mảnh văn bản đến các trang, chẳng hạn như cho mục đích phân tích, nhưng giải pháp đề xuất chưa được triển khai. Hiện tại, để khắc phục vấn đề này, bạn có thể sử dụng mã bên dưới để trích xuất thông tin mong muốn.

new URL(performance.getEntries().find(({ type }) => type === 'navigate').name).hash;

Bảo mật

Chỉ lệnh mảnh văn bản chỉ được gọi trên các thao tác điều hướng đầy đủ (không phải cùng trang) là kết quả của một lượt kích hoạt của người dùng. Ngoài ra, các thao tác điều hướng bắt nguồn từ một nguồn gốc khác với đích đến sẽ yêu cầu thao tác điều hướng diễn ra trong ngữ cảnh noopener, chẳng hạn như trang đích được biết là đủ tách biệt. Chỉ thị mảnh văn bản chỉ được áp dụng cho khung chính. Điều này có nghĩa là văn bản sẽ không được tìm kiếm bên trong iframe và thao tác điều hướng trong iframe sẽ không gọi một mảnh văn bản.

Quyền riêng tư

Điều quan trọng là việc triển khai quy cách của Mảnh văn bản không làm rò rỉ thông tin về việc có tìm thấy mảnh văn bản trên trang hay không. Mặc dù tác giả trang ban đầu có toàn quyền kiểm soát các mảnh phần tử, nhưng bất kỳ ai cũng có thể tạo mảnh văn bản. Hãy nhớ trong ví dụ của tôi ở trên, không có cách nào để liên kết đến tiêu đề Mô-đun ECMAScript trong Trình chạy web, vì <h1> không có id, nhưng làm cách nào để mọi người, kể cả tôi, đều có thể liên kết đến bất cứ đâu bằng cách cẩn thận tạo đoạn văn bản?

Hãy tưởng tượng tôi điều hành một mạng quảng cáo độc hại evil-ads.example.com. Hãy tưởng tượng thêm rằng trong một trong các iframe quảng cáo, tôi đã tạo một iframe đa nguồn gốc ẩn cho dating.example.com bằng URL mảnh văn bản dating.example.com#:~:text=Log%20Out sau khi người dùng tương tác với quảng cáo. Nếu tìm thấy văn bản "Đăng xuất", tôi biết rằng nạn nhân hiện đang đăng nhập vào dating.example.com. Tôi có thể sử dụng thông tin này để lập hồ sơ người dùng. Vì việc triển khai Text Fragments đơn thuần có thể quyết định rằng một kết quả so khớp thành công sẽ gây ra sự chuyển đổi tiêu điểm, nên trên evil-ads.example.com, tôi có thể nghe sự kiện blur và do đó biết được thời điểm xảy ra kết quả so khớp. Trong Chrome, chúng tôi đã triển khai Mảnh văn bản theo cách không thể xảy ra trường hợp trên.

Một cuộc tấn công khác có thể là khai thác lưu lượng truy cập mạng dựa trên vị trí cuộn. Giả sử tôi có quyền truy cập vào các nhật ký lưu lượng truy cập mạng của nạn nhân, chẳng hạn như quản trị viên của mạng nội bộ của công ty. Bây giờ, hãy tưởng tượng có một tài liệu nhân sự dài Những việc cần làm nếu bạn mắc phải…, sau đó là danh sách các tình trạng như mệt mỏi, lo lắng, v.v. Tôi có thể đặt một pixel theo dõi bên cạnh mỗi mục trong danh sách. Sau đó, nếu xác định được việc tải tài liệu trùng khớp với thời điểm tải pixel theo dõi bên cạnh mục burn out (quá tải), thì với tư cách là quản trị viên mạng nội bộ, tôi có thể xác định rằng một nhân viên đã nhấp vào đường liên kết mảnh văn bản có :~:text=burn%20out mà nhân viên đó có thể cho rằng là thông tin bảo mật và không ai nhìn thấy. Khi bắt đầu, vì ví dụ này có phần hơi phức tạp và do việc khai thác nó đòi hỏi phải đáp ứng các điều kiện tiên quyết rất cụ thể, nên nhóm bảo mật của Chrome đã đánh giá rủi ro của việc triển khai tính năng cuộn khi điều hướng sao cho có thể quản lý được. Các tác nhân người dùng khác có thể quyết định hiển thị một phần tử giao diện người dùng cuộn thủ công.

Đối với những trang web muốn chọn không sử dụng, Chromium hỗ trợ giá trị tiêu đề Chính sách tài liệu mà các trang web này có thể gửi để các tác nhân người dùng không xử lý URL Mảnh văn bản.

Document-Policy: force-load-at-top

Tắt đoạn văn bản

Cách dễ nhất để tắt tính năng này là sử dụng một tiện ích có thể chèn tiêu đề phản hồi HTTP, ví dụ: ModHeader (không phải sản phẩm của Google) để chèn tiêu đề phản hồi (không phải yêu cầu) như sau:

Document-Policy: force-load-at-top

Một cách khác để chọn không tham gia là sử dụng chế độ cài đặt dành cho doanh nghiệp ScrollToTextFragmentEnabled. Để thực hiện việc này trên macOS, hãy dán lệnh bên dưới vào dòng lệnh.

defaults write com.google.Chrome ScrollToTextFragmentEnabled -bool false

Trên Windows, hãy làm theo tài liệu trên trang hỗ trợ Trợ giúp Google Chrome Enterprise.

Mảnh văn bản trong kết quả tìm kiếm trên web

Đối với một số cụm từ tìm kiếm, công cụ tìm kiếm Google sẽ cung cấp một câu trả lời nhanh hoặc thông tin tóm tắt có kèm theo trích đoạn nội dung từ một trang web có liên quan. Những đoạn trích nổi bật này có nhiều khả năng xuất hiện khi một cụm từ tìm kiếm ở dạng câu hỏi. Khi nhấp vào một đoạn trích nổi bật, người dùng sẽ được đưa thẳng đến văn bản dùng để tạo đoạn trích nổi bật đó trên trang web nguồn. Điều này hoạt động nhờ các URL Mảnh văn bản được tạo tự động.

Kết luận

URL của đoạn văn bản là một tính năng mạnh mẽ để liên kết đến văn bản tuỳ ý trên trang web. Cộng đồng học thuật có thể sử dụng công cụ này để cung cấp các liên kết trích dẫn hoặc tham khảo có độ chính xác cao. Các công cụ tìm kiếm có thể sử dụng đường liên kết sâu này để liên kết sâu với kết quả văn bản trên các trang. Các trang mạng xã hội có thể sử dụng tính năng này để cho phép người dùng chia sẻ các đoạn cụ thể trên trang web thay vì ảnh chụp màn hình không truy cập được. Tôi hy vọng bạn sẽ bắt đầu sử dụng URL Mảnh văn bản và thấy chúng hữu ích như tôi. Hãy nhớ cài đặt tiện ích trình duyệt Đường liên kết đến Mảnh văn bản.

Đường liên kết có liên quan

• Bản nháp thông số kỹ thuật
• Bài đánh giá TAG
• Mục Trạng thái của nền tảng Chrome
• Lỗi theo dõi trên Chrome
• Ý định gửi luồng
• Luồng WebKit-Dev
• Diễn đàn về quan điểm của Mozilla về tiêu chuẩn

Xác nhận

Nick Burris và David Bokan đã triển khai và chỉ định các Mảnh văn bản, với sự đóng góp của Grant Wang. Cảm ơn Joe Medley đã xem xét kỹ lưỡng bài viết này. Hình ảnh chính của Greg Rakozy trên Unsplash.