是否可以将React Native与socket.io结合使用

  • Z时代
  • 2024-01-10
  • 分类：问答

我正在使用Phonegap + React.js和Socket.io开发一个应用程序。但是，随后React-Native发行了，其原生感觉很棒。

我试图让socket.io-client与React

Native一起工作，但是不幸的是没有成功。我做了一些研究，发现与此问题中描述的错误完全相同：https : //github.com/facebook/react-

native/issues/375

关于此问题的评论说，尝试使用fetch API来获取JS模块，但我认为我做错了：

var socketScript;    
fetch('https://cdn.socket.io/socket.io-1.2.0.js')
    .then(function(response) {
        socketScript = response._bodyText;
    }).done(function() {
        var socket = socketScript.io();
    });

这将返回 。

有什么方法可以使socket.io-client与React Native一起工作？还是我看错了方向？也许还有其他更合适的解决方案？

回答：

对于像我这样的人，在此问题上tum绊绊，寻找如何将socket.io与react native集成在一起。

由于React Native短时间内支持websocket，因此您现在可以使用Socket.io轻松地设置Web套接字。您要做的只是以下内容

  1. npm install socket.io-client

  2. 首次进口本机

  3. 分配 window.navigator.userAgent = 'react-native';

  4. 导入socket.io-client / socket.io

  5. 在构造函数中分配 this.socket = io('localhost:3001', {jsonp: false});

因此，在npm安装socket.io-client之后，它看起来应该像这样：

import React from 'react-native';
// ... [other imports]
import './UserAgent';
import io from 'socket.io-client/socket.io';
export default class App extends Component {
  constructor(props) {
    super(props);
    this.socket = io('localhost:3001', {jsonp: false});
  }
  // now you can use sockets with this.socket.io(...)
  // or any other functionality within socket.io!
  ...
}

然后在“ UserAgent.js”中：

window.navigator.userAgent = 'react-native';

注意：因为悬挂了ES6模块的导入，所以我们不能在与react-native和socket.io导入相同的文件中进行userAgent分配，因此是单独的模块。

编辑：

上面的解决方案应该可以，但是在这种情况下，请不要尝试创建单独的socketConfig.js文件。在其中导入任何需要的东西，包括const io =

require('socket.io-client/socket.io');并且window.navigator.userAgent = 'react-

native';需要socket.io-

client之前。然后，您可以在此处连接套接字，并将所有侦听器放在一个位置。然后，可以将操作或功能导入配置文件，并在侦听器接收数据时执行。

以上是 是否可以将React Native与socket.io结合使用 的全部内容， 来源链接： utcz.com/qa/424020.html

回到顶部