ionic appがlocalhostに接続できません

Question

私は、AndroidでビルドされたIonicバージョン2アプリがユーザーを作成し、Django Rest APIを介してDjango開発サイトに認証することができるプロジェクトに取り組んでいます。

ionic serveを使用すると認証が機能します。これは、Cross-Origin Resource Sharing（Google Chromeプラグインとしてインストールされています）の使用によって実現されました。

実際のアンドロイドデバイスでアプリケーションを実行しようとしたため、アプリケーションの使用時に認証が失敗します（HTTP 404：URLが見つかりませんでしたが、192.168まで同じデバイスのブラウザからアクセスできます）。 22.4：80）。

詳細：

私の現在のプライベートIPアドレスは192.168.22.4あるとのdevのサイトは現在、WAMPをApacheサーバ経由localhostのポート80で提供されています。ここで

はイオンアプリの私のhttpリクエスト（サインアップ）のコード断片である：

let headers = new Headers(); 
     headers.append('Content-Type','application/json'); 

     this.http.post("http://192.168.22.4:80/api-user-create", JSON.stringify(this.postData), {headers: headers}).subscribe(res => { 
     console.log(res.json()); 
     this.showAlert(); 
     }, (err) => { 
     console.log(err); 
     }); 

アプライド・ソリューション：

これらは私が試したが、まだへの接続に失敗している段階ですlocalhost：

アプリケーションがWiFi接続にアクセスできることを確認し、自分のIPアドレスが正しいかどうかを確認し、ファイアウォールをオフにします。私のウイルス対策さえありません。私はまた、私のdevサーバー上でネットワーク探索を有効にしました。
1. 使用プロキシサーバー（ngrok）および編集イオン要求
2. Apacheサーバおよび編集イオン要求
3. 編集イオン要求コードのCORSを有効にします。
   • 192.168.22.4
   • 127.0.0.1:80
   • 127.0.0.1
   • localhost:80
   • localhost
   • 10.0.2.2
   • 10.0.2.2:80
   ：私は、に変更192.168.22.4:80に試してみました

この問題が発生した人は誰ですか？

Answer 1

問題が解決しました。 私はでそれを解決した：<ポート番号>：WAMPは< IPアドレス>に耳を傾けてください

1. 。最初はデフォルトで0.0.0.0:80に設定されていました。設定するには、Wampサーバーのhttpd.confを更新してから、次の行を追加してください： Listen 192.168.22.4:80
2. 私のionicプロジェクトにcordova-plugin-whitelistをインストールしてください。これを行うには、私が実行する必要があります。 cordova plugin add cordova-plugin-whitelist --save

3. 編集を私のイオンのコードと要求にポート番号を削除：

   let headers = new Headers(); 
       headers.append('Content-Type','application/json'); 
   
       this.http.post("http://192.168.22.4/api-user-create", JSON.stringify(this.postData), {headers: headers}).subscribe(res => { 
       console.log(res.json()); 
       this.showAlert(); 
       }, (err) => { 
       console.log(err); 
       }); 
   

4. アプリケーション

を再構築し、実行して読むIonic App - No Internet Access詳細については。