लोकलहोस्ट के बाहर एक्सेस की अनुमति कैसे दें


184

मैं Angular2 पर लोकलहोस्ट के बाहर कैसे पहुंच सकता हूं? मैं localhost:3030/panelआसानी से नेविगेट कर सकता हूं लेकिन जब मैं अपना आईपी लिखता हूं तो मैं नेविगेट नहीं कर सकता 10.123.14.12:3030/panel/

क्या आप मुझे इसे ठीक करने की अनुमति दे सकते हैं? मैं npmइस परियोजना को स्थापित करने और चलाने के लिए नोड परियोजना प्रबंधन (नोड स्थापित / नोड प्रारंभ) का उपयोग नहीं कर रहा हूं ।

यदि आप चाहें, तो मैं अपनी package.jsonऔर प्रदान कर सकता हूं index.html


1
क्या आप एनजी सर्व का उपयोग करते हैं?
mast3rd3mon

1
हां, मैं एनजी सर्वर का उपयोग कर रहा
हूं

2
क्या आपने एनजी सेवा करने की कोशिश की --होस्ट १०.१२३.१४.१२?
दिग्विजय

1
मैं थके हुए एनजी की सेवा करता हूं और यह कहता है कि "मुझे सर्विंग का उपयोग करने के लिए कोणीय में एक कोणीय परियोजना के अंदर रहना होगा"।
टोनीटुक

जवाबों:


338

का उपयोग ng serve --host 0.0.0.0कर आप के ng serveबजाय अपने आईपी का उपयोग करने से कनेक्ट करने की अनुमति देगा localhost

संपादित करें

क्ली के नए संस्करणों में, आपको इसके बजाय अपना स्थानीय आईपी पता प्रदान करना होगा

EDIT 2

क्ली के नए संस्करणों में (मुझे लगता है कि v5 और ऊपर) आप 0.0.0.0अपने नेटवर्क पर किसी से भी बात करने के लिए इसे होस्ट करने के लिए फिर से आईपी के रूप में उपयोग कर सकते हैं ।


1
यह कहता है कि "आपको सर्विंग का उपयोग करने के लिए एक एंग्लुअर - क्ली प्रोजेक्ट के अंदर रहना होगा" जब मैं एनआरई को लिखता हूं और साथ ही एक पीला संदेश भी देता हूं, जिसमें संकेत मिलता है कि मैं नोड का संस्करण 6.2.2 चला रहा हूं, जो एनजी परोसने के बाद सीएलआई के भविष्य के संस्करणों में समर्थन नहीं किया जाएगा
टोनीचुक

1
पहला, नोड अपडेट करने का प्रयास करें, दूसरा, अपने टर्मिनल / vscode को पुनः आरंभ करने का प्रयास करें
mast3rd3mon

1
मैंने इसे पैकेज जसन से 6.0.46 में "@ प्रकार / नोड" के रूप में अपडेट किया: "6.0.46", लेकिन अभी भी एक ही संदेश मिलता है
टोनीबुकुक

1
मुझे समझ नहीं आता कि लोग कैसे देते हैं - मेरे सवालों को वोट देते हैं और मुझे नहीं पता कि यह कौन करता है। यहां तक ​​कि आप प्रश्न को गलत समझते हैं और मुझे गलत उत्तर देते हैं जो वे अभी भी देते हैं - "प्रतिष्ठा"। इसका जवाब मुझे खुद ही मिल गया। मुझे "" सर्वर ":" webpack-dev-server --inline --progress --host 0.0.0.0 --port 3000 ", पैकेजजोन में जोड़ने के लिए चाहिए था
टोनीचुक

7
इसने मेरे लिए काम किया:ng serve --open --host 0.0.0.0 --disable-host-check
जोनाथन

39

मैक उपयोगकर्ता:

  1. सिस्टम प्राथमिकताएं -> नेटवर्क -> वाई-फाई पर जाएं
  2. स्थिति के नीचे IP पते की प्रतिलिपि बनाएँ (आमतौर पर 192.168.1.x)
  3. इसे अपने एनजी में परोसें जैसे: ng serve --host 192.168.1.x

तब आप अपने पेज को अन्य उपकरणों पर देख सकते हैं 192.168.1.x:4200


1
मेरे लिए काम करते थे और अब काम नहीं करते। सोच रहा हूँ क्यों। मुझे लगता है कि मैंने सब कुछ करने की कोशिश की है! मेरा फ़ायरवॉल अक्षम है। एनजी सर्व --होस्ट 10.xxx - डिसएबल-होस्ट-चेक / एनजी सर्व --होस्ट 0.0.0.0 - डिसएबल-होस्ट-चेक -> विंडोज रिमोट मशीन से एक्सेस करने योग्य नहीं है जो 10.xxx के साथ एक ही नेटवर्क पर है : 4200
राफेल मोजर

