SSL socket.io客户端未收到服务器响应

时间:2020-04-16 07:42:06

标签: reactjs socket.io

##问题:模拟客户端连接成功时,无法使用SSL在客户端和服务器之间建立套接字连接。

放置here on github的源代码。

##客户端

App.js 与服务器的初始连接socket

// Import Components
import React, { Component } from "react";

// vvvvvvvvvvvvvvvvvvvvvvvvvvv
// Below same code successfully in Server.js but failed in this client
const io = require("socket.io-client");
const ioClient = io.connect("https://localhost:8080", {
  secure: true,
  reconnection: true,
  rejectUnauthorized: false
});
ioClient.on("seq-num", (msg) => console.info('Client: ' + msg));
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^

class App extends Component {
  render() {
    return (<div></div>);
  }
}
export default App;

##服务器端

Server.js 简单服务器仅用于创建套接字以供客户端连接到

const expressApp = require("express")()
const fs = require("fs")
const https = require("https");
const secureServer = https.createServer({
    key: fs.readFileSync('./ssl/server.key'),
    cert: fs.readFileSync('./ssl/server.crt')
}, expressApp);
const ios = require('socket.io')(secureServer);

secureServer.listen(8080, () => {
    console.log("secure server started at 8080");
})

let sequenceNumberByClient = new Map();

// event fired every time a new client connects:
ios.on("connection", (socket) => {
    console.info(`Client connected [id=${socket.id}]`);
    // initialize this client's sequence number
    sequenceNumberByClient.set(socket, 1);

    // when socket disconnects, remove it from the list:
    socket.on("disconnect", () => {
        sequenceNumberByClient.delete(socket);
        console.info(`Client gone [id=${socket.id}]`);
    });
});

// sends each client its current sequence number
setInterval(() => {
    for (const [client, sequenceNumber] of sequenceNumberByClient.entries()) {
        client.emit("seq-num", sequenceNumber);
        sequenceNumberByClient.set(client, sequenceNumber + 1);
    }
}, 1000);

// ###### Simulate Client socket call
// Below code failed to connect if placed in client App.js
const io = require("socket.io-client");
const ioClient = io.connect("https://localhost:8080", {
    secure: true,
    reconnection: true,
    rejectUnauthorized: false
});

ioClient.on("seq-num", (msg) => console.info('Simulated client: ' + msg));

1 个答案:

答案 0 :(得分:0)

解决方案

代码很好。只需转到https://localhost:8080(或您的服务器),当浏览器请求许可时, 接受自签名证书 ,您的客户端页面现在应该可以使用了。希望这可以节省您的时间。

说明

由于客户端和服务器都在开发环境上运行,并且服务器证书是自签名的,因此chrome(或其他浏览器)会阻止未经授权的ssl证书,即在这种情况下会阻止与https://localhost:8080上的服务器的连接。