webdevqa.jp.net

ネットワーク応答タイムアウトエラー(create-react-native-app)(expo)

Androidのexpoアプリでcreate-react-native-appを実行しようとしています。

まず、コマンドを書いてプロジェクトを作成しました

create-react-native-appテスト

それから私は実行しました

npm start

その後、expoアプリからqrコードをスキャンしました。

しかし、QRコードをスキャンした後、次のエラーが発生しています:

Uncaught Error: Java.net,sockettimeoutException: failed to connect to after 10000ms

enter image description here

Githubの問題:

https://github.com/react-community/create-react-native-app/issues/144#issuecomment-296631692

36
YaSh Chaudhary

これは、マシンからポートを開かないためです。

Ubuntu Run Inターミナルで

Sudo ufw status verbose 19000ポートが開いていない場合に開いているポートを表示するには、次を使用してポートを開く必要があります。

Sudo ufw allow 19000/tcp

そして、再び実行します

Sudo ufw allow 19001/tcp

ネイティブに反応するためにhttpを提供するには、この方法を使用してubuntuでこの問題を解決します。これがあなたのお役に立てば幸いです。

TCPアクセス用にWindowsファイアウォールのポートを開くにはStartメニューで、Runをクリックし、WF.mscをクリックし、OKをクリックします。

セキュリティが強化されたWindowsファイアウォール左ペインで、インバウンドルールをクリックし、アクションウィンドウでNew Ruleをクリックします。

Rule Typeダイアログボックスで、Portを選択し、Nextをクリックします。

Protocol and Portsダイアログボックスで、TCPを選択します。 Specific local portsを選択し、19000などのReactポートのインスタンスのポート番号を入力しますデフォルトのインスタンスの場合。 Nextをクリックします。

アクションダイアログボックスで、接続を許可を選択し、次へ

Profileダイアログボックスで、データベースエンジンに接続するときのコンピューター接続環境を記述するプロファイルを選択し、Next

Nameダイアログボックスで、このルールの名前と説明を入力し、Finishをクリックします。

同様に、ポート19001も開くことができます。

43
manoj

私の場合、ファイアウォールの設定だけではできませんでした。私の問題は、VirtualBoxネットワークデバイスが優先され、Expoホストが間違ったネットワークで起動していたことです。

Windowsでは、ipconfigを実行して、使用しているネットワークアダプターを確認できます。 npm/yarn startは、そのリストで最初に表示されるものをすべて使用するようです。

私はここからこれについて知りました: https://github.com/react-community/create-react-native-app/issues/6

リスト内の他のネットワークアダプターが必要ない場合は、コントロールパネルの[ネットワーク接続]インターフェイスでそれらを無効にできます。

これらの接続およびを使用する必要がある場合は、Expoを使用して問題を解決します このプロセス

  1. ジャンプコントロールパネル>ネットワークとインターネット>ネットワーク接続
  2. 目的の接続(優先度の高い接続)を右クリックします
  3. [プロパティ]> [インターネットプロトコルバージョン4]をクリックします
  4. [プロパティ]> [詳細]をクリックします
  5. 「自動メトリック」のチェックを外します
  6. 「インターフェースメトリック」に10を入力します
  7. OKをクリック

優先度の低い接続についても繰り返しますが、今回は「インターフェースメトリック」に20を入力します

これで、優先度の高い接続をデフォルトとして使用します。

43
IronSean

それを回避するには、ラップトップのIPアドレスを静的IPに修正します(たとえば、192.168.1.69)。次に、次を使用して、反応するネイティブパッケージャーのIPアドレスをラップトップのIPアドレスに変更する必要があります。

set REACT_NATIVE_PACKAGER_HOSTNAME=192.168.1.69 (Windows)
REACT_NATIVE_PACKAGER_HOSTNAME=192.168.1.69 (Mac & Linux)

プロジェクトを再度開始すると、準備完了です。

21
Youcef Chihi

enter image description here

まず、未使用のネットワーク接続を無効にします。私の場合、それはVirtualBoxでした。おそらく同じポートを使用しているのでしょう。私はそれについて確信がありません。未使用の接続を無効にした後、パッケージャを再起動します。 npmを使用した場合は、次を入力します

