Socket.io-client: react-nativeのsocket.io-client経由で接続できません

作成日 2018年10月31日  ·  37コメント  ·  ソース: socketio/socket.io-client

You want to:あなたはしたい:

  • [x] report a bug [x]バグを報告する
  • [ ] request a feature []機能をリクエストする

Current behaviour現在の動作

I can't connect via socket io to my server, it times out.ソケットioを介してサーバーに接続できません。タイムアウトします。

Steps to reproduce (if the current behaviour is a bug)再現手順(現在の動作がバグの場合)

In react-native:反応ネイティブの場合:

import io from 'socket.io-client';


const BACKEND = 'my socketio server url'

const sock = io(BACKEND, { transports: ['websocket'], forceNew: true });
sock.on('connected', () => {
  debugger;
})

The debug logs look like:デバッグログは次のようになります。

socket.io-client:url parse <my url> +0ms
browser.js:133 socket.io-client ignoring socket cache for <my url> +0ms
browser.js:133 socket.io-client:manager readyState closed +0ms
browser.js:133 socket.io-client:manager opening <my url> +1ms
browser.js:133 engine.io-client:socket creating transport "websocket" +0ms
browser.js:133 engine.io-client:socket setting transport websocket +3ms
browser.js:133 socket.io-client:manager connect attempt will timeout after 20000 +6ms
browser.js:133 socket.io-client:manager readyState opening +2ms
socket.io-client:manager connect attempt timed out after 20000 +20s
browser.js:133 engine.io-client:socket socket close with reason: "forced close" +20s
browser.js:133 engine.io-client:socket socket closing - telling transport to close +2ms
browser.js:133 socket.io-client:manager connect_error +3ms
browser.js:133 socket.io-client:manager cleanup +1ms
browser.js:133 socket.io-client:manager will wait 899ms before reconnect attempt +1ms
browser.js:133 socket.io-client:manager attempting reconnect +912ms

Note : the best way (and by that we mean the only way ) to get a quick answer is to provide a failing test case by forking the following fiddle .:迅速な回答を得るための最良の方法(そしてそれが唯一の方法を意味します)は、次のフィドルをフォークして失敗したテストケースを提供することです。

Expected behaviour期待される動作

I expect to be able to connect to my socketio server, the same way I am able to in a web browser. Webブラウザーで接続できるのと同じ方法で、socketioサーバーに接続できることを期待しています。

Setup設定

  • OS: iOS iPhone 10 simulator OS:iOSiPhone10シミュレーター
  • browser: React-nativeブラウザ:React-native
  • socket.io version: 2.1.1 socket.ioバージョン:2.1.1
en

最も参考になるコメント

Finally found a solution for React Native >= 0.60 after a couple of coffees and digging deep into engine.io - additional to a version conflict (with RN) there seems to be an issue with passing in the URI.最後に、コーヒーを数杯飲んでengine.ioを深く掘り下げた後、React Native> = 0.60の解決策を見つけました-バージョンの競合(RNとの)に加えて、URIの受け渡しに問題があるようです。 When I pass an URI into socketIO, it gets turncated to the host and 'socket.io' appened. URIをsocketIOに渡すと、ホストにターンケートされ、「socket.io」が追加されます。 So socketIO("https://foo.bar/my/endpoint/socket.io") will lead to socketIO trying to connect to https://foo.bar/socket.io without showing it in the logs when throwing the xhr pull / socket error.したがって、 socketIO("https://foo.bar/my/endpoint/socket.io")は、xhr pull / socketエラーをスローしたときに、socketIOがhttps://foo.bar/socket.ioに接続しようとして、ログに表示されないようにします。

Here we go, how to get socket.io running on current versions of React Native :次に、 ReactNativeの現在のバージョンでsocket.ioを実行する方法を説明します

  • use socket.io-client version _2.1.1_ socket.io-clientバージョン_2.1.1_を使用します
// package.json
{
  "dependencies": {
     "socket.io-client": "2.1.1"
   }
}
  • when setting up the client, define a host and a pathクライアントを設定するときは、ホストパスを定義します
const socket = socketIO('https://your.host.com/', {
  path: '/path/to/socket.io/'
})
  • and suddenly everything works as smooth as planedそして突然、すべてが計画どおりにスムーズに機能します

