2015-12-30 10 views
11

पर Django और वेबपैक निर्मित साइट को देखकर मैं अपने फोन या अन्य लैपटॉप जैसे अन्य उपकरणों पर अपनी स्थानीय रूप से सेवा की गई साइट को देखने की कोशिश कर रहा हूं। मेरे वर्तमान लैपटॉप पर साइट ठीक काम करती है, मैं सबकुछ देखता हूं (फ्रंटेंड) और जब मैं साइट पर जाता हूं तो मुझे 200 मिलते हैं।लैन

हालांकि, जब मैं अपने आईफोन और दूसरे लैपटॉप के साथ साइट तक पहुंचने का प्रयास करता हूं, तो मुझे कोई फ्रंटेंड नहीं दिखता है, लेकिन जब मैं साइट तक पहुंचने का प्रयास करता हूं तो मुझे 200 मिलते हैं। मेरे काम कर रहे मशीन पर टर्मिनल भी मुझसे कहता आ अनुरोध देखते हैं कि।

मैं एक बैकेंड के रूप में Django का उपयोग करें और मैं बंडल/webpack के साथ मेरी जावास्क्रिप्ट और सीएसएस का निर्माण और webpack-dev-server साथ सेवा करते हैं।

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

जब मैं अपने काम की मशीन पर मेरी वेबपृष्ठ को लोड, डेवलपर उपकरण यह दिखाता है:

enter image description here

और सब कुछ काम कर रहा है

मैं इस संदेश को देख जब मैं webpack चलाते हैं।

मैं इस आदेश के साथ django चलाता हूं।

$ ./manage.py runserver 0.0.0.0:8000

मेरे ifconfig मुझे देता है:

inet 192.168.1.102

मेरी दूसरी लैपटॉप के साथ

, मैं 192.168.1.102:8000 पर जाएँ और मैं अपने पन्ने पर कुछ भी नहीं देखते हैं। मुझे अपनी मशीन पर 200 मिल रहा है, जिसका अर्थ यह है कि अनुरोधों के माध्यम से अनुरोध किया गया है। मेरी दूसरी लैपटॉप पर मैं डेवलपर उपकरण में यह देखें:

enter image description here

सूचना यह does not src और href

में /public/ है मेरी दूसरी मशीन पर अगर मैं 192.168.1.102:3000 जाएँ मैं एक इंटरफ़ेस देख सकते हैं और मैं कर रहा हूँ 192.168.1.102:3000/bundle/main.js पर क्लिक करने में सक्षम है और मेरा वेबपैक जावास्क्रिप्ट बनाया गया है।

मेरी दूसरी मशीन पर, मैंने अपने डेवलपर टूल में src और href को 192.168.1.102:3000/bundle/main.js में बदलने की कोशिश की। हालांकि कुछ भी नहीं बदल जाएगा और मैं अभी भी एक खाली स्क्रीन

यहाँ देख मेरी webpack config के gist है:

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

उत्तर

4

मेरा मानना ​​है कि अपने पृष्ठ रिक्त है क्योंकि पूरी "अनुप्रयोग" जावास्क्रिप्ट द्वारा उत्पन्न होता है (ऐसा लगता है कि कम से कम आपके दो स्क्रीनशॉट में ऐसा लगता है कि <div id="app"></div> की सामग्री django व्यू द्वारा उत्पन्न नहीं होती है) लेकिन जावास्क्रिप्ट फ़ाइल उन ग्राहकों के लिए सुलभ नहीं है जो आपकी विकास मशीन से अलग हैं।

यह अनुमान लगाना क्यों यह अपने settings.py, urls.py और कोड/view अपने मुख पृष्ठ पर पैदा करने में टेम्पलेट के बिना हो रहा है मुश्किल है लेकिन हम कुछ उम्मीदवारों इस मुद्दों पैदा किया जा सकता है कि है: CORS, स्थानीय होस्ट "जहर" और अंत में STATIC_URL गलत कॉन्फ़िगरेशन।

  1. CORS: एक अनुरोध क्रॉस-डोमेन यदि माना जाता है योजना, होस्ट नाम, या बंदरगाह मेल नहीं खाते के किसी भी। आप localhost:8000 (या 192.168.1.102:8000) और localhost:3000 से फ़ाइल का अनुरोध कर रहे हैं। तो अगर आप किसी बाहरी डिवाइस/लैपटॉप से ​​फ़ाइलों का अनुरोध करते हैं तो सीओआरएस मुद्दे बढ़ेगा;
  2. localhost एक ही मशीन आपके "काम कर रहे कंप्यूटर" पर 1 9 2.168.1.102 के रूप में है, लेकिन यह आपके दूसरे लैपटॉप या आपके नेटवर्क में किसी अन्य डिवाइस पर नहीं है;
  3. क्या आप {% url %} या {% static %} टैग का उपयोग कर सीएसएस और जेएस फ़ाइलों के लिए यूआरएल उत्पन्न करते हैं? ऐसा नहीं लगता है, लेकिन फिर भी वे गतिशील रूप से उत्पन्न होते हैं (यानी उनके यूआरएल के गायब "सार्वजनिक /" भाग)। मैं वेनिला Django और एक ही सेटिंग्स का उपयोग कर अलग-अलग पथ प्राप्त करने के तरीके से अवगत नहीं हूं, इसलिए आपको सटीक उत्तर प्राप्त करने के लिए, कम से कम, अपने दृश्य का स्रोत कोड प्रदान करना चाहिए।

समाधान (या कम से कम, संकेत :-)):

  1. ही बंदरगाह
  2. (उन्हें अपने STATIC path में जोड़ने के लिए) से बंडल की सेवा में हर localhost संदर्भ बदलें अपनी एचटीएमएल यूआरएल (इसे आपके sites को बदलने की आवश्यकता हो सकती है - sites framework देखें)
  3. मानक टेम्पलेट टैग/फ़िल्टर का उपयोग करें और टेम्पलेट्स और कोड में हार्ड-कोड किए गए यूआरएल से बचें। https://github.com/liondancer/django-cherngloong:

या https://github.com/owais/django-webpack-loader/ (pip install django-webpack-loader) स्थापित करें और उनके README या http://owaislone.org/blog/webpack-plus-reactjs-and-django/ गाइड

+1

यहाँ का पालन करें अपने प्रोजेक्ट के लिए स्रोत है। मैं आपके सुझावों का प्रयास करूंगा और आपको अपडेट करूंगा – Liondancer

संबंधित मुद्दे