npm start
5
  • IPv4アドレスが見つかりました
  • expoアプリを開き、タップして下からボタンを探索します
  • exp:// [ipv4adress]:19000を検索バーに書き込みます
  • その後、アプリが開きます
4
asynk1

windowsで

  1. コマンドプロンプトでipconfigを実行します

  2. ip4アドレスを取得してコピーします。

行くより

  1. このPC>プロパティ>高度なシステム設定>環境変数
  2. 次のシステム変数を追加します:REACT_NATIVE_PACKAGER_HOSTNAME
  3. 変数の値として、ip4を貼り付ける必要がありました。

npm startを実行します

3
Ragulan

ネイティブに反応するためにexpoアプリケーションをインストールすることをお勧めします。リンクは 公式ガイドはこちら

npm install -g exp

次に、Genymotionソフトウェアを使用して、実行するアプリのさまざまな環境設定をエミュレートできます。

exp start

ターミナルで「npm start」を使用してネイティブのリアクションを使用する場合、次のようになります。アプリケーションがコンピューターのIpVアドレスを正常に実行すると、ターミナルに表示されるものとExpoアプリ上にあるものが同一であることがわかりました。たとえば、

ipconfig -> IPv4 Address. . . . . . . . . . . : 10.0.0.124
exp://10.0.0.124:19000

この観察に基づいて、次の方法でこの問題を解決しました。

  1. アプリを実行しているnpmプロンプトスクリプトを閉じます
  2. Expoアプリを閉じる
  3. ターミナルでコマンドを実行してIPを見つけます:

    ipconfig
    
  4. IPを使用してNodeJSコマンドプロンプトでコマンドを実行します(たとえば10.0.0.124)

    set REACT_NATIVE_PACKAGER_HOSTNAME=10.0.0.124
    
  5. Expoアプリを起動し、バーコードをスキャンします

    npm start
    

    解決しない場合は、他の合理的な努力に加えて、React開発者が推奨する次の手順を使用します。

  6. VirtualBoxでGenymotionをインストールする
  7. Genymotionサイトでサインアップ
  8. Genymotionソフトウェアを実行して!!! SignIn
3
Roman

誰かがまだ答えを探している場合に備えて。最初に基本的なことを行い、最初にネットワーク構成を開いてVirtualBox Host-Only Networkを無効にします。これは私のために働いた。

3
Nouman Ghaffar

コンテキストで言及されていることはすべて完了しました。接続したWiFiネットワークをパブリックからプライベートに変更しました。これは私のために働いた

2
Raj

開発にgit bashを使用している場合、Icruz4によるこのソリューションが役立ちます

の代わりに

set REACT_NATIVE_PACKAGER_HOSTNAME

つかいます:

export REACT_NATIVE_PACKAGER_HOSTNAME='192.168.1.123'

注意:

走るとき

npm start

Expoは、出力で使用しているIPを示します。そのIPが必要なIPでない場合、

REACT_NATIVE_PACKAGER_HOSTNAME

環境変数が正しく設定されていません

2
Hargun Singh

他の回答が示唆するすべてを試してもまだ機能しない場合は、コンピューターと電話が同じWIFIネットワークに接続されていることも確認してください。私にとってこれは1時間の無駄です。

1
Shaswat Rungta

私は答えを探して丸一日を無駄にし、最終的に私は誤って解決策を得た。接続をLANからトンネルに変更するだけ

以下は画像です、

enter image description here

1
ashish pandey

同じ問題が発生しました。問題は、コマンドyarn startまたはnpm startが、最初に有効になったネットワークアダプターを見つけることで、これはたまたま自分(および他の多くのマシン)のVirtualBoxのアダプターです。解決策は次のいずれかです。

rEACT_NATIVE_PACKAGER_HOSTNAME環境変数を手動で設定するか、Windowsのネットワーク接続で未使用のネットワークアダプターを無効にします(画像を参照)問題は、Expoがインターネット接続を提供するアクティブなネットワークアダプターではなく、最初のネットワークアダプターを見つけることです。

