Jit-Browser Một phần của nền tảng Jit-4 EN-CA |

HeadlessChrome101: Cách Jit-Browser Biến Chrome Thành Một Trình Duyệt Đa Chức Năng Hoàn Chỉnh–Lớp Trình Duyệt-Server

Đây là một hướng dẫn bằng ngôn ngữ đơn giản về những gì Jit-Browser làm với Chrome không đầu, cách nó sử dụng runtime Jit-TR độc quyền, và những gì vẫn cần thiết để biến điều này thành một tính năng trình duyệt hàng đầu thay vì chỉ là một kịch bản khác.

Từ một công cụ chụp màn hình đơn giản đến Jit-Browser

Chúng tôi bắt đầu với một công cụ dòng lệnh nhỏ: getpage https://example.com page.png. Nó khởi động Chrome trong một container Docker, chụp một ảnh màn hình của example.com đã được hiển thị từ trang, và thoát.

Bằng chứng khái niệm hữu ích. Mỗi cuộc gọi đều là một khởi động lạnh. Nó không biết gì về dịch thuật, phiên làm việc, hay trạng thái. Nó chỉ là một camera không đầu.

Jit-Browser là bước tiếp theo. Nó vẫn sử dụng Chrome thực, nhưng bây giờ:

  • Nó ghi lại những gì xảy ra bên trong trang.
  • Nó chèn kịch bản Jit-TR như một lớp dịch thuật.
  • Nó có thể theo dõi các luồng đơn giản như banner cookie hoặc menu thả xuống.
  • Nó nắm bắt HTML đã được dịch hoàn toàn, không chỉ là một ảnh chụp màn hình.

Trang này giải thích quy trình đó để bạn có thể thấy rằng chúng tôi không chỉ nói suông. Chúng tôi đang cho thấy cách một lớp đa ngôn ngữ ở cấp trình duyệt có thể hoạt động thực sự.

Quy trình Jit-Browser trong 6 bước

Ở mức cao, mỗi lần chụp đều theo cùng một trình tự.

  1. Khởi động Chrome thực (không đầu) bên trong Docker.
    Chúng tôi sử dụng Puppeteer (pptr.dev) để khởi động cùng một engine mà các trình duyệt bình thường sử dụng, nhưng không có cửa sổ hiển thị. Không có trình phân tích tùy chỉnh, không có hiển thị giả.
  2. Áp dụng cookie hoặc trạng thái đăng nhập (nếu được cấu hình).
    Đối với các bản demo cần một phiên đăng nhập, chúng tôi phát lại cookie của bạn. Không có sức mạnh thô, không đoán mật khẩu, không thu thập tài khoản mà chúng tôi không kiểm soát.
  3. Tải trang mục tiêu chính xác như một người dùng.
    HTML, CSS, JavaScript, phông chữ, hình ảnh. Chúng tôi chờ đợi networkidle2 (https://pptr.dev/api/puppeteer.page.waitfornetworkidle) để các gói chậm và phông chữ có thể hoàn tất việc tải.
  4. Chèn đoạn mã Jit-TR như một lớp.
    Chúng tôi thêm một thẻ kịch bản trỏ đến mã runtime đang chờ cấp bằng sáng chế của chúng tôi – ví dụ: