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

Kayce Basques

Meggin Kearney

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, cổng này sẽ ánh xạ đến một cổng TCP trên máy phát triển. Lưu lượng truy cập giữa các cổng sẽ đi qua kết nối USB giữa thiết bị Android và máy phát triển của bạn, vì vậy, kết nối này 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 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 bằng 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 mà bạn đang gỡ lỗi:

   1. Mở chrome://inspect/#devices.
   2. Đảm bảo bạn đã đánh dấu vào Mục tiêu trên mạng Khám phá.
   3. Nhấp vào Định cấu hình bên cạnh hộp đánh dấu.

   4. Trong phần Target discovery settings (Cài đặt khám phá mục tiêu), hãy nhập localhost:PORT, đánh dấu vào Enable port forwarding (Bật chuyển tiếp cổng) rồi nhấp vào Done (Xong).

      

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

      

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ỉ của trang web mà bạn muốn gỡ lỗi.

   

4. Bên cạnh thanh địa chỉ, bạn có thể chuyển đổi phương thức nhập.

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

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

   

2. Đảm bảo bạn đánh dấu vào mục Phát hiện 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 Chế độ cài đặt chuyển tiếp cổng, localhost:8080 được thiết lập theo mặc định. Đánh dấu vào Bật tính năng 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 2 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 có thể truy cập vào trang web trên thiết bị Android. Ví dụ: nếu 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ủ 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.

Tính năng 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 tính năng chuyển tiếp cổng ở trên cùng cũng như bên cạnh tên thiết bị.

Để 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 này, thì bạn sẽ chuyển đến localhost:5000.

Ánh xạ đến các miền cục bộ tuỳ chỉnh

Tính năng ánh xạ miền tuỳ chỉnh cho phép bạn xem nội dung trên thiết bị Android từ mộ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 một thư viện JavaScript của bên thứ ba chỉ hoạt động trên miền nằm trong danh sách cho phép chrome.devtools. Vì vậy, bạn tạo một mục trong tệp hosts trên máy phát triển để liên kết miền này với localhost (tức là 127.0.0.1 chrome.devtools). Sau khi thiết lập tính năng liên kết 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 của mình tại URL chrome.devtools.

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

Để liên kết một miền tuỳ chỉnh, bạn phải chạy một 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, Squid và Fiddler.

Cách thiết lập chuyển tiếp cổng đến một proxy:

1. Chạy máy chủ proxy và lưu ý 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 cho thiết bị Android. Đối với trường địa chỉ cục bộ, hãy nhập localhost:, sau đó nhập cổng mà máy chủ proxy của bạn đang chạy. Ví dụ: nếu đ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 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 để 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 mạng mà bạn đang 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. Chế độ cài đặt proxy sẽ xuất hiện.

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ủ lưu trữ của 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ả các yêu cầu đến proxy trên máy phát triển. Proxy sẽ thay mặt thiết bị của bạn đưa ra các yêu cầu, vì vậy, các yêu cầu đối với miền cục bộ tuỳ chỉnh của bạn sẽ đượ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 giống như trên máy phát triển.

Nếu máy chủ web của bạn đang 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. 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 trên thiết bị Android, bạn nên sử dụng URL chrome.devtools:7331.