SocketIO : WebSocket ถูกปิดก่อนที่จะสร้างการเชื่อมต่อ

ฉันใช้ angular 4, Express 4.16.3 และ Socket.IO 2.1.1 เพื่อสร้างเครื่องมือแชทสำหรับ แผงควบคุมผู้ดูแลระบบ โดยที่ ทีมสนับสนุนที่ใช้แผงผู้ดูแลระบบสามารถสนทนากับลูกค้าบนเว็บไซต์ที่ฉันใช้เซิร์ฟเวอร์หนึ่งฝั่งแผงผู้ดูแลระบบและ ลูกค้า 2 ราย โดยที่ลูกค้ารายหนึ่งกลับมาอยู่ในแผงผู้ดูแลระบบอีกครั้งสำหรับทีมสนับสนุนและ อีกอันอยู่ฝั่งเว็บไซต์สำหรับลูกค้า

ฉันมีสองโดเมนย่อย (หนึ่งโดเมนสำหรับพาเนลและอีกโดเมนสำหรับเว็บไซต์) และอ้างถึง คำตอบนี้ เนื่องจากฉันต้องการโซลูชันสำหรับการเชื่อมต่อข้ามโดเมนใน socket.io
เซิร์ฟเวอร์อยู่บน adminpanel.azurewebsites.net
สองของฉัน ลูกค้าถูกปรับใช้บนโดเมนย่อยทั้งสอง:
ไคลเอนต์เว็บไซต์บน website.azurewebsites.net และ
ไคลเอนต์ Panel(support) บน adminpanel.azurewebsites.net
และฉันได้เปิดใช้งาน CORS บน adminpanel.azurewebsites.net (ตั้งค่าส่วนหัว Access-Control-Allow-Origin เป็น *) และฉันได้เปิดใช้งาน websockets บนพอร์ทัล azure แล้ว แอพของฉันทั้งสองเป็น https

ฝั่งเซิร์ฟเวอร์(แผงผู้ดูแลระบบ) มีลักษณะดังนี้:

port = process.env.PORT || 1337;
var server = require('http').Server(app);
var io = require('socket.io')(server ,{
  transports: ['websocket']
});

io.on('connection', function(socket) {
   socket.emit('socket connected')
//every time a new customer added on website end, new room is created
   socket.on('new customer added', function(username) {
      socket.broadcast.emit('new room', username)
    })
});
server.listen(port);

ฝั่งไคลเอ็นต์(แผงผู้ดูแลระบบ) มีลักษณะดังนี้ :

this.socketUrl = 'adminpanel.azurewebsites.net'
this.sockets['main'] = io.connect(this.socketUrl, {
      transports: ['websocket']
    });

this.sockets['main'].on('new room', (room) => {
  this.sockets[room] = io.connect(this.socketUrl+'?token=' + room, {
    transports: ['websocket']
  });
});

บนฝั่งไคลเอ็นต์ของแผงควบคุม ห้องจะถูกสร้างขึ้นสำหรับลูกค้าใหม่ทุกคน

ฝั่งไคลเอ็นต์(เว็บไซต์) มีลักษณะดังนี้ :

this.socket = io.connect('adminpanel.azurewebsites.net?token=' + this.username, {
      transports: ['websocket']
    });
this.socket.emit('new customer added', this.username);

ตอนนี้ ปัญหาคือ มันทำงานได้อย่างสมบูรณ์แบบบน localhost แต่ในการใช้งานจริง มีคำเตือน

การเชื่อมต่อ WebSocket กับ 'wss://adminpanel.azurewebsites.net/socket.io/?token=Test%20Name&EIO=3&transport=websocket' ล้มเหลว: WebSocket ถูกปิดก่อนที่จะสร้างการเชื่อมต่อ

ปรากฏขึ้นทั้งด้านแผงผู้ดูแลระบบและด้านเว็บไซต์ และหลังจากนั้นแชทก็หยุดทำงาน

คำเตือนนี้ปรากฏขึ้นสองสามครั้ง จากนั้นข้อผิดพลาดต่อไปนี้จะปรากฏขึ้น:

enter code hereWebSocket เชื่อมต่อกับ 'wss://adminpanel.azurewebsites.net/socket.io/?token=Test%20Name&EIO=3&transport=websocket' ล้มเหลว: การจับมือเปิด WebSocket หมดเวลา

หลังจากการดีบัก นี่คือสิ่งที่ฉันได้รับ:

engine.io-client:socket socket error {"type":"TransportError","description":{"isTrusted":true}} +4ms
socket.io-client:manager connect_error +8ms
socket.io-client:manager cleanup +4ms
socket.io-client:manager reconnect attempt error +5ms
socket.io-client:manager will wait 2154ms before reconnect attempt +3ms
engine.io-client:socket socket close with reason: "transport error" +19ms
engine.io-client:socket socket closing - telling transport to close +3ms
socket.io-client:manager attempting reconnect +2s
socket.io-client:manager readyState closed +2ms
socket.io-client:manager opening https://adminpanel.azurewebsites.net?token=Test Name +3ms
engine.io-client:socket creating transport "websocket" +2s
engine.io-client:socket setting transport websocket +3ms
socket.io-client:manager connect attempt will timeout after 20000 +10ms
socket.io-client:manager connect attempt timed out after 20000 +20s
engine.io-client:socket socket close with reason: "forced close" +20s

ดังนั้นแอปจึงทำงานได้ดีในบางครั้ง แต่คำเตือนนี้ปรากฏขึ้นและแอปหยุดทำงาน

ฉันไม่สามารถทราบได้ว่าอะไรเป็นสาเหตุของข้อผิดพลาดนี้ และฉันจะหยุดไม่ให้เกิดขึ้นได้อย่างไร มีวิธีแก้ไขปัญหานี้หรือไม่?