Truy cập vào máy chủ cục bộ và phiên bản Chrome bằng tính năng chuyển tiếp cổng

Meggin Kearney
Meggin Kearney
Sofia Emelianova
Sofia Emelianova

Bạn có thể sử dụng tính năng chuyển tiếp cổng để:

  • Trường hợp 1. Gỡ lỗi một thẻ được mở trên một phiên bản Chrome khác.
  • Trường hợp 2. Lưu trữ một trang web trên máy chủ web của máy phát triển, sau đó truy cập vào nội dung từ thiết bị Android thông qua cáp USB.

Trong Trường hợp 2, tính năng chuyển tiếp cổng hoạt động thông qua một cổng TCP đang nghe trên thiết bị Android ánh xạ tới cổng TCP trên máy phát triển của bạn. Lưu lượng truy cập giữa các cổng này sẽ thông qua kết nối USB giữa thiết bị Android và máy phát triển, vì vậy, kết nối không phụ thuộc vào cấu hình mạng.

Ngoài ra, nếu máy chủ web của bạn đang sử dụng một miền tuỳ chỉnh, thì bạn có thể thiết lập thiết bị Android để truy cập vào nội dung tại miền đó bằng tính năng ánh xạ miền tuỳ chỉnh.

Thiết lập chuyển tiếp cổng

Tuỳ thuộc vào trường hợp của bạn, hãy làm theo các bước tiếp theo.

Trường hợp 1: Thiết lập tính năng chuyển tiếp cổng đến một phiên bản Chrome khác

  1. Chạy một phiên bản Chrome khác có tham số --remote-debugging-port=PORT, ví dụ:

    MacOS

    open -a "Google Chrome" --args --remote-debugging-port=PORT

    Windows

    start chrome --remote-debugging-port=PORT

    Linux

    google-chrome --remote-debugging-port=PORT
  2. Trong phiên bản Chrome, bạn đang gỡ lỗi bằng:

    1. Mở chrome://inspect/#devices.
    2. Hãy đảm bảo bạn đã đánh dấu chọn Hộp đánh dấu. Khám phá các mục tiêu mạng.
    3. Nhấp vào Định cấu hình bên cạnh hộp đánh dấu.
    4. Trong phần Cài đặt khám phá mục tiêu, hãy nhập localhost:PORT, chọn Hộp đánh dấu. Bật chuyển tiếp cổng và nhấp vào Xong.

      Cửa sổ chế độ cài đặt khám phá mục tiêu.

    5. Quay lại phần Thiết bị, bạn sẽ thấy một đích từ xa mới. Nhấp vào kiểm tra bên cạnh thẻ mà bạn muốn gỡ lỗi.

      Đường liên kết kiểm tra bên cạnh thẻ trên đích từ xa.

  3. Một cửa sổ Công cụ cho nhà phát triển mới ở chế độ thiết bị sẽ mở ra. Trong thanh địa chỉ ở trên cùng, bạn có thể nhập địa chỉ trang web mà mình muốn gỡ lỗi.

    Công cụ cho nhà phát triển ở chế độ thiết bị.

  4. Bên cạnh thanh địa chỉ, bạn có thể bật/tắt các phương thức nhập.

Trường hợp 2: Thiết lập tính năng chuyển tiếp cổng qua USB cho thiết bị Android

  1. Thiết lập tính năng gỡ lỗi từ xa giữa máy phát triển và thiết bị Android của bạn. Khi hoàn tất, bạn sẽ thấy thiết bị Android của mình trong danh sách.

    Thiết bị Android trong danh sách.

  2. Hãy nhớ đánh dấu mục Hộp đánh dấu. Khám phá thiết bị USB.

  3. Nhấp vào Chuyển tiếp cổng bên cạnh hộp đánh dấu.

  4. Trong phần Cài đặt chuyển tiếp cổng, localhost:8080 được thiết lập theo mặc định. Chọn Bật chuyển tiếp cổng.

    Chế độ cài đặt chuyển tiếp cổng..

  5. Nếu bạn muốn thiết lập các cổng khác, hãy làm theo các bước tiếp theo. Nếu không, hãy bỏ qua các bước này và nhấp vào Xong.

  6. Trong trường văn bản Cổng ở bên trái, hãy nhập số cổng mà bạn muốn bắt đầu có thể truy cập vào trang web này trên thiết bị Android của bạn. Ví dụ: nếu bạn muốn truy cập vào trang web từ localhost:5000, bạn sẽ nhập 5000.

  7. Trong trường văn bản Địa chỉ IP và cổng ở bên phải, hãy nhập địa chỉ IP hoặc tên máy chủ trang web của bạn đang chạy trên máy chủ web của máy phát triển, theo sau là số cổng. Cho ví dụ: nếu trang web của bạn đang chạy trên localhost:5000, bạn sẽ nhập localhost:5000.

  8. Nhấp vào Xong.

