Jak používat mobilní telefon jako lokální server pro vývoj webu

  • Proměna telefonu s Androidem v server je možná pomocí Termuxu nebo aplikací jako Tiny Web Server, aniž byste potřebovali root přístup.
  • K serveru lze přistupovat z jiných zařízení v lokální síti a dokonce i zpřístupnit internetu pomocí SSH tunelů typu Pinggy.
  • Nástroje jako adb reverse a Chrome DevTools umožňují WebView nebo mobilním aplikacím využívat lokální servery v počítači.
  • Emulátory a frameworky jako .NET MAUI vyžadují konfiguraci speciálních adres, HTTP/HTTPS a zabezpečení pro práci s lokálními službami.

Jak používat telefon Android jako lokální server

Proměnit váš mobilní telefon v malý server pro webové testování je jeden z těch geeky nápadů, který je kromě zvědavosti také nesmírně praktický. Své stránky můžete vyvíjet a testovat, aniž byste se spoléhali na externí hosting., aniž byste museli nosit notebook a využívat zařízení, které už možná ani nepoužíváte.

Kromě anekdoty, Používejte svůj mobilní telefon jako lokální vývojový server Umožňuje vám poskytovat HTML, API nebo malé front-endové projekty ve vaší síti, připojovat se z jiných zařízení a dokonce, pokud chcete jít ještě o krok dál, na chvíli vystavit svůj projekt internetu, abyste ho někomu ukázali.

Možnosti použití mobilního telefonu jako lokálního serveru

Nejflexibilnějším způsobem, jak nastavit webový server v systému Android, je spoléhat se na prostředí podobné Linuxu v samotném telefonu. Termux je pro tohle hvězdný nástroj: terminálový emulátor se správcem balíčků, který umožňuje instalaci klasických linuxových utilit bez nutnosti rootování.

Pokud se nechcete zabývat složitými příkazy, máte k dispozici i jednodušší alternativy založené na aplikacích s grafickým rozhraním. Aplikace jako Tiny Web Server vám umožňují nastavit základní server pro zobrazení statických souborů (HTML, CSS, obrázků…) jen několika klepnutími, ideální pro rychlé testy nebo pro vdechnutí druhého života starému mobilnímu telefonu.

Proměňte telefon s Androidem v server s Termuxem

Pokud byste chtěli mít trochu větší kontrolu a učit se za pochodu, Termux promění váš Android v přenosný mini LinuxDoporučuje se stáhnout si ji z F-Droid, protože verze z Google Play je často zastaralá a můžete přijít o důležitá vylepšení.

Jak nastavit FTP, WebDAV a Sambu v systému Android
Související článek:
Jak nastavit FTP, WebDAV a Sambu v systému Android

Jakmile je Termux nainstalován, otevřete jej a ocitnete se v textové konzoli. Prvním krokem je aktualizace interních systémových balíčků.Stejně jako v jakékoli jiné distribuci. Obvykle se jedná o použití dvou základních příkazů, které aktualizují index balíčků a instalují nejnovější dostupné verze.

Když jsou tyto příkazy provedeny, Je normální, že Termux před aktualizací nebo přepsáním konfigurací požádá o potvrzení.Obvyklá praxe je přijmout výchozí možnost pouhým stisknutím klávesy Enter, pokud nechcete něco velmi specifického. Během několika minut bude vaše prostředí aktualizováno a připraveno k instalaci nástrojů.

Pro jednoduché zobrazování webového obsahu, Budete potřebovat alespoň interpret Node.js a pokud chcete tunelovat server, tak i SSH klienta.V Termuxu se instalují pomocí integrovaného správce balíčků: jeden příkaz pro instalaci balíčku SSH (openssh) a druhý pro instalaci LTS verze Node.js, která je navržena tak, aby byla stabilnější.

Termux se chová jako malý linuxový systém, Udržuje procesy na pozadí a od verze Android 12 může být omezený.Je to proto, že systém přísněji kontroluje počet aktivních vláken na aplikaci. I tak se však ukázalo, že na jednoduchém testovacím serveru funguje bez problémů i na novějších verzích, jako je Android 13.

