无法连接到应用程序客户端上的 WAMP 路由器

Question

我正在为物联网设备构建一个 Web 界面，该界面将更改设备的设置。我正在使用的技术堆栈如下： - 反应.JS 对于前端客户端 - 节点.js服务器 - AutobahnJS库与WAMP通信以进行RPC调用，订阅/发布事件。

在我的客户端，我正在尝试使用以下代码连接到带有高速公路的 WAMP 路由器

//Define our WAMP connection via autobahn
var url = 'ws://{ip}:{port}/';
var realm = 'com.example.embedded.api';
var connection = new autobahn.Connection({url: url, realm: realm});
console.log(connection);
connection.onopen = function (session) {
console.log("connected to WAMP router");
app.session = session;
console.log("connection to app success");
};
connection.onclose = function (reason, details) {
console.log("WAMP connection closed", reason, details);
app.session = null;
}
connection.open();

此连接失败。当我在控制台中注销问题时，错误消息是

websocket.js：167 混合内容：位于"https://{ipaddress}"的页面通过HTTPS加载，但试图连接到不安全的WebSocket端点"ws://{ip}：{port}/"。此请求已被阻止;此终结点必须可通过 WSS 使用。

我不确定为什么我的错误消息告诉我 WSS 上的端点。我能够连接到代码服务器上的该终结点。

//point to react build
app.use(express.static(path.join(__dirname, './client/build')));
//create a server
const server = https.createServer({
key: fs.readFileSync('server.key'),
cert: fs.readFileSync('server.cert')
}, app)
.listen(port, function () {
console.log(`Example app listening on port ${port}! Go to https://localhost`)
});
//open up a websocket
const wss = new WebSocket.Server({ server });
console.log("wss", wss);
wss.on('connection', function connection(ws) {
ws.on('message', function incoming(message) {
console.log('received: %s', message);
});
ws.send('something');
});
server.listen(port, () => console.log(`Listening on port ${port}`));

Answer 1

我不确定为什么我的错误消息告诉我 WSS 上的端点。我能够连接到代码服务器上的该终结点。

您收到的错误消息告诉您网页是通过https加载的。 这意味着页面连接到或加载的任何其他资源也需要是安全的。 但是，您的 webSocket 连接代码不安全。 它正在使用不安全的ws://xxx。 此代码：

//Define our WAMP connection via autobahn
var url = 'ws://{ip}:{port}/';
var realm = 'com.example.embedded.api';
var connection = new autobahn.Connection({url: url, realm: realm});

正在使用不安全的ws://网址。 如果主网页是通过https加载的，则浏览器强制要求页面使用的其他资源也必须通过安全链接加载。

要解决此问题，可能的选择是：

1. 使用wss://xxx进行安全连接。
2. 更改页面，使其通过http不安全加载(不推荐(。
3. 更改连接到资源的方式，以便通过到服务器的安全链接代理与资源的连接。