Wyświetlanie witryny Django i witryny sieci Web w sieci LAN

Question

Próbuję wyświetlić lokalnie obsługiwaną witrynę na innych urządzeniach, takich jak mój telefon lub inny laptop. Na moim obecnym laptopie strona działa dobrze, widzę wszystko (frontend) i dostaję 200s kiedy odwiedzam stronę.

Jednak, gdy próbuję uzyskać dostęp do witryny z moim iPhonem i drugim laptopem, nie widzę żadnego interfejsu, ale dostaję 200, gdy próbuję uzyskać dostęp do witryny. Terminal na moim komputerze pracy mówi mi też, że istnieją wnioski pochodzące w.

używam Django jako backend i pakiet/budować mój Javascript i CSS z webpack i służyć z webpack-dev-server.

Kiedy biegnę WebPACK widzę komunikat:

http://0.0.0.0:3000/ 
webpack result is served from http://localhost:3000/public/bundle/ 
content is served from ./public 

Kiedy załadować moją stronę na moim komputerze działa, narzędzia programistyczne To pokazuje:

i wszystko działa.

Uruchomę django za pomocą tego polecenia.

$ ./manage.py runserver 0.0.0.0:8000

My ifconfig daje mi:

inet 192.168.1.102

Z moim drugim laptopie, odwiedzam 192.168.1.102:8000 i nic nie widzę na mojej stronie. Dostaję 200 na mojej maszynie z działaniem strony, co oznacza, że ​​żądania przeszły. Na moim drugim laptopie widzę to w narzędziach deweloperskich:

Wskazówka robi mieć /public/ w src i href

na moim drugim komputerze, jeśli mogę odwiedzić 192.168.1.102:3000 widzę interfejs i jestem mogę klikać dookoła do 192.168.1.102:3000/bundle/main.js i zobaczyć mój webpack zbudowany javascript.

Na mojej drugiej maszynie, próbowałem zmienić src i href w moich narzędziach programistycznych na 192.168.1.102:3000/bundle/main.js. Jednak nic się nie zmieni i nadal widzę pusty ekran

Oto gist mojego WebPACK config:

https://gist.github.com/liondancer/7685b53dffa50d7d102d

Answer 1

wierzę strona jest pusta, ponieważ cały „aplikacja” jest generowany przez JavaScript (Wygląda to tak przynajmniej na dwóch screenach, zakładając, że treść <div id="app"></div> nie jest generowana przez widok django), ale plik javascript nie jest dostępny dla klientów, którzy różnią się od twojego komputera programującego.

Trudno odgadnąć, dlaczego tak się dzieje bez twojej settings.py, urls.py i/kod szablonu z view generowania strony głównej, ale mamy kilka kandydatów, które mogą być generowania tego zagadnienia: Cors, localhost „zatrucia” i ostatecznie STATIC_URL błędna konfiguracja.

1. CORS: Wniosek jest uważany cross-domain jeśli któryś z programu, hosta lub portu nie pasują. Żądasz pliku zarówno od localhost:8000 (lub 192.168.1.102:8000), jak i od localhost:3000. Więc problemy z CORS wzrosną, jeśli poprosisz o pliki z zewnętrznego urządzenia/laptopa;
2. to ta sama maszyna jako 192.168.1.102 na twoim "działającym komputerze", ale nie znajduje się ona na twoim drugim laptopie lub innym urządzeniu w twojej sieci;
3. Czy generujesz adresy URL dla plików css i js przy użyciu tagów {% url %} lub {% static %}? Wygląda na to, że nie, ale wciąż wyglądają dynamicznie generowane (tj. Brakująca część "publiczny /" ich adresu URL). Nie jestem świadomy sposobu na uzyskanie różnych ścieżek przy użyciu wanilii Django i tych samych ustawień, więc powinieneś podać kod źródłowy swojego widoku, aby uzyskać dokładną odpowiedź.

Solutions (lub, co najmniej, podpowiedzi :-)):

1. Podawać zawiniątko z tego samego portu (dodać je do STATIC path)
2. Wymień każdy localhost odniesienia w swojej Adresy URL html (może to wymagać zmiany sites - patrz sites framework)
3. Użyj standardowych szablonów/filtrów i unikaj zakodowanych adresów URL w szablonach i kodzie.

lub zainstalować https://github.com/owais/django-webpack-loader/ (pip install django-webpack-loader) i śledzić ich README lub http://owaislone.org/blog/webpack-plus-reactjs-and-django/ przewodnik