Vytvořte si základní webovou stránku na svém mobilním zařízení

Když je prostředí připravené, je čas dát mu něco, co bude sloužit. Pro rychlý test můžete vygenerovat minimální HTML kód přímo z terminálu.Například soubor index.html se zprávou typu „Ahoj světe“. Jednoduchý příkaz přesměrující text do souboru vytvoří danou stránku během sekundy.

Pokud chcete něco propracovanějšího, HTML soubor můžete upravovat přímo v Termuxu pomocí nano.Je to textový editor v konzolovém režimu. Otevřete si index.html a budete si moci napsat libovolný HTML kód: základní strukturu, nadpisy, odstavce, odkazy, malé inline styly... s dotykovou klávesnicí to není nejpohodlnější zážitek, ale pro úpravy nebo jednoduché stránky to funguje.

Mějte na paměti, že vše, co ukládáte do pracovního adresáře Termuxu Bude to součást tras, které můžete obsluhovat pomocí svého budoucího webového serveru.Je dobré uchovávat projekty v oddělených složkách, abyste zabránili míchání souborů a vše bylo lépe organizované.

Spusťte webový server a přistupte k němu z lokální sítě

Jak používat telefon Android jako lokální server

Jakmile máte připravený soubor index.html, začíná ta zábavná část: Spusťte HTTP server, aby byl web přístupnýS nainstalovaným Node.js je velmi rychlým způsobem použití utility typu http-server, která běží s npx a spouští statický server na konkrétním portu.

Jakmile se tento server spustí, budete moci přistupovat k webu ze svého mobilního zařízení. pomocí adresy zpětné smyčky, obvykle http://127.0.0.1 nebo http://localhost v kombinaci s portem, který server používá (například 8080). V prohlížeči telefonu uvidíte svůj text „Hello World“ nebo stránku, kterou jste vytvořili.

Skvělé je, že k němu můžete přistupovat i z jiných zařízení ve stejné síti Wi-Fi. Chcete-li to provést, Potřebujete znát lokální IP adresu mobilního telefonu.Něco jako 192.168.xy, v závislosti na síti. Na jiném zařízení jednoduše otevřete prohlížeč a zadejte tuto IP adresu následovanou portem serveru, například http://192.168.65.33:8080, abyste si stránku načetli do telefonu.

Pokud nastavíte server na jiný port, například 5001, Při přístupu z jiných zařízení musíte toto číslo portu respektovat.Pokud se stránka načte na vašem mobilním zařízení, ale ne na jiných zařízeních v síti, je to obvykle z jednoho z těchto důvodů: server je propojen pouze s localhost, firewall nebo nějaká síťová konfigurace blokuje přístup nebo mobilní zařízení a druhé zařízení nejsou ve skutečnosti ve stejné podsíti.

Zpřístupněte svůj mobilní server internetu pomocí zabezpečených tunelů

Zviditelnění mobilního serveru mimo domácí síť je další úroveň. Otevírání portů na routeru a přesměrování provozu do telefonu je nepraktické a může představovat bezpečnostní riziko.Navíc vyžaduje pokročilou konfiguraci, které se ne každý chce dotknout.

Pohodlnější alternativou je použití externí tunelové služby. Nástroje jako Pinggy vám umožňují vytvořit veřejnou URL adresu, která přesměruje provoz na server běžící na vašem mobilním zařízení.pomocí reverzního SSH připojení. Tímto způsobem se nemusíte dotýkat routeru ani vyjednávat s vaším poskytovatelem internetu.

Postup je obvykle jednoduchý: Z Termuxu spustíte příkaz ssh s konkrétním portem (například 443) a přesměrováním z generované subdomény za běhu na váš localhost a interní port. (například 8080). Vzdálená služba vrátí v konzoli URL adresu, která vypadá takto: https://randomname.a.pinggy.io, což bude veřejně přístupná adresa.

Tuto adresu může sdílet kdokoli s prohlížečem a Stránka, která se nachází na vašem mobilu, bude zobrazována tunelem.V bezplatných verzích těchto služeb má URL adresa často omezenou dobu trvání, například 60 minut, což je více než dost pro rychlé demo nebo jednorázovou kontrolu projektu ve vývoji.

Pokud chcete něco vážnějšího a trvalejšího, Obvykle nabízejí placené tarify s vlastními doménami a trvalými tunely.To by vám umožnilo mít server hostovaný na Androidu se stabilní URL adresou. Musíte však zvážit, zda se to vyplatí ve srovnání s tradičním hostingem nebo použitím levného VPS.

Používejte aplikace jako Tiny Web Server k nastavení serveru bez komplikací

Pokud používání příkazů není pro vás, nebo chcete jednoduše okamžitou možnost, Aplikace jako Tiny Web Server proces co nejvíce zjednodušují.Je to bezplatná aplikace, kterou najdete na Google Play a obsahuje vše, co potřebujete k přehrávání souborů z určité složky v mobilním telefonu.

Doporučuje se vždy stahovat tyto typy aplikací z oficiálního obchodu. Získání APK souboru z webů třetích stran může představovat bezpečnostní rizika.protože by mohly být upraveny škodlivým kódem, který ohrožuje vaše data nebo síť.

Jakmile je aplikace nainstalována, obvykle ji po otevření zjistíte, že je „vypnutá“. Uvidíte tlačítko nebo přepínač pro spuštění nebo zastavení serveru.Toto je doprovázeno poli pro úpravu portu a cesty ke složce, která bude sloužit jako kořenový adresář webu. V mnoha případech bude výchozí port 8080, který je pro tento typ použití obvykle volný.

Specifikace Samsungu Galaxy A3 s 4,5palcovým displejem
Související článek:
Proměňte svůj Samsung Galaxy v bezdrátový mediální server: Kompletní průvodce

Pro uspořádání obsahu je vhodné vytvořit si speciální složku, například „NetworksZone“ nebo s jakýmkoli jiným názvem, který vám vyhovuje. Do této složky umístíte HTML soubory, které chcete zobrazovat.spolu s obrázky, stylovými listy a dalšími statickými zdroji.

Jednoduchým příkladem by bylo vytvoření velmi jednoduchého HTML souboru v počítači pomocí textového editoru, jako je Poznámkový blok. Uložte jej s příponou .html (například index.html) a zkopírujte jej do vybrané složky v mobilním zařízení.Odtud ji Tiny Web Server interpretuje jako hlavní stránku, pokud tuto cestu použijete v URL adrese.

Před kliknutím na „spustit server“ je obvykle nutné nastavit kódování znaků nebo kořenový adresář. Je důležité nastavit správnou cestu a ověřit, zda nakonfigurovaný port nekoliduje s jinými aplikacemi.Jakmile je vše na svém místě a aktivujete server, uvidíte, že se stav změní z „Zastaveno“ (obvykle červeně) na „Spuštěno“ (nějakou viditelnou barvou, například modrou).

Pro přístup k obsahu z prohlížeče, Budete muset zadat lokální IP adresu mobilního telefonu, následovanou portem a názvem souboru.Něco jako http://MOBILE_IP:8080/index.html. Pokud jste do souboru vložili několik testovacích vět, uvidíte, že se vám zobrazují přímo z telefonu.

Připojení aplikací a WebView k lokálnímu vývojovému serveru

Kromě použití mobilního telefonu jako serveru se vyvíjí i velmi běžný scénář: Přistupujte k webovému serveru spuštěnému na vašem počítači z mobilního zařízení nebo emulátoru.ať už se jedná o ASP.NET Core API, projekt Node.js nebo front-end na lokálním portu.