enter image description here

私の場合、Expo Androidアプリには「他のアプリの上に描画する "- 許可そして私はそれを与えなかった。だから私はExpoアプリにこの許可を与え、問題は解決した。

1
Moein Fazeli

この問題は次の方法で解決できる可能性があります。

環境変数の設定 代替手順 here

または

ネットワークアダプターのインターフェイスマトリックスの優先度の割り当て 詳細な指示 here または here .

または

buntuマシンはポートを開けません

変更を行った後、動作するかどうかをテストする前にコンピューターを再起動してください。

幸運を!

1
psyanite

最もシンプルで100%実用的なソリューションの1つは次のとおりです。

  1. 開発マシンのモバイルホットスポットを有効にします(PCまたはデスクトップ)およびAndroidを接続しますこのホットスポットを持つdevice
  2. [コントロールパネル]> [ネットワークとインターネット]> [ネットワーク接続]に移動します。次のように表示されます。 ネットワーク接続設定
  3. 次に、ローカルエリア接続(あなたのデスクトップホットスポット)のIPアドレスを目的のアドレスに設定します。たとえば、関連する接続を右クリックして192.168.1.69プロパティ->インターネットプロトコルバージョン4(TCP/IPv4)->プロパティをクリックします。次に、この接続の優先度を最高に設定します。これは最もよく説明されています here
  4. 次に、コマンドターミナルを開き、次を実行します。

    set REACT_NATIVE_PACKAGER_HOSTNAME=192.168.1.69 (Windows)
    REACT_NATIVE_PACKAGER_HOSTNAME=192.168.1.69 (Mac & Linux)
    
  5. 次に、expoプロジェクトフォルダーでnpm startを実行してexpoサーバーを再起動し、生成されたファイルをスキャンしてAndroidデバイスでアプリを実行しますexpoアプリでのQRコード。

私は多くの解決策を試しましたが、この方法だけがこの問題を解決するのに役立ちました:

Windowsの場合:

  • ウィンドウのコントロールパネルの[ネットワークと接続]に移動します(ネットワークと共有センター>アダプター設定の変更)
  • ここに表示されるすべての仮想ボックスを無効にします
  • Npmまたはyarnまたはexpoを再起動します...
0
Ali Tavana
  1. デバイスで:expoアプリにログインし、アカウントがない場合はアカウントを作成します。
  2. あなたのシステムで:ターミナルを開いて、cdコマンドでプロジェクトディレクトリに移動し、Sudo exp startと入力すると、expoアカウントのログイン詳細が表示されます。
  3. スキャンするqrコードが表示されます。
0
Suraj Vaishnav

Window Firewallでポートを開くだけで、すべてが機能するはずです。

1. [スタート]メニューの[ファイル名を指定して実行]をクリックし、WF.mscと入力して[OK]をクリックします。

セキュリティが強化されたWindowsファイアウォールの左側のウィンドウで、[受信の規則]を右クリックし、操作ウィンドウで[新しい規則]をクリックします。

[ルールの種類]ダイアログボックスで、[ポート]を選択し、[次へ]をクリックします。

[プロトコルとポート]ダイアログボックスで、[TCP]を選択します。 [特定のローカルポート]を選択し、Reactポートのインスタンスのポート番号を入力します(既定のインスタンスの場合は19000など)。次へをクリックします。

[アクション]ダイアログボックスで、[接続を許可する]を選択し、[次へ]をクリックします。

[プロファイル]ダイアログボックスで、データベースエンジンに接続するときのコンピューター接続環境を説明するプロファイルを選択し、[次へ]をクリックします。

[名前]ダイアログボックスで、このルールの名前と説明を入力し、[完了]をクリックします。

同様に、ポート19001も開くことができます。

0
user3109814

Windowsでは、

set REACT_NATIVE_PACKAGER_HOSTNAME=my-ip-address

git bashターミナル内で動作しましたが、cmdでは動作しませんでした。 git bashで、npm startを実行した後、ファイアウォールのポップアップが表示されたので、それをクリックして許可をクリックしました。

0