कोणीय 7, और MacOS 10.14.6 में अच्छी तरह से काम करता है
बीकेएस

क्या यह की कीमत के लिए, स्वीकार किए जाते हैं जवाब मेरे लिए MacOS अक्टूबर 2019 के रूप में काम कर रहा है
अलेक्जेंडर Nied

यह मेरे लिए काम करता है, और दूर-दूर तक खोज करने के बाद, यह एकमात्र उत्तर है जो मैंने इस प्रमुख चरण को निर्दिष्ट करने के लिए देखा है: आपके iPhone सफारी ब्राउज़र के एड्रेस बार में, प्लग इन: 192.168.1.x: 4200, जहां x = आपके आईपी पते के अंतिम अंक। ": 4200" सहित मेरे लिए अंतर था।
9gt53wS

@ RafaëlMoser क्या आपने इसे हल किया? मेरे पास एक ही मुद्दा है और मैं वास्तव में क्लूलेस हूं।
मैदे

29

चलाने के आदेश

ng serve --host=0.0.0.0 --disable-host-check

यह होस्ट चेक को अक्षम कर देगा और आईपी पते के साथ बाहर (स्थानीयहोस्ट के बजाय) से एक्सेस करने की अनुमति देगा


3
मुझे जरूरत नहीं थी - होस्ट-होस्ट-चेक। ng serve --host 0.0.0.0मेरे लिए ठीक काम करता है। होस्ट चेक क्या करना चाहिए?
एंड्रयू

5
एक बार जरूरत पड़ने पर disabled-host-checkमुझे "अवैध होस्ट हैडर" का संदेश मिला
GameDroids

वहाँ एक तरीका यह एक config फाइल में परिभाषित करने के लिए हर बार उल्लेख करने से बचने के लिए है?
आयुष कुमार

12

आप अपने आईपी के साथ उपयोग करने के लिए निम्न कमांड का उपयोग कर सकते हैं।

ng serve --host 0.0.0.0 --disable-host-check

यदि आप npm का उपयोग कर रहे हैं और हर बार कमांड को चलाने से बचना चाहते हैं, तो हम स्क्रिप्ट अनुभाग में पैकेज . json फ़ाइल में निम्न पंक्ति जोड़ सकते हैं ।

"scripts": {
    ...
    "start": "ng serve --host 0.0.0.0 --disable-host-check"
    ...
}

फिर आप उसी नेटवर्क में अन्य सिस्टम से एक्सेस होने के लिए नीचे दिए गए कमांड का उपयोग करके आपको ऐप चला सकते हैं।

npm start

3
यह अब -DisableHostCheck = true | मेरे संस्करण में गलत है, कोणीय 8.
टोनी

8

मैं angular.jsonनीचे के रूप में अपनी परियोजना में फ़ाइल को संपादित करता हूं और यह काम करता है