Při použití WebView v systému Android k načtení vyvíjeného webu, přístup k http://localhost přímo v zařízení Neodkazuje na lokální hostitel počítače, ale na lokální hostitel mobilního zařízení nebo samotného emulátoru.Zde přicházejí na řadu nástroje jako Android Debug Bridge (adb), které umožňují obrátit přesměrování portů.

S adb máte reverzní příkaz, který přesměruje provoz přicházející na port na zařízení na port na hostitelském počítačiSpouští se z terminálu v počítači, něco jako příkaz, kde uvedete port zařízení (DEVICE_PORT) a port hostitele (HOST_PORT), které odpovídají lokálnímu serveru.

Například pokud váš vývojový server běží na vašem počítači na adrese http://localhost:8080, můžete adb sdělit, že Požadavky přicházející na port 8080 zařízení jsem přeposílal na stejný port 8080 hostitele.Jakmile to bude hotové, bude mít jakýkoli WebView ve vaší mobilní aplikaci přístup k serveru pouhým odkazem na http://localhost:8080 ze samotného zařízení.

Tato metoda funguje jak pro fyzická zařízení připojená přes USB, tak pro emulátory. Výhodou je, že WebView nadále pracuje s důvěryhodným názvem hostitele localhost.Tím se zabrání bezpečnostním problémům a omezením, které by vznikly při použití „vzácné“ nebo nebezpečné IP adresy.

Přesměrování portů pomocí Chrome DevTools

Dalším pohodlným způsobem, jak propojit zařízení s místním serverem, je použití nástrojů pro vývojáře v Chromu. Chrome nabízí funkci přesměrování portů, která je přístupná ze stránky chrome://inspectnavrženo pro ladění vzdáleného obsahu a jeho propojení s vaším lokálním prostředím.

Proces zahrnuje povolení ladění USB na zařízení a provedení kroků popsaných v dokumentaci: Připojte mobilní zařízení, otevřete chrome://inspect, přejděte do sekce přesměrování portů a určete, který port na zařízení bude přiřazen ke které adrese a portu na vašem počítači..

Například můžete portu 3000 zařízení sdělit, aby ukazoval na localhost:8000 ve vašem počítači. Od tohoto okamžiku se jakýkoli WebView, který načte http://localhost:3000, bude ve skutečnosti připojovat k vašemu vývojovému serveru na adrese localhost:8000.Je to běžně používané řešení při práci s moderními front-end frameworky nebo s živými vývojovými servery.

Kromě toho lze pro lokální server použít vlastní doménu, Konfigurace přesměrování portů tak, aby ukazovalo na konkrétní názvyDíky tomu je snazší simulovat produkční prostředí a testovat bezpečnostní zásady, soubory cookie a další podrobnosti závislé na doméně.

Speciální adresy pro emulátory: 10.0.2.2 a novější

Při práci s emulátory se koncept „localhost“ stává trochu složitějším. Emulátor Androidu přímo nevidí síťové rozhraní vašeho vývojového počítače., protože běží za virtuálním routerem s rezervovaným síťovým prostorem.

Pro překlenutí této mezery poskytuje emulační prostředí speciální IP adresu: 10.0.2.2 slouží jako alias pro 127.0.0.1 na hostitelském počítači.Jinými slovy, pokud máte na počítači službu na adrese http://localhost:5000, můžete k ní přistupovat z emulátoru na adrese http://10.0.2.2:5000.

To je obzvláště užitečné v aplikacích vyvinutých s .NET MAUI nebo jakoukoli jinou technologií, která vyžaduje Spotřebujte ASP.NET Core API běžící na stejném počítači, kde vyvíjíteV takovém případě kód aplikace obvykle definuje základní adresu, která se mění v závislosti na platformě, a ukazuje na 10.0.2.2 pro Android a localhost pro iOS nebo pro spustitelné soubory pro stolní počítače.

V případě simulátoru iOS se více integruje se sítí hostitelského počítače. Aplikace běžící v simulátoru se mohou připojovat přímo na localhost nebo na IP adresu počítače., a to jak pro HTTP, tak pro HTTPS, bez nutnosti speciálního aliasu, jako je ten pro Android.

