我正在开发使用 Vue 创建的聊天应用程序,并决定暂时将其向公共网络开放以向我的朋友展示。我在本地主机上创建了一个 ngrok 隧道,我会与我的朋友分享该链接,但我遇到了与 WebSocket 相关的错误,我意识到热重载不起作用。
在检查网络控制台时,我看到了这个错误:
WebSocketClient.js:13 WebSocket 连接到“wss://192.168.1.108:8080/ws”失败。
我怀疑此问题可能是由于 Vue 配置文件中的协议从 http 更改为 https 所致。为了测试这个理论,我将协议从 https 改回了 http。令人惊讶的是,WebSocket 错误似乎已修复,但当我将协议更改为 http 时,出现了新问题并显示一条消息;
无法构建“WebSocket”:可能无法从通过 HTTPS 加载的页面发起不安全的 WebSocket 连接。
我正在寻求有关如何解决此问题的帮助。下面,我附上了配置文件的内容和错误消息的屏幕截图。
(这个问题仅在我使用Vue时出现)
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
devServer: {
https:true,
},
transpileDependencies: true,
})
图片: