Quasar 应用程序无法连接到 heroku socket.io 服务器答案

【问题标题】：Quasar application cannot connect to heroku socket.io serverQuasar 应用程序无法连接到 heroku socket.io 服务器
【发布时间】：2021-08-19 12:53:43
【问题描述】：

我正在尝试将我的 quasar 应用程序连接到托管在 heroku 上的 socket.io express 服务器。问题是每次我尝试连接时，浏览器都会显示the request is pending，而在后端我从未收到连接消息。

这是我的后端代码

const express = require('express');
const app = express();
const PORT = process.env.PORTA || 3000;
const server = app
  .use((req, res) => {})
  .listen(PORT, () => console.log(`Server is running on port ${PORT}...`));

const io = require('socket.io')(server, {
  cors: {
    origin: '*',
    credentials: true
  }
});

io.on('connection', socket => {
  console.log('Connected: ' + socket.id);
});

这是 quasar (vue.js) 中的引导文件中的连接，其中扩展了 socket.io

import Vue from 'vue'
import VueSocketIOExt from 'vue-socket.io-extended';
import { io } from 'socket.io-client';

const socket = io(URL_CONNECTION);

Vue.use(VueSocketIOExt, socket);

正如您在后端看到的，我有一个 console.log 来查看已连接客户端的 ID。如果我在我的电脑上本地尝试这个，它工作正常，我得到了套接字 id，但是在 heroku 上，客户端无法连接而没有给我任何错误。

【问题讨论】：

标签： node.js vue.js heroku socket.io quasar-framework

【解决方案1】：

我找到了一种方法来做到这一点。我刚刚删除了我在服务器中插入的自定义端口，并设置了默认端口（process.env.PORT），然后我从客户端连接，提供端口 80。

现在，我不知道为什么，但它正在工作。

【讨论】：