...

    "serve": {
      "builder": "@angular-devkit/build-angular:dev-server",
      "options": {
        "browserTarget": "project:build",
        "host": "0.0.0.0"
      },

...


8

आप एनरोक का उपयोग करके अपनी सुरंगों पर चलने वाले सभी HTTP ट्रैफ़िक को भी रोक सकते हैं, फिर आप उपयोग कर सकते हैंngrok http --host-header=rewrite 4200


4

Cmd खोलें और प्रोजेक्ट स्थान पर नेविगेट करें यानी जहाँ आप प्रोजेक्ट के लिए npm इंस्टॉल या एनजी सर्व करते हैं।

और फिर कमांड चलाएं - ng serve --host 10.202.32.45जहां 10.202.32.45आपका आईपी पता है।

आप अपने पृष्ठ पर पहुँच सकेंगे 10.202.32.45:4200जहाँ 4200 आपका पोर्ट नंबर है।

नोट: यदि आप इस कमांड का उपयोग करके अपने ऐप की सेवा लेते हैं तो आप एक्सेस नहीं कर पाएंगेlocalhost:4200


क्या दोनों तरह से पहुंच संभव है?
जिशान पे

यह धन्यवाद काम करता है..मुझे लगता है कि मैं गलत आईपी एड्रेस देख रहा था
तेजश्री पतंगे

पता है कि यह मूर्खतापूर्ण लगता है, लेकिन सुनिश्चित करें कि आपका फ़ोन उसी wifi नेटवर्क का उपयोग कर रहा है जैसे कि आप देव मशीन। मैं एक अतिथि नेटवर्क का उपयोग कर रहा था ... मेरे लिए काम करने वाले एकमात्र उत्तर के लिए +1।
greg

3

समस्या के लिए फ़ायरवॉल था। यदि आप विंडोज पर हैं, तो सुनिश्चित करें कि नोड के माध्यम से अनुमति दी गई है यहां छवि विवरण दर्ज करें


मैं एनजी सर्व --होस्ट 0.0.0.0 के साथ सेवा करने के बाद भी उसी नेटवर्क से एक्सेस नहीं कर पाया। लेकिन फ़ायरवॉल की अनुमति मुद्दा था जैसा कि आपने उल्लेख किया है। इस एक को साझा करने के लिए समय निकालने के लिए धन्यवाद।
सैंडी बी

3

एक त्वरित समाधान जो किसी की मदद कर सकता है:

ng serve --host 0.0.0.0 --disable-host-check अपने आरंभ में मूल्य के रूप में इस पंक्ति को जोड़ेंpackage.json

उदाहरण के लिए:

{
"ng": "ng",
"start": "ng serve --host 0.0.0.0 --disable-host-check",
"build": "ng build",
}

और फिर बस करो startयाnpm run start

आप अन्य स्थानीय IP से अपनी परियोजना का उपयोग करने में सक्षम होंगे।


1

यदि आपको CMDडॉकटर के अंदर एक ही समस्या का सामना करना पड़ रहा है, तो आप नीचे डॉकरफाइल में उपयोग कर सकते हैं ।

CMD ["ng", "serve", "--host", "0.0.0.0"]

या डॉकरफाइल को पूरा करें

FROM node:alpine
WORKDIR app
RUN npm install -g @angular/cli
COPY . .
CMD ["ng", "serve", "--host", "0.0.0.0"]

-1

proxy.conf.jsonइस कॉन्फ़िगरेशन को बनाएं और पेस्ट करें

{  
"/api/*":
    {    
        "target": "http://localhost:7070/your api project name/",
        "secure": false,
        "pathRewrite": {"^/api" : ""}
    }
}

बदलने के:

let url = 'api/'+ your path;

CLI से चलाएँ:

ng serve  --host port.number —-proxy-config proxy.conf.json

-1

मेरे लिए यह "एनजी सर्व - वेस्टेन --होस्ट 0.0.0.0" का उपयोग करके काम करता है, लेकिन एक चेतावनी है


चेतावनी: यह स्थानीय रूप से कोणीय अनुप्रयोगों के परीक्षण या डिबगिंग में उपयोग के लिए एक सरल सर्वर है। सुरक्षा मुद्दों के लिए इसकी समीक्षा नहीं की गई है।

इस सर्वर को एक खुले कनेक्शन से बांधने से आपका एप्लिकेशन या कंप्यूटर समझौता कर सकता है। "-हॉस्ट" ध्वज के पास दिए गए एक से अधिक होस्ट का उपयोग करने से वेबसैट कनेक्शन समस्याओं का परिणाम हो सकता है। यदि ऐसा हो तो आपको "--disableHostCheck" का उपयोग करने की आवश्यकता हो सकती है।


-1

कोई भी पैकेज नहीं।जेसन को बदलने की आवश्यकता नहीं है।

मेरे लिए यह काम करता है:

एनजी सर्व --होस्ट = ०.०.०.० --पोर्ट = ५ ९९ -डायरेबल-होस्ट-चेक

होस्ट: http: // localhost: 5999 /


-1
  • का उपयोग करें ng serve --host<Your IP> --port<Required if any>

  • एनजी की सेवा - ९ २ = १ ९ २.१११.१-११ - पासपोर्ट = ४५४५।

  • अब आप संकलन के अंत में नीचे की रेखा देख सकते हैं।

कोणीय लाइव डेवलपमेंट सर्वर 192.111.1.11:4545 पर सुन रहा है, http://192.111.1.11:4545/** पर अपना ब्राउज़र खोलें ।


-3

जो लोग नोड प्रोजेक्ट मैनेजर का उपयोग कर रहे हैं, उनके लिए भी इस लाइन को package.json में जोड़ना पर्याप्त होगा। कोणीय सीएलआई उपयोगकर्ताओं के लिए, mast3rd3mon का उत्तर सत्य है।

आप जोड़ सकते हो

"server": "webpack-dev-server --inline --progress --host 0.0.0.0 --port 3000"

to package.json

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.