Javascript 无法使用ngrok连接到客户端的socket.io服务器

我正在尝试连接到react native中的套接字服务器

我使用的是

ngrok

，它是移动应用程序运行时的日志

  HTTP Requests                                                                                                          
-------------                                                                                                          
                                                                                                                       
POST /io/webrtc/               400 Bad Request                                                                         
GET  /io/webrtc/               200 OK                                                                                  

{
    "code": 2,
    "message": "Bad handshake method"
}

虽然Web应用程序，但它工作得非常好

代码片段

Server.js

移动应用程序（React Native）

App.js

package.json//web App.js

#编辑

---

将套接字服务器和客户端降级到2.3.0后，问题得到解决：）

同时附加客户端错误消息。嘿@JohnSmith，我在RN应用程序中没有收到任何错误，但正如我在上面所说的那样，

ngrok

状态日志

400错误请求

也附加客户端错误消息。嘿@JohnSmith，我在RN应用程序中没有收到任何错误，但正如我上面所说的，ngrok的状态日志是400个错误请求

const express = require('express');

let io = require('socket.io')({
  path: '/io/webrtc',
});

const app = express();
const port = 8080;

//https://expressjs.com/en/guide/writing-middleware.html
app.use(express.static(__dirname + '/build'));
app.get('/', (req, res, next) => {
  res.header(
    'Access-Control-Allow-Headers',
    'Origin, X-Requested-With, Content-Type, Accept'
  );
  res.sendFile(__dirname + '/build/index.html');
});

const server = app.listen(port, () =>
  console.log(`Example app listening on port ${port}!`)
);

io.listen(server);

const peers = io.of('/webrtcPeer');

let connectedPeers = new Map();

peers.on('connection', (socket) => {
  console.log(socket.id);
  socket.emit('connection-success', { success: socket.id });
  connectedPeers.set(socket.id, socket);

  socket.on('disconnect', () => {
    console.log('disconnected!');
    connectedPeers.delete(socket.id);
  });

  socket.on('offerOrAnswer', (data) => {
    console.log('data-offer||Answer', data);
    // send to other peers if any
    for (const [socketID, socket] of connectedPeers.entries()) {
      // don't send to self
      if (socketID !== data.socketID) {
        console.log('not-offerOrAnswer', socketID, data.payload.type);
        socket.emit('offerOrAnswer', data.payload);
      }
    }
  });

  socket.on('candidate', (data) => {
    // send candidate to the other peers if any
    for (const [socketID, socket] of connectedPeers.entries()) {
      // don't send to self
      if (socketID !== data.socketID) {
        console.log('dont_send_to_self-candidate', socketID, data.payload.type);
        socket.emit('candidate', data.payload);
      }
    }
  });
});
 

import React, {useRef, useState, useEffect} from 'react';
import {View, Dimensions, Text} from 'react-native';
import io from 'socket.io-client';

const {width, height} = Dimensions.get('window');
const App = () => {
 ...
  const socket = useRef();

  const serverIP = 'https://22997aecc45f.ngrok.io';

  useEffect(() => {
    socket.current = io.connect(`${serverIP}/webrtcPeer`, {
      path: '/io/webrtc',
      query: {},
    });

    socket.current.on('connection-success', (success) => {
      console.log('success', success); // not logged :)
    });
  }, []);

  return (
    <View>
      <Text>App</Text>
    </View>
  );
};

export default App;

"react": "16.13.1",
"react-native": "0.63.3",
"react-native-webrtc": "^1.84.1",
"socket.io-client": "2.3.0"

"dependencies": {
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "react-scripts": "4.0.0",
    "socket.io-client": "^3.0.1",
    "web-vitals": "^0.2.4"
  },
  "devDependencies": {
    "express": "^4.17.1",
    "socket.io": "^3.0.1"
  }