Lokální služby přes HTTP a HTTPS: další nastavení

Pokud je vaše lokální služba zpřístupněna přes nešifrovaný protokol HTTP, aplikace .NET MAUI běžící na systému Android nebo iOS Můžete jej používat, pokud upravíte příslušné nastavení sítě.To zahrnuje dvě věci: použití správné URL adresy podle platformy a explicitní povolení HTTP provozu v projektech.

V kódu aplikace je běžné definovat základní řetězec, který vybírá mezi http://10.0.2.2:port pro Android a http://localhost:port pro zbytek. Jakmile je tento základ vytvořen, vybudují se kompletní trasy ke koncovým bodům API.Například /api/todoitems, což je to, co HttpClient použije při vytváření požadavků.

V systému Android jsou moderní aplikace výchozí. Blokují provoz prostého textu, aby chránily uživatele.Aby se to povolil pouze ve vývoji, lze postupovat dvěma způsoby: aktivovat UsesCleartextTraffic v atributu aplikace, zabalený v kompilačních direktivách DEBUG, aby se nepropašoval do produkčního prostředí, nebo vytvořit konfigurační soubor zabezpečení sítě.

Tento XML soubor, umístěný v příslušné cestě projektu, Umožňuje vám specifikovat domény, pro které je akceptován nešifrovaný provoz.Pokud například chcete povolit přístup pouze k verzi 10.0.2.2, definujete konfiguraci domény s parametrem cleartextTrafficPermitted="true" a uvedenou doménou a poté na tento XML kód odkážete z AndroidManifestu pomocí atributu networkSecurityConfig.

V systému iOS se příběh týká zabezpečení dopravy Apple (ATS). Chcete-li povolit lokální volání HTTP, musíte v souboru Info.plist deklarovat, že je povoleno lokální síťování. s konkrétním klíčem. Tímto způsobem zabráníte systému v blokování připojení, protože jsou považována za nezabezpečená.

Pokud lokální server běží přes HTTPS, vstupují do hry vývojářské certifikáty. ASP.NET Core generuje certifikát s vlastním podpisem pro lokální provoz.Tento certifikát po instalaci v počítači není automaticky důvěryhodný. Abyste tomuto certifikátu v systému důvěřovali, musíte spustit nástroj dotnet dev-certs s příslušnou volbou.

I přesto mu Android a iOS v emulátorech a simulátorech budou i nadále nedůvěřovat. Agnostickým řešením je obvykle konfigurace HttpClientHandler, který ignoruje chyby ověření pro daný certifikát ve vývojovém režimu., přičemž se například kontroluje, zda vydavatel certifikátu odpovídá „CN=localhost“, a v tomto případě se vrací hodnota true.

Opět platí, že tyto úpravy by měly být omezeny na vývojová prostředí a neměly by být nasazovány do produkčního prostředí. protože zmírní ověřování SSL pouze pro usnadnění testováníMyšlenka je, že vaše aplikace může bezproblémově komunikovat se zabezpečeným lokálním serverem pomocí HTTP.s://localhost:port nebo https://10.0.2.2:port během procesu vývoje a ladění.

Aplikace nefungují správně, když je VPN aktivní: co dělat
Související článek:
Aplikace nefungují správně, když je VPN aktivní: řešení a příčiny

Dohromady všechny tyto části – Termux, aplikace jako Tiny Web Server, SSH tunely jako Pinggy, přesměrování portů pomocí adb a Chrome DevTools, použití verze 10.0.2.2 v emulátorech a konfigurace HTTP/HTTPS v .NET MAUI – Tvoří velmi silný ekosystém pro vývoj a testování webových projektů a API bez závislosti na vzdálených serverech.buď přímým použitím mobilního zařízení jako serveru, nebo flexibilním a bezpečným připojením mobilního zařízení k vašemu vývojovému počítači. Sdílejte tento návod a pomozte ostatním proměnit jejich mobilní telefon v lokální server.