Reactjs 如何将socket.io与Heroku部署的React本机应用程序连接？

为了弄明白这一点，我几乎用谷歌搜索过我的手指。似乎很多关于连接socket.io和React Native的现有信息都过时了，或者我只是解释错了

我已经成功连接了客户端（当我连接到我的应用程序时，我会获得客户端控制台日志）。似乎是服务器端给了我问题。为什么从客户端发出的数据在我的终端中没有显示为日志？my server.js中没有任何相关的console.log正在记录，但App.js console.log正在注册

编辑：这是我的完整App.js文件：

import Expo from 'expo';
import React from 'react';
import { Dimensions, StyleSheet, Text, View } from 'react-native';

import store from './src/store';
import { Provider } from 'react-redux';


// window.navigator.useragent = 'react-native'; -> not necessary anymore?



const ROOT_URL = 'https://myherokudomain.herokuapp.com';

const io = require('socket.io-client/dist/socket.io');
const socket = io.connect(ROOT_URL);


socket.on('connect', () => {
     console.log('Connected to server');
});


socket.on('example', (data) => {
    console.log(data);

    socket.emit('my other event', { my: 'data' });
});


socket.on('disconnect', () => {
    console.log('Disconnected from server');
});

export default class App extends React.Component {


render() {

// const MainNavigator = my react-navigation system

return (
  <Provider store={store}>
    <View style={styles.container}>
      <MainNavigator />
    </View>
  </Provider>
  );
 }
}

const config = require('./config/config');
const { mongoose } = require('./db/mongoose');
const express = require('express');

const cors = require('cors');


const app = express();
const port = process.env.PORT;

// ************ Include and use separate routes file
app.use(require('./routes/routes'));
// ************


//Cross-Origin resource sharing. cors library solves CORS problems.
app.use(cors());


//***********
/* Chat server code*/


// enabled heroku session affinity: 
// see https://devcenter.heroku.com/articles/session-affinity
// to enable:   heroku features:enable http-session-affinity
// to diable:   heroku features:disable http-session-affinity

const socketIO = require('socket.io');
const http = require('http');


const server = http.createServer(app);

const io = socketIO(server, { origin: "*:*" });
//********** */


io.on('connection', (socket) => {
    console.log('A client just joined', socket.id);

    socket.emit('example', { hello: 'world' });

    socket.on('my other event', (data) => {
        console.log(data);
    });


    socket.on('disconnect', () => {
        console.log('User was disconnected');
    });
});


server.listen(port, (err) => {
    console.log(`started on port ${port}`);
});



module.exports = { app };

我在客户端很好地获得了控制台日志（例如，当我在expo上打开我的应用程序时，“连接到服务器”和“hello:world”的内容会显示出来。但我没有获得服务器端控制台日志

我做错了什么-如何让socket.io与已部署的React本机应用程序充分协同工作

---

我真的非常感谢任何帮助！我一直被困在这个问题上。

你没有得到服务器端控制台日志，因为1.）他们只在服务器上登录，2.）如果你真的想发回数据，你就没有发出它们

我假设所有的代码都能正常工作，而不是日志记录，因为这就是您要问的全部内容。问题是节点没有输出到浏览器的控制台

---

如果它部署在heroku上，那么你应该看到所有内容都被记录在那里，否则你可以使用库输出到你的浏览器。

请发布你的

App.js

文件。嗨，科林，我刚刚在我的App.js中发布了所有内容（除了我删除了react导航内容以缩短它，因为它不相关）您确定

const socket=io.connect（ROOT\u URL）

是正确的吗？我相信这是正确的，因为ROOT_URL是我的heroku域，当我在手机上打开我的应用程序时，我会看到客户端的“连接到服务器”日志。老实说，我认为你对

socket

和

io

的命名有些混乱。我将再次阅读教程，确保名称正确无误。在App.js中，我正在发射->socket.emit（'my other event'，{my:'data'}）；作为测试，它不会显示在终端上。此外，当我连接或断开我的应用时，服务器没有向我显示日志（但我得到了与客户端相关的日志）。理论上，我至少应该得到server.js中显示的“一个客户端刚刚加入”日志，但这并没有发生，因为你是一个救生员！！我脑子里一直在想，套接字相关的日志应该出现在我的mac终端上，所以我认为我的实现是错误的，并一直专注于更改服务器和客户端上的代码。。。我完全忘了检查heroku的日志。天啊！当我检查heroku日志时，一切都如你所说。我的数据正在那里被发送和记录。很明显，我在某些方面还是个呆子。非常感谢。