套接字客户端无法在移动浏览器上连接,但在桌面浏览器上可以正常工作

时间:2019-10-18 17:18:57

标签: node.js reactjs socket.io

我想在26日前参加一场万圣节游戏,哈哈!套接字无法在android firefox / ios firefox / safari上建立连接,但可以在Windows和Mac中的firefox / chrome / safari桌面浏览器上正常工作。任何线索都值得赞赏!

项目在这里运行: another responder

完整代码: https://commune-games.herokuapp.com/

这是在heroku上运行的,服务器运行在8080上,我尝试将客户端与以下端点连接: 本地主机:8080 127.0.0.1:8080 commune-games.herokuapp.com:8080

也尝试了没有端点的尝试,例如: const socket = io();

我尝试在80和443上运行服务器,并相应地更改前端端点。没什么。

// server
const express = require('express');
const http = require('http');
const socketIo = require('socket.io');
const port = process.env.PORT || 8080;
const app = express();
const server = http.createServer(app);
const io = socketIo(server);
var moment = require('moment');

var connectedUsers = {};
var rooms = {};

app.use(express.static(__dirname + '/build'));

app.get('/', (req, res) => {
  res.sendFile(path.resolve('build/index.html'), { root: __dirname }, err => {
    if (err) {
      res.status(500).send(err);
    }
  });
});



io.on('connection', function(socket) {
  console.log('A user is connected.');
  socket.emit('connected', true);
}
server.listen(port, () => console.log(`Listening on port ${port}`));

// react client side
import React from 'react';
import ReactDOM from 'react-dom';
import history from './history';

import { Router, Route, Switch } from 'react-router-dom';
import './index.css';

import io from 'socket.io-client';

// COMPONENTS
import Home from './components/home';
import Room from './components/room';

class App extends React.Component {
  state = {
    callSign: '',
    endpoint: 'ws://localhost:8080',
    response: false,
    socket: null
  };

  componentDidMount() {
    console.log(document.location.origin.replace(/^http/, 'ws'));
    if (document.location.origin.startsWith('https')) {
      this.setState({ endpoint: document.location.origin.replace(/^https/, 'ws') + ':8080' });
    } else {
      this.setState({ endpoint: document.location.origin.replace(/^http/, 'ws') + ':8080' });
    }
    const { endpoint } = this.state;
    const socket = io(endpoint);
    this.setState({ socket: socket });
  }

由于我的Ios版本不允许我进行远程调试,因此我在前端选中了一个复选框,以指示它是否已成功连接到套接字。在所有台式机浏览器上都可以正常运行,但在android / ios浏览器上却不能。

0 个答案:

没有答案