Hope to have saved you the time I spent on this issue 😆私がこの問題に費やした時間を節約できたことを願っています😆

en

全てのコメント37件

Looks like this is react-native's issue.これはreact-nativeの問題のようです。 Earlier versions of RN seem to work with socket.io, but 0.0.57 does not.以前のバージョンのRNはsocket.ioで動作するようですが、0.0.57は動作しません。 Closing.閉鎖。

en

Try "socket.io-client": "2.0.4" 「socket.io-client」を試してください:「2.0.4」
This may be socket.io bugこれはsocket.ioのバグである可能性があります

en

Try "socket.io-client": "2.0.4" 「socket.io-client」を試してください:「2.0.4」
This may be socket.io bugこれはsocket.ioのバグである可能性があります

Yes it does work.はい、動作します。

en

RN0.52とsocket.io-client2.0.4では、まだこの問題に直面しています。

en

@noahprince22 can you please share your configuration ? @ noahprince22設定を共有していただけますか?
I am currently using this and the issue still persist.私は現在これを使用していますが、問題はまだ解決していません。

"react-native": "0.55.4",
"react": "16.3.1",
"socket.io-client": "^2.0.4",
"socket.io: "^2.2.0" //server side
en

any workaround?回避策はありますか?

socket.io team please, this should work with RN, is a socket.io bug. socket.ioチームにお願いします。これはRNで動作するはずですが、socket.ioのバグです。

en

Hi @ningacoding , I managed to get it working with this configurationこんにちは@ningacoding 、私はそれをこの構成で動作させることができました

"react-native": "0.55.4",
"react": "16.3.1",
"socket.io-client": "^2.0.4",
"socket.io: "^1.0.0" //server side

In your react-native app use thisあなたのreact-nativeアプリでこれを使用してください

const socket = io(BASE_URL, {
    secure: true,
    transports: ['websocket'],
  });
en

"react-native": "0.58.6", "react-native": "0.58.6"、
"react": "16.6.3", "react": "16.6.3"、
"socket.io-client": "^2.0.4", "socket.io-client": "^ 2.0.4"、

Not working for me私のために働いていない

en

any solution?解決策はありますか? I'm facing the same thing私は同じことに直面しています

en

I have long since stopped working on the project that I was having this issue with.私は長い間、この問題を抱えていたプロジェクトでの作業をやめました。 If I remember correctly, I downgraded react-native to "solve' the problem.私が正しく覚えていれば、問題を「解決」するために、react-nativeをダウングレードしました。

en

Experiencing the same issue, has there been a fix yet?同じ問題が発生しましたが、まだ修正されていますか? Anyone find any workarounds to implementing sockets in React Native? React Nativeでソケットを実装するための回避策を見つけた人はいますか?

en

@russellgoldman I had problems with RN 0.60.5 and socket.io. @russellgoldmanRN0.60.5とsocket.ioで問題が発生しました。 Release build did not connect to the server.リリースビルドがサーバーに接続しませんでした。

None of socket.io versions worked with RN 0.60.5: I tried versions 2.0.4, 2.1.1, 2.2.0. socket.ioバージョンはどれもRN0.60.5で動作しませんでした:バージョン2.0.4、2.1.1、2.2.0を試しました。

Downgrading to RN 0.59.10 solved my problem. RN 0.59.10にダウングレードすると、問題が解決しました。

en

Hi @anttirauh and @russellgoldman ,こんにちは@anttirauh@russellgoldman
I tried with RN 0.59.10 and Socket 2.0.4, but its not connecting on release build. RN0.59.10とSocket2.0.4で試しましたが、リリースビルドで接続されません。
Can you please help me?手伝ってくれませんか?

en

@Ramesh21071993socket.ioをバージョン2.1.1にアップグレードする必要があると思います。

en

@anttirauh , i tried with all these versions socket io (2.0.4, 2.1.1, 2.2.0) and react-native versions (0.60, 0.59.10, 0.59.4) @anttirauh 、私はこれらすべてのバージョンのソケットio(2.0.4、2.1.1、2.2.0)とreact-nativeバージョン(0.60、0.59.10、0.59.4)で試しました
In server side also socket io 2.0.4.サーバー側でもソケットio2.0.4。
still that same issue sir,それでも同じ問題です、

But it works on RN 0.55.4ただし、RN0.55.4では機能します

en

