当我尝试从服务器连接到客户端时,出现以下错误。我已经完全复制了代码,并认为我可能正在使用套接字io库的过时版本。有谁知道我错了什么或如何更新此代码? polling-xhr.js:269 GET http://localhost:6600/socket.io/?EIO=3&transport=polling&t=Mh3LzEk net :: ERR_CONNECTION_REFUSED
var app = require("express")();
var http = require("http").Server(app);
var io = require("socket.io")(http);
const port = 6600;
app.get("/", function(req, res) {
res.sendFile(__dirname + "/index.html");
});
const getVisitors = () => {
let clients = io.sockets.clients().connected;
let sockets = Object.values(clients);
let users = sockets.map(s => s.user);
return users;
};
const emitVisitors = () => {
io.emit("visitors", getVisitors());
};
io.on("connection", function(socket) {
console.log("a user connected");
socket.on("new_visitor", user => {
console.log("new_visitor", user);
socket.user = user;
emitVisitors();
});
socket.on("disconnect", function() {
emitVisitors();
console.log("user disconnected");
});
});
http.listen(port, function() {
console.log(`listening on *:${port}`);
});
//这是我的客户
import React, { Component } from "react";
import { Table } from "reactstrap";
import axios from "axios";
import openSocket from "socket.io-client";
const socket = openSocket("http://localhost:6600");
class LiveVisitors extends Component {
state = {
visitors: []
};
componentWillMount() {
axios.get("http://geoplugin.net/json.gp").then(res => {
const {
geoplugin_request,
geoplugin_countryCode,
geoplugin_city,
geoplugin_region,
geoplugin_countryName
} = res.data;
const visitor = {
ip: geoplugin_request,
countryCode: geoplugin_countryCode,
city: geoplugin_city,
state: geoplugin_region,
country: geoplugin_countryName
};
socket.emit("new_visitor", visitor);
socket.on("visitors", visitors => {
this.setState({
visitors: visitors
});
});
});
}
getCountyFlag = countryCode =>
`https://www.countryflags.io/${countryCode}/flat/64.png`;
renderTableBody = () => {
const { visitors } = this.state;
return visitors.map((v, index) => {
return (
<tr key={index}>
<td>{index + 1}</td>
<td>{v.ip}</td>
<td>
<img src={this.getCountyFlag(v.countryCode)} />
</td>
<td>{v.city}</td>
<td>{v.state}</td>
<td>{v.country}</td>
</tr>
);
});
};
render() {
return (
<React.Fragment>
<h2>Live Visitors</h2>
<Table>
<thead>
<tr>
<th>#</th>
<th>IP</th>
<th>Flag</th>
<th>City</th>
<th>State</th>
<th>Country</th>
</tr>
</thead>
<tbody>{this.renderTableBody()}</tbody>
</Table>
</React.Fragment>
);
}
}
export default LiveVisitors;