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

Tiếng Kayce Basques
Tiếng Basques Kayce
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 đến:

  • 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ữ trang web trên máy chủ web của máy phát triển, sau đó truy cập 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 qua một cổng TCP nghe trên thiết bị Android. Cổng này sẽ ánh xạ tới một 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 di chuyển 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 của bạn.

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 trên 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 thực hiện 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. Đảm bảo bạn đã chọn Hộp đánh dấu. Khám phá 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 tính năng chuyển tiếp cổng rồi 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 mục tiêu từ xa mới. Nhấp vào inspect bên cạnh thẻ bạn muốn gỡ lỗi.

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

  3. 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ỉ của trang web mà bạn 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ớ chọn 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 kiểm.

  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 tính năng 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 rồi 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à từ đó bạn muốn truy cập vào trang web trên thiết bị Android. Ví dụ: nếu muốn truy cập trang web qua 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ủ mà 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. 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.

Đã thiết lập xong tính năng chuyển tiếp cổng. Bạn có thể thấy chỉ báo trạng thái của cổng chuyển tiếp ở trên cùng cũng như 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 đã chỉ định trong trường Cổng thiết bị. Ví dụ: nếu nhập 5000 vào trường, bạn sẽ chuyển đến localhost:5000.

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

Ánh xạ miền tuỳ chỉnh cho phép bạn xem nội dung trên thiết bị Android từ máy chủ web trên máy phát triển đang sử dụng miền tuỳ 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 chrome.devtools có trong danh sách cho phép. Vì vậy, 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 với localhost (tức là 127.0.0.1 chrome.devtools). Sau khi thiết lập chuyển tiếp cổng và ánh xạ miền tuỳ chỉnh, bạn có thể xem trang web trên thiết bị Android tại URL chrome.devtools.

Thiết lập 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ề máy chủ proxy là Charles, Squidkhông áp dụng.

Để thiết lập chuyển tiếp cổng đến proxy:

  1. Chạy máy chủ proxy và ghi lại cổng mà máy chủ đ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 của bạn. Đối với trường địa chỉ cục bộ, 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 nó đang chạy trên cổng 8000, thì bạn sẽ nhập localhost:8000. Trong trường cổng thiết bị, hãy 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ị

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, hãy chuyển đến phần Cài đặt > Wi-Fi.
  2. Nhấn và giữ tên của mạng mà bạn được kết nối.

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

  4. Nhấn vào Tuỳ chọn nâng cao. Chế độ 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 Save (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 tới proxy trên máy phát triển. Proxy đưa ra yêu cầu thay mặt cho thiết bị của bạn, do đó, các yêu cầu đến miền cục bộ tuỳ chỉnh của bạn sẽ được giải quyết đú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 giống như trên máy phát triển.

Nếu máy chủ web của bạn đang chạy ở 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. Ví dụ: nếu máy chủ web của bạn đang sử dụng miền tuỳ chỉnh chrome.devtools trên cổng 7331, thì khi xem trang web từ thiết bị Android, bạn phải sử dụng URL chrome.devtools:7331.