Socket.io-client: 2.2 版不适用于本机反应

创建于 2018-12-21  ·  32评论  ·  资料来源: socketio/socket.io-client

恢复到 2.1.1 解决了这个问题。

我怀疑这与新的 cors 管理变更有关。
手动设置原点似乎没有任何作用。

它在启动 React Native 调试器时神奇地开始工作。

配置

reconnection: true,
reconnectionDelay: 500,
jsonp: false,
reconnectionAttempts: Infinity,
transports: ['websocket']

设置

  • 操作系统:iOS
  • 浏览器:react-native
  • socket.io 版本:2.2.0

最有用的评论

似乎没有什么可以使用 react native 0.60

所有32条评论

在两个平台(模拟器)2.1.1 上都遇到了同样的问题,它只适用于打开调试器。

我也面临这个问题。 我升级以查看它是否修复了我的第一个连接延迟问题。

我也面临同样的情况。 问题

恢复到 2.1.1 对我有用。

我仍然面临同样的问题,恢复 2.1.1 也不适合我。

它应该由https://github.com/socketio/engine.io-client/pull/607修复

@benhjames你能确认你的修复已经解决了 React Native 中的问题吗?

是的,我目前在 React Native 上运行[email protected] (已经拉入[email protected] )没有问题。

值得检查以确保您的engine.io-client是 3.3.2,因为它包含针对 websockets 的 React Native 修复。 😃

@benhjames @darrachequesne我用过套接字。 [email protected] (已拉入[email protected])并仍然验证node_modules中的更改,它对我不起作用。

`从'socket.io-client'导入io;

导出默认类 HomeScreen 扩展 React.Component {
构造函数(道具){
超级(道具);
this.socket = io('ws://192.168.0.107:8080/endpoint',{
重新连接:真的,
重新连接延迟:500,
jsonp: 假,
重新连接尝试:无限,
传输:['websocket']
});
this.socket.on('connect_error', (err) => {
控制台日志(错误)
});
}
`

我收到如下错误:
Error: websocket error at WS.Transport.onError (transport.js:67) at WebSocket.ws.onerror (websocket.js:157) at WebSocket.dispatchEvent (event-target.js:172) at WebSocket.js:289 at RCTDeviceEventEmitter.emit (EventEmitter.js:190) at MessageQueue.__callFunction (MessageQueue.js:349) at MessageQueue.js:106 at MessageQueue.__guard (MessageQueue.js:297) at MessageQueue.callFunctionReturnFlushedQueue (MessageQueue.js:105) at debuggerWorker.js:72

在我看来,端点是不正确的 - 它应该是httphttps协议链接,而不是ws一个。 👍

@benhjames我之前尝试过使用 WebSocket API https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API并且它在相同的协议下工作得非常好。

socket.io(与 WebSocket API 不同)仅接受客户端的 HTTP(S) 协议 URI(请参阅此处的文档),但它确实_使用_幕后的 WS 协议。

所以如果你做io('http://192.168.0.107:8080/endpoint', ...)它应该可以工作!

@benhjames感谢您的更新!

我认为ws://应该可以正常工作,但/endpoint意味着您要连接到端点命名空间(这是当前的实现,从 v2.x 开始)。 您可能想要使用:

this.socket = io('ws://192.168.0.107:8080', {
  path: '/endpoint',
  reconnection: true,
  reconnectionDelay: 500,
  jsonp: false,
  reconnectionAttempts: Infinity,
  transports: ['websocket']
});

@darrachequesne我已经尝试过上述实现,但它仍然无法正常工作。

也许看看 SocketIO 服务器代码的样子可能会很有用,只是为了确保它使用正确的命名空间和设置等。🙂

它与 WebSocket API 一起工作得很好,但是当我尝试连接 Socket.io API 时,出现如下错误:

websocket error