@Ramesh21071993 My understanding (which is formed with heavy googling and own testing) is that: @ Ramesh21071993私の理解(これは重いグーグルと独自のテストで形成されています)は次のとおりです。

  • socket.io stopped working with react-native about around RN version 0.57.4 socket.ioは、RNバージョン0.57.4前後でreact-nativeでの動作を停止しました
  • socket.io or some other component was fixed later and I managed to get it working with version combo: RN 0.59.10 + socket.io 2.1.1 socket.ioまたはその他のコンポーネントは後で修正され、バージョンコンボで動作させることができました:RN 0.59.10 + socket.io 2.1.1
  • RN version 0.60.x is not working with any version of socket.io RNバージョン0.60.xは、どのバージョンのsocket.ioでも機能しません

So my advice is only: try one time more with RN 0.59.10 and socket.io 2.1.1 and make sure that you clear build folder before building.したがって、私のアドバイスは次のとおりです。RN0.59.10とsocket.io 2.1.1を使用してもう一度試して、ビルドする前にビルドフォルダをクリアしてください。 And remove node_modules before yarn/npm.そして、yarn/npmの前にnode_modulesを削除します。

en

@anttirauh Sir, below is my package.json. @anttirauhサー、以下は私のpackage.jsonです。 I did as what you told.私はあなたが言ったこと通りにやりました。 But nothing happen.しかし、何も起こりません。 I remove build folder and node modules and again i install.ビルドフォルダとノードモジュールを削除して、再度インストールします。
Please help me on this to work, Past one month am tryingこれが機能するように私を助けてください、過去1ヶ月は試しています

App package.jsonアプリpackage.json

