Cara mengizinkan akses di luar localhost

Bagaimana saya bisa mengizinkan akses di luar localhost di Angular2? Saya dapat menavigasi dengan localhost:3030/panelmudah tetapi saya tidak dapat menavigasi ketika saya menulis IP seperti 10.123.14.12:3030/panel/.

Bisakah Anda mengizinkan saya cara memperbaikinya? Saya tidak menggunakan npm(mengelola proyek simpul - install node / start node) untuk menginstal dan menjalankan proyek.

Jika Anda mau, saya bisa menyediakan package.jsondan index.html.

Menggunakan ng serve --host 0.0.0.0akan memungkinkan Anda untuk terhubung ke ng servemenggunakan ip Anda, bukan localhost.

EDIT

Di versi yang lebih baru dari cli, Anda harus memberikan alamat ip lokal Anda sebagai gantinya

EDIT 2

Dalam versi yang lebih baru dari cli (saya pikir v5 dan lebih tinggi), Anda dapat menggunakan 0.0.0.0ip lagi untuk menjadi tuan rumah bagi siapa saja di jaringan Anda untuk diajak bicara.

Pengguna Mac:

1. Pergi ke System Preferences -> Network -> Wi-Fi
2. Salin alamat IP di bawah Status (Biasanya 192.168.1.x)
3. Rekatkan ke dalam layanan Anda seperti: ng serve --host 192.168.1.x

Maka Anda harus dapat melihat halaman Anda di perangkat lain melalui 192.168.1.x:4200.

jalankan perintah

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

ini akan menonaktifkan pemeriksaan host dan memungkinkan akses dari luar (bukan localhost) dengan alamat IP

Anda dapat menggunakan perintah berikut untuk mengakses dengan ip Anda.

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

Jika Anda menggunakan npm dan ingin menghindari menjalankan perintah setiap waktu, kami dapat menambahkan baris berikut ke file package.json di bagian skrip .

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

Kemudian Anda dapat menjalankan aplikasi Anda menggunakan perintah di bawah ini untuk diakses dari sistem lain di jaringan yang sama.

npm start

Saya hanya mengedit angular.jsonfile di proyek saya seperti di bawah ini dan berfungsi

...

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

...

Anda juga dapat mengintrospeksi semua lalu lintas HTTP yang berjalan di terowongan Anda menggunakan ngrok , lalu Anda dapat mengekspos menggunakanngrok http --host-header=rewrite 4200

Buka cmd dan arahkan ke lokasi proyek yaitu di mana Anda menjalankan instalasi npm atau ng servis untuk proyek tersebut.

dan kemudian jalankan perintah - di ng serve --host 10.202.32.45mana 10.202.32.45alamat IP Anda.

Anda akan dapat mengakses halaman Anda di 10.202.32.45:4200mana 4200 adalah nomor port Anda.

Catatan: Jika Anda melayani aplikasi menggunakan perintah ini maka Anda tidak akan dapat mengakseslocalhost:4200

Untuk masalahnya adalah Firewall. Jika Anda menggunakan Windows, pastikan simpul diizinkan masuk

Solusi cepat yang mungkin membantu seseorang:

Tambahkan baris ini sebagai nilai untuk memulai ng serve --host 0.0.0.0 --disable-host-check dipackage.json

ex:

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

Dan kemudian lakukan startataunpm run start

Anda akan dapat mengakses proyek Anda dari IP lokal lainnya.

Jika Anda menghadapi masalah yang sama di dalam Docker, maka Anda dapat menggunakan CMDdi bawah ini di Dockerfile.

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

Atau lengkapi Dockerfile

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

Buat proxy.conf.jsondan tempel konfigurasi ini

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

Menggantikan:

let url = 'api/'+ your path;

Jalankan dari CLI:

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

bagi saya ini berfungsi menggunakan "ng serve --open --host 0.0.0.0" tetapi ada peringatan

PERINGATAN: Ini adalah server sederhana untuk digunakan dalam menguji atau men-debug aplikasi Angular secara lokal. Belum ditinjau untuk masalah keamanan.

Mengikat server ini ke koneksi terbuka dapat mengakibatkan kompromi aplikasi atau komputer Anda. Menggunakan host yang berbeda dari yang diteruskan ke bendera "--host" dapat menyebabkan masalah koneksi websocket. Anda mungkin perlu menggunakan "--disableHostCheck" jika itu masalahnya.

Tidak ada package.json yang perlu diubah.

Bagi saya ini berfungsi menggunakan:

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

Host: http: // localhost: 5999 /

• Gunakan ng serve --host<Your IP> --port<Required if any>.

• ng serve --host = 192.111.1.11 --port = 4545.

• Anda sekarang dapat melihat baris di bawah ini di akhir kompilasi.

Server Pengembangan Langsung Angular mendengarkan pada 192.111.1.11:4545, buka browser Anda di http://192.111.1.11:4545/**.

Untuk orang-orang yang menggunakan manajer proyek simpul, juga baris ini menambahkan ke package.json akan cukup. Untuk pengguna CLI sudut, jawaban mast3rd3mon benar.

Anda dapat menambahkan

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

ke package.json