SpringCloud 网关配置websocket

一、nginx

  https://域名.com

    location /websocket/ {
        proxy_pass http://172.1.1.173:8181/;   #内网网关IP
        proxy_http_version 1.1;
        proxy_read_timeout 360s;   
        proxy_redirect off;   
        proxy_set_header Upgrade $http_upgrade; 
        proxy_set_header Connection "upgrade";    #配置连接为升级连接
        proxy_set_header Host $host:$server_port;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header REMOTE-HOST $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

二、网关

1、routes配置

        - id: id-websocket
          uri: lb:ws://zzf-websocket
          predicates:
            - Path=/ws/**  

zzf-websocket 为websocket 微服务 服务名称

2、安全配置（白名单）
security:

   ignore:
     whites:
       - /ws/**

  

三、web

.env.production

# Websocket
VUE_APP_WS_URL = 'wss://域名.com/websocket/ws/'

vue: 

setupWebSocket() {try {this.websocket = new WebSocket(process.env.VUE_APP_WS_URL + '/orderWebsocket') // 创建WebSocket连接this.websocket.onopen = this.onWebSocketOpen // WebSocket连接打开时的处理函数this.websocket.onmessage = this.onWebSocketMessage // 收到WebSocket消息时的处理函数this.websocket.onclose = this.onWebSocketClose // WebSocket连接关闭时的处理函数} catch (e) {console.error(e)}},onWebSocketMessage(event) {const message = event.dataconsole.log('onWebSocketMessage {}',message)this.notifyOrder(message);this.$modal.notifySuccess(message);
},
onWebSocketClose() {console.log(this.reconnectCount+ ' WebSocket connection is closed')this.stopHeartbeat() // WebSocket连接关闭时，停止心跳检测if(this.reconnectCount>0){setTimeout(this.setupWebSocket, this.reconnectInterval) // 在一定时间后重连WebSocketthis.reconnectCount --;}},
startHeartbeat() {this.heartbeatInterval = setInterval(() => {if (this.websocket && this.websocket.readyState === WebSocket.OPEN) {this.websocket.send('ping') // 发送心跳消息}}, 10000) // 每10秒发送一次心跳
},
stopHeartbeat() {if (this.heartbeatInterval) {clearInterval(this.heartbeatInterval) // 停止心跳检测定时器}
},onWebSocketOpen() {console.log('链接成功')
},closeWebSocket() {if (this.websocket) {this.websocket.close() // 关闭WebSocket连接}
},