Dostęp do serwerów lokalnych i instancji Chrome za pomocą przekierowania portów

Kayce Basques

Meggin Kearney

Sofia Emelianova

Możesz używać przekierowania portów, aby:

• Case 1 (Zgłoszenie 1). Debuguj kartę otwartą w innym instancji Chrome.
• Zgłoszenie 2. Umieść witrynę na serwerze WWW maszyny do programowania, a następnie uzyskuj dostęp do treści z urządzenia z Androidem przez kabel USB.

W przypadku 2 przekierowanie portów działa przez nasłuchujący port TCP na urządzeniu z Androidem, który jest mapowany na port TCP na komputerze, z którego korzystasz. Ruch między portami odbywa się przez połączenie USB między urządzeniem z Androidem a komputerem do programowania, więc połączenie nie zależy od konfiguracji sieci.

Jeśli Twój serwer WWW używa własnej domeny, możesz skonfigurować urządzenie z Androidem do uzyskiwania dostępu do treści w tej domenie za pomocą mapowania domeny niestandardowej.

Skonfiguruj przekierowanie portów

Wykonaj kolejne czynności zależnie od zgłoszenia.

Przypadek 1. Skonfiguruj przekierowanie portów do innej instancji Chrome

1. Uruchom kolejną instancję Chrome z parametrem --remote-debugging-port=PORT, na przykład:

   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. W instancji Chrome, w której debugujesz dane:

   1. Otwórz pokój chrome://inspect/#devices.
   2. Upewnij się, że Discover sieci docelowe są zaznaczone.
   3. Kliknij Skonfiguruj obok pola wyboru.

   4. W sekcji Ustawienia wykrywania miejsc docelowych wpisz localhost:PORT, zaznacz Włącz przekierowanie portów i kliknij Gotowe.

      

   5. W sekcji Urządzenia pojawi się nowy cel zdalny. Kliknij inspect obok karty, którą chcesz debugować.

      

3. Otworzy się nowe okno Narzędzi deweloperskich w trybie urządzenia. Na pasku adresu u góry wpisz adres witryny, którą chcesz debugować.

   

4. Obok paska adresu można przełączać metody wprowadzania.

Przypadek 2. Skonfiguruj przekierowanie portów przez USB na urządzeniu z Androidem

1. Skonfiguruj zdalne debugowanie między maszyną programistyczną a urządzeniem z Androidem. Gdy skończysz, na liście powinno pojawić się Twoje urządzenie z Androidem.

   

2. Upewnij się, że opcja Wykryj urządzenia USB jest zaznaczona.

3. Kliknij Przekierowanie portów obok pola wyboru.

4. W ustawieniach przekierowania portów port localhost:8080 jest skonfigurowany domyślnie. Zaznacz Włącz przekierowanie portów.

   .

5. Jeśli chcesz skonfigurować inne porty, postępuj zgodnie z instrukcjami poniżej. W przeciwnym razie pomiń te kroki i kliknij Gotowe.

6. W polu tekstowym Port po lewej stronie wpisz numer portu, z którego chcesz uzyskać dostęp do strony na urządzeniu z Androidem. Jeśli np. chcesz uzyskać dostęp do witryny z adresu localhost:5000, wpisz 5000.

7. W polu tekstowym Adres IP i port po prawej stronie wpisz adres IP lub nazwę hosta na serwerze WWW komputera, na którym działa Twoja witryna, a po niej numer portu. Jeśli np. witryna działa w systemie localhost:5000, wpisz localhost:5000.

8. Kliknij Gotowe.

Przekierowanie portów zostało skonfigurowane. U góry, a także obok nazwy urządzenia, wyświetli się wskaźnik stanu gniazda.

Aby wyświetlić materiały, otwórz Chrome na urządzeniu z Androidem i przejdź do portu localhost określonego w polu Port urządzenia. Jeśli na przykład wpiszesz w polu 5000, wpisz localhost:5000.

Mapowanie na niestandardowe domeny lokalne

Mapowanie domeny niestandardowej umożliwia wyświetlanie treści na urządzeniu z Androidem z serwera WWW na komputerze używanym do programowania, który korzysta z domeny niestandardowej.

Załóżmy na przykład, że Twoja witryna używa zewnętrznej biblioteki JavaScript, która działa tylko w domenie chrome.devtools znajdującej się na liście dozwolonych. Utwórz więc wpis w pliku hosts na komputerze do programowania, aby zmapować tę domenę na localhost (czyli 127.0.0.1 chrome.devtools). Po skonfigurowaniu niestandardowego mapowania domeny i przekierowania portów możesz wyświetlić stronę na urządzeniu z Androidem pod adresem URL chrome.devtools.

Skonfiguruj przekierowanie portów na serwer proxy

Aby zmapować domenę niestandardową, musisz uruchomić serwer proxy na komputerze, na którym tworzysz aplikacje. Przykładami serwerów proxy są Charles, Squid i Fiddler.

Aby skonfigurować przekierowanie portów na serwer proxy:

1. Uruchom serwer proxy i zanotuj, którego portu używa.

   Uwaga: serwer proxy i serwer WWW muszą działać na różnych portach.

2. Skonfiguruj przekierowanie portów na urządzeniu z Androidem. W polu adres lokalny wpisz localhost:, a po nim numer portu, na którym działa serwer proxy. Jeśli na przykład jest on uruchomiony na porcie 8000, wpisz localhost:8000. W polu Port urządzenia wpisz numer, na którym urządzenie z Androidem ma nasłuchiwać, np. 3333.

Skonfiguruj ustawienia serwera proxy na urządzeniu

Następnie musisz skonfigurować urządzenie z Androidem, aby komunikowało się z serwerem proxy.

1. Na urządzeniu z Androidem otwórz Ustawienia > Wi-Fi.

2. Przytrzymaj nazwę sieci, z którą masz połączenie.

   Uwaga: ustawienia serwera proxy obowiązują w poszczególnych sieciach.

3. Kliknij Modyfikuj sieć.

4. Kliknij Opcje zaawansowane. Zostaną wyświetlone ustawienia serwera proxy.

5. Kliknij menu Proxy i wybierz Ręcznie.

6. W polu Nazwa hosta serwera proxy wpisz localhost.

7. W polu Port serwera proxy wpisz numer portu podany jako port urządzenia w poprzedniej sekcji.

8. Dotknij Zapisz.

Dzięki tym ustawieniom urządzenie przekazuje wszystkie żądania do serwera proxy w komputerze programistycznym. Serwer proxy wysyła żądania w imieniu urządzenia, więc żądania wysyłane do niestandardowej domeny lokalnej są prawidłowo przetwarzane.

Na urządzeniu z Androidem możesz teraz uzyskać dostęp do domen niestandardowych w taki sam sposób, jak na komputerze do programowania.

Jeśli Twój serwer WWW korzysta z niestandardowego portu, pamiętaj, by go określić przy wysyłaniu żądań treści z urządzenia z Androidem. Jeśli na przykład serwer WWW korzysta z domeny niestandardowej chrome.devtools na porcie 7331, to podczas wyświetlania witryny na urządzeniu z Androidem powinien on używać adresu URL chrome.devtools:7331.

Wskazówka: aby wznowić normalne przeglądanie, po odłączeniu urządzenia od komputera, z którego korzystasz, przywróć ustawienia serwera proxy na swoim urządzeniu z Androidem.