Как подключить socket.io с помощью приложения React Native, развернутого в Heroku? - PullRequest
Новая
       37

Как подключить socket.io с помощью приложения React Native, развернутого в Heroku?

0 голосов
/ 25 апреля 2018

Я почти прогнал мои пальцы, пытаясь понять это.Кажется, что существующая информация о подключении socket.io с React Native устарела, или, может, я просто неправильно что-то интерпретирую?

Мне удалось подключиться на стороне клиента (я получаю журналы консоли клиента при подключении к своему приложению).Кажется, это серверная сторона, которая вызывает у меня проблемы.Почему данные, отправляемые клиентом, не отображаются в виде журнала в моем терминале?Ни один из связанных console.logs в моем server.js не регистрируется, но регистрируется app.js console.logs.

Редактировать: Вот мой полный файл 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>
  );
 }
}

Редактировать: Вот мой полный файл server.js: 

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 };

Я получаю журналы консоли на стороне клиента очень хорошо (например,Когда я открываю свое приложение на выставке, появляется сообщение «Подключен к серверу» и «Привет: мир». Но я не получаю журналы консоли на стороне сервера.

Что я делаю не так - как мне это сделать?получить socket.io полностью работающим с развернутым приложением React-Native?

Буду очень признателен за любую помощь! Я застрял на этом навсегда.

Ответы [ 2 ]

0 голосов
/ 25 апреля 2018

Я предполагаю, что весь код работает, но не ведение журнала, так как это все, о чем вы спрашиваете.Проблема в том, что Node не выводится на консоль вашего браузера.

Если он развернут на heroku, то вы должны увидеть все, что там регистрируется, в противном случае вы можете использовать библиотеки типа https://github.com/node-inspector/node-inspector для вывода в браузер..

0 голосов
/ 25 апреля 2018

Вы не получаете журналы консоли на стороне сервера, потому что 1.) Они только регистрируются на сервере, и 2.) Вы не излучаете их, если вы действительно хотите отправить данные обратно.

...