{ {{
"name": "Track", "名前": "トラック"、
"version": "0.0.1", 「バージョン」:「0.0.1」、
"private": true, 「プライベート」:true、
"scripts": { "スクリプト":{
"start": "node node_modules/react-native/local-cli/cli.js start", "start": "node node_modules / react-native / local-cli / cli.js start"、
"test": "jest" 「テスト」:「ジェスト」
}, }、
"dependencies": { 「依存関係」:{
"react": "16.8.3", "react": "16.8.3"、
"react-native": "0.59.10", "react-native": "0.59.10"、
"socket.io": "2.1.1" "socket.io": "2.1.1"
}, }、
"devDependencies": { "devDependencies":{
"@babel/core": "^7.6.2", "@ babel / core": "^ 7.6.2"、
"@babel/runtime": "^7.6.2", "@ babel / runtime": "^ 7.6.2"、
"babel-jest": "^24.9.0", "babel-jest": "^ 24.9.0"、
"jest": "^24.9.0", "jest": "^ 24.9.0"、
"metro-react-native-babel-preset": "^0.56.0", "metro-react-native-babel-preset": "^ 0.56.0"、
"react-test-renderer": "16.8.3" "react-test-renderer": "16.8.3"
}, }、
"jest": { 「冗談」:{
"preset": "react-native" 「プリセット」:「react-native」
} }
} }

Server Package.jsonサーバーPackage.json

{ {{
"name": "TRACK-Socket", "名前": "TRACK-ソケット"、
"version": "0.0.1", 「バージョン」:「0.0.1」、
"dependencies": { 「依存関係」:{
"amqplib": "^0.5.1", "amqplib": "^ 0.5.1"、
"config": "^3.2.2", "config": "^ 3.2.2"、
"express": "^4.15.3", "エクスプレス": "^ 4.15.3"、
"socket.io": "^2.1.1", "socket.io": "^ 2.1.1"、
"ws": "^7.1.2" "ws": "^ 7.1.2"
} }
} }

Thanksありがとう

en

Finally found a solution for React Native >= 0.60 after a couple of coffees and digging deep into engine.io - additional to a version conflict (with RN) there seems to be an issue with passing in the URI.最後に、コーヒーを数杯飲んでengine.ioを深く掘り下げた後、React Native> = 0.60の解決策を見つけました-バージョンの競合(RNとの)に加えて、URIの受け渡しに問題があるようです。 When I pass an URI into socketIO, it gets turncated to the host and 'socket.io' appened. URIをsocketIOに渡すと、ホストにターンケートされ、「socket.io」が追加されます。 So socketIO("https://foo.bar/my/endpoint/socket.io") will lead to socketIO trying to connect to https://foo.bar/socket.io without showing it in the logs when throwing the xhr pull / socket error.したがって、 socketIO("https://foo.bar/my/endpoint/socket.io")は、xhr pull / socketエラーをスローしたときに、socketIOがhttps://foo.bar/socket.ioに接続しようとして、ログに表示されないようにします。

Here we go, how to get socket.io running on current versions of React Native :次に、 ReactNativeの現在のバージョンでsocket.ioを実行する方法を説明します

  • use socket.io-client version _2.1.1_ socket.io-clientバージョン_2.1.1_を使用します
// package.json
{
  "dependencies": {
     "socket.io-client": "2.1.1"
   }
}
  • when setting up the client, define a host and a pathクライアントを設定するときは、ホストパスを定義します
const socket = socketIO('https://your.host.com/', {
  path: '/path/to/socket.io/'
})
  • and suddenly everything works as smooth as planedそして突然、すべてが計画どおりにスムーズに機能します

Hope to have saved you the time I spent on this issue 😆私がこの問題に費やした時間を節約できたことを願っています😆

en

@rastapasta , i got an error like “ CLEARTEXT communication not permitted by network security policy ”, @rastapasta 、「ネットワークセキュリティポリシーで許可されていないCLEARTEXT通信」のようなエラーが発生しました。

Please tell me what to doどうしたらいいか教えてください

en

@Ramesh21071993 if you can't use your endpoint via https (please consider it), add their hostnames to the exception lists. @ Ramesh21071993 https経由でエンドポイントを使用できない場合(検討してください)、ホスト名を例外リストに追加してください。

for iOS: https://stackoverflow.com/a/30732693 iOSの場合: https ://stackoverflow.com/a/30732693
for Android: https://stackoverflow.com/a/50834600 Androidの場合: https ://stackoverflow.com/a/50834600

en

Sir, I tried that also but not able to do.サー、私もそれを試しましたが、できませんでした。 If you don't mind can you please give me any demo source filesよろしければ、デモソースファイルを教えてください。
For long time I struck with this.長い間、私はこれにぶつかりました。

Am using ip and port sir ipとportsirを使用しています

en

上記のドキュメントの指示に従い、この実装を適応させます。

import socketIO from 'socket.io-client'
const socket = socketIO('http://8.8.8.8:3000/', {
  path: '/your/path/to/socket.io/'
  reconnectionDelay: 1000,
  reconnection: true,
  reconnectionAttempts: Infinity,
  jsonp: false
})

socket.on('connect', () => console.log('connected'))
socket.on('error', console.error)
socket.on('connect_error', console.error)
en

サー、サーバー側でソケットio 2.1.1を使用していますが、大丈夫ですか、それとも何か変更する必要がありますか

en

image

en

rnのwhazzupを見つける@Lizhoohハッキーな方法: node_modules engine.io-client/blob/master/lib/transports/self.onError $の前にconsole.log(err)をモンキーパッチしますポーリング-xhr.js#L131

en

@Ramesh21071993 Is your issue resolved? @ Ramesh21071993問題は解決しましたか? I am facing the same issue.私は同じ問題に直面しています。 Tried everything mentioned in above comments.上記のコメントに記載されているすべてを試しました。

en

@rastapasta I followed what you have suggested above. @rastapasta私はあなたが上で提案したことに従いました。 My socket connection happens and then immediately disconnects.ソケット接続が発生し、すぐに切断されます。 I get timeout error infinitely.タイムアウトエラーが無限に発生します。 However, whenever I click on some component which makes a network call, the socket connects and immediately disconnects.ただし、ネットワーク呼び出しを行うコンポーネントをクリックすると、ソケットが接続され、すぐに切断されます。 If I don't do any network call after first socket disconnect, it would stay in the same state.最初のソケット切断後にネットワーク呼び出しを行わないと、同じ状態のままになります。 Please, could you help?お願いします、手伝ってもらえますか?

socket = io('http://IP:31515', {ソケット=io('http:// IP:31515'、{
path: '/socketio', //I have given this is the path in my socket server as well as my kubernetes ingress file to route to that port path:'/ socketio'、//これは、ソケットサーバーとそのポートにルーティングするkubernetes入力ファイルのパスです。
transports: ['websocket'],トランスポート:['websocket']、
reconnectionDelay: 1000, reconnectionDelay:1000、
reconnection: true,再接続:true、
reconnectionAttempts: Infinity, reconnectionAttempts:Infinity、
// timeout: 30000, //タイムアウト:30000、
jsonp: false jsonp:false
}); });

things that I have tried:私が試したこと:

  1. removing and adding transports optionトランスポートオプションの削除と追加
    2.removing and add timeout 2.タイムアウトの削除と追加
  2. removing all parameters except pathパスを除くすべてのパラメータを削除する
  3. adding pingTimeout and pingInterval in server socket configurationサーバーソケット構成にpingTimeoutとpingIntervalを追加する
  4. removing path from server and client and only keeping it in my kubernetes ingress file to route to that deployment/pod.サーバーとクライアントからパスを削除し、それをkubernetes入力ファイルに保持してそのデプロイ/ポッドにルーティングするだけです。

Note: the same server and kubernetes conf work for any node.js socket client as well as my react js web app.注:同じサーバーとkubernetes confは、すべてのnode.jsソケットクライアントと私のreactjsWebアプリで機能します。 I am only facing this issue for React Native app in debug as well as release mode.この問題は、デバッグモードとリリースモードのReactNativeアプリでのみ発生します。

en

誰かが私の上記の問題について何か考えを持っていますか?

en

@calqlum123 @ calqlum123
Please make sure to必ず

  • add your host to the transport exception list (s. here )ホストをトランスポート例外リストに追加します(ここにあります
  • try it without manually defining the transportsトランスポートを手動で定義せずに試してください
  • monkey patch the console.log (s. here ) and check the error console.log( s。here )にモンキーパッチを適用し、エラーを確認します
en

Can anyone please share a complete working example for both client and server?誰かがクライアントとサーバーの両方の完全な実例を共有できますか? Because this is confusing.これは紛らわしいからです。

en

I am using "react-native": "0.61.5" and "socket.io-client": "^2.1.1",私は「react-native」:「0.61.5」と「socket.io-client」:「^2.1.1」を使用しています。

below is my code以下は私のコードです

const socket = SocketIOClient('http://192.168.0.101:1234',{reconnect: true}); socket.connect(); socket.once("connect", () => { console.log("[CLIENT] Connected to remote server, identificating."); // this.sendIdentification(); }); socket.on('connect', () => { console.log('connected to socket server'); });

The code is not able to connect to the server and I am also looking for the solution.コードがサーバーに接続できず、解決策も探しています。 I don't want to downgrade my react-native version. react-nativeバージョンをダウングレードしたくありません。

en

you must add this code in application tagこのコードをアプリケーションタグに追加する必要があります
like below in AndroidManifest.xml以下のAndroidManifest.xmlのように
. . .

en

I am using "react-native": "0.61.5" and "socket.io-client": "^2.1.1",私は「react-native」:「0.61.5」と「socket.io-client」:「^2.1.1」を使用しています。

below is my code以下は私のコードです

const socket = SocketIOClient('http://192.168.0.101:1234',{reconnect: true}); socket.connect(); socket.once("connect", () => { console.log("[CLIENT] Connected to remote server, identificating."); // this.sendIdentification(); }); socket.on('connect', () => { console.log('connected to socket server'); });

The code is not able to connect to the server and I am also looking for the solution.コードがサーバーに接続できず、解決策も探しています。 I don't want to downgrade my react-native version. react-nativeバージョンをダウングレードしたくありません。

Can you try "ws://192.168.0.101:1234", instead of " http://192.168.0.101 :1234" http://192.168.0.101:1234 」の代わりに「ws://192.168.0.101:1234」を試してみてください

en

@ Unforgiven-wanda React Nativeの例がここに追加されました: https ://github.com/socketio/socket.io/tree/master/examples/react-native

en

「socket.io-client」に接続できません:reactnativeの「^3.0.4」

en

@chiragpurohit71085 have you checked the example there: https://github.com/socketio/socket.io/tree/master/examples/react-native? @ chiragpurohit71085そこで例を確認しましたか: https://github.com/socketio/socket.io/tree/master/examples/react-native?

I think that this is a problem of URL, could you please check if your server is reachable at http://192.168.x.y:z ?これはURLの問題だと思いますが、サーバーがhttp://192.168.x.y:zで到達可能かどうかを確認してください。

en
このページは役に立ちましたか?
0 / 5 - 0 評価