Stack trace:
  null:null in WS.Transport.onError
  node_modules/engine.io-client/lib/transports/websocket.js:178:8 in WebSocket.ws.onerror
  node_modules/event-target-shim/lib/event-target.js:172:38 in WebSocket.dispatchEvent
  node_modules/react-native/Libraries/WebSocket/WebSocket.js:289:13 in <unknown>
  node_modules/react-native/Libraries/vendor/emitter/EventEmitter.js:190:32 in RCTDeviceEventEmitter.emit
  node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:349:41 in MessageQueue.__callFunction
  node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:106:11 in <unknown>
  node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:297:8 in MessageQueue.__guard
  node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:105:9 in MessageQueue.callFunctionReturnFlushedQueue
  http://192.168.0.103:19001/debugger-ui/debuggerWorker.js:72:58 in <unknown>

如果它与 WebSocket API 一起使用而没有自定义逻辑来反序列化 socket.io 有效负载,那么这意味着服务器没有使用 socket.io。

您是否有机会从服务器提供一些代码来验证是否是这种情况?

@benhjames没错,我们使用https://docs.oracle.com/javaee/7/api/javax/websocket/package-summary.html作为后端代码。

那这就解释了! Socket.io 需要在_both_客户端和服务器上使用才能工作。 👍

@benhjames @darrachequesne现在我在后端使用 socket.io,它在前端使用 socket.io 使用 vanilla javascript 工作正常,但是当我尝试通过 React Native 连接 socket.io 时,我收到错误:

香草 JS(工作得很好):

```

请看上面的回答!

谢谢, @benhjames的支持,现在可以使用了。 https://github.com/mrniko/netty-socketio/issues/614

无论我选择 websockets 还是轮询,我都有同样的问题。 它要么是 websocket_error 要么是 xhr 轮询错误。

URL 是一个 IP (http://192.168.1.112:3000),我使用 React Native Expo 从物理电话连接到同一本地网络上的计算机。

如果您需要更多堆栈跟踪或信息,我可以提供帮助...

socket.io 2.2.0 // 客户端和服务器
engine.io 3.3.2 // 客户端和服务器

如果 websocket 和轮询传输都不起作用,这听起来像是 socket.io 之外的问题。 您可能想尝试:

  • 在浏览器中使用 socket.io 客户端连接到 React Native 之外的 socket.io 服务器。 如果这也不起作用,那么服务器可能有问题。
  • 向您的服务器发出正常的fetch请求。 如果这不起作用,则可能是网络或 React Native 环境有问题。

要尝试第一个测试,正常的 fetch 工作

编辑:它看起来像一个与 CORS 相关的问题。 如果我尝试连接一个简单的 JS 客户端,我会得到:

Access to XMLHttpRequest at 'http://192.168.1.112:3000/socket.io/?EIO=3&transport=polling&t=MfV8vhI' from origin 'http://192.168.1.112:5000' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

关于如何设置的任何建议?

尝试从 github 上的最新版本,就像这样,解决了我的 RN android 问题:

npm i socketio/engine.io-client#3.3.2 -S

似乎没有什么可以使用 react native 0.60

使用 RN 0.60.5 时,Android 发布版本不起作用

尝试了 socket.io-client 版本 2.0.4、2.1.1、2.2.0。

试过yarn add socketio/engine.io-client#3.3.2

请参阅 #1305 - 在 Android 上,您需要使用 https 或在 AndroidManifest 中设置 usesCleartextTraffic 属性

试试 v2.3

我尝试使用 Expo SDK v34 和 v35 (RN 0.59) 并且不得不像其他版本 (2.1.1, 2.1.0, 2.2.0) 一样将 socket.io-client 降级到 1.7.2 ( yarn add [email protected] )不行。 我没有尝试 2.3.0,现在它可以工作了,我不想麻烦:-)

@lionbur ,我知道有很多 0.59 的迷你版本。 您使用的是哪个版本? 0.59.9?

先感谢您!

此页面是否有帮助?
0 / 5 - 0 等级