Chuyển tiếp cổng hiện đã được thiết lập. Bạn cũng có thể thấy chỉ báo trạng thái của cổng chuyển tiếp ở trên cùng bên cạnh tên thiết bị.

Trạng thái chuyển tiếp cổng.

Để xem nội dung, hãy mở Chrome trên thiết bị Android rồi chuyển đến cổng localhost mà bạn được chỉ định trong trường Cổng thiết bị. Ví dụ: nếu bạn đã nhập 5000 vào trường này, thì bạn sẽ chuyển đến localhost:5000.

Liên kết đến miền địa phương tùy chỉnh

Ánh xạ miền tuỳ chỉnh cho phép bạn xem nội dung trên một thiết bị Android từ máy chủ web trên máy phát triển đang sử dụng miền tùy chỉnh.

Ví dụ: giả sử trang web của bạn sử dụng thư viện JavaScript của bên thứ ba chỉ hoạt động trên miền có trong danh sách cho phép chrome.devtools. Do đó, bạn tạo một mục trong tệp hosts trên máy phát triển để ánh xạ miền này tới localhost (tức là 127.0.0.1 chrome.devtools). Sau thiết lập ánh xạ miền tuỳ chỉnh và chuyển tiếp cổng, bạn sẽ có thể xem trang web trên Thiết bị Android tại URL chrome.devtools.

Thiết lập chế độ chuyển tiếp cổng đến máy chủ proxy

Để ánh xạ một miền tuỳ chỉnh, bạn phải chạy máy chủ proxy trên máy phát triển của mình. Ví dụ về proxy máy chủ là Charles, SquidFiddler.

Để thiết lập chế độ chuyển tiếp cổng tới proxy, hãy làm như sau:

  1. Chạy máy chủ proxy và ghi lại cổng mà máy chủ proxy đang sử dụng.

  2. Thiết lập tính năng chuyển tiếp cổng tới thiết bị Android. Đối với trường địa chỉ địa phương, hãy nhập localhost: theo sau là cổng mà máy chủ proxy của bạn đang chạy. Ví dụ: nếu chạy trên cổng 8000, thì bạn sẽ nhập localhost:8000. Trong trường cổng thiết bị nhập số mà bạn muốn thiết bị Android của mình nghe, chẳng hạn như 3333.

Định cấu hình chế độ cài đặt proxy trên thiết bị của bạn

Tiếp theo, bạn cần định cấu hình thiết bị Android của mình để giao tiếp với máy chủ proxy.

  1. Trên thiết bị Android của bạn, chuyển đến Cài đặt > Wi-Fi.
  2. Nhấn và giữ tên của mạng mà bạn đã kết nối.

  3. Nhấn vào Sửa đổi mạng.

  4. Nhấn vào Lựa chọn nâng cao. Cài đặt proxy sẽ hiển thị.

  5. Nhấn vào trình đơn Proxy rồi chọn Thủ công.

  6. Đối với trường Tên máy chủ proxy, hãy nhập localhost.

  7. Đối với trường Cổng proxy, hãy nhập số cổng mà bạn đã nhập cho cổng thiết bị trong phần trước.

  8. Nhấn vào Lưu.

Với các chế độ cài đặt này, thiết bị của bạn sẽ chuyển tiếp tất cả yêu cầu của mình đến proxy trong quá trình phát triển máy. Proxy thực hiện các yêu cầu thay cho thiết bị của bạn, vì vậy, hãy gửi yêu cầu đến thiết bị cục bộ được tuỳ chỉnh của bạn được phân giải đúng cách.

Giờ đây, bạn có thể truy cập vào các miền tuỳ chỉnh trên thiết bị Android của mình giống như trên máy phát triển.

Nếu máy chủ web của bạn không chạy trên một cổng không chuẩn, hãy nhớ chỉ định cổng khi yêu cầu nội dung từ thiết bị Android của bạn. Ví dụ: nếu máy chủ web của bạn đang sử dụng tuỳ chỉnh miền chrome.devtools trên cổng 7331, khi xem trang web này từ thiết bị Android, bạn nên đang sử dụng URL chrome.devtools:7331.