js中使用websocket

后端地址是http的 websocket地址 ws开头；后端地址是https的，websocket地址wss开头；

对于websocket没有跨域的问题

import { MessageBox } from 'element-ui';
let url = "ws://192.168.0.181:8000";  //请求的后端地址let websocket = null;//全局WebSocket对象
let lockReconnect = false; // 网络断开重连
let wsCreateHandler = null; // 创建连接
export function createWebSocket(fn){try{if ('WebSocket' in window) {websocket = new WebSocket(`${url}/webSocketServer?token=${getToken()}`);} else if ('MozWebSocket' in window) {websocket = new MozWebSocket(`${url}/webSocketServer?token=${getToken()}`);} else {websocket = new SockJS(`${url}/sockjs/webSocketServer?token=${getToken()}`);}}catch {reconnect();return;}websocket.onopen = function(event) {// websocket.send("连接成功");console.log("服务已连接")};websocket.onmessage = function(event){var data=JSON.parse(event.data);if(data.type === 'exit'){MessageBox.alert(data.name, '提示', {dangerouslyUseHTMLString: true,showConfirmButton: true,type: 'warning',}).then(()=>{store.dispatch('user/resetToken').then(() => {removeToken();// window.location.reload();router.replace("/login")});});}fn(data);};websocket.onclose = function(event) {console.log("服务连接关闭")};websocket.onerror = function(event) {console.log(event,"连接出错")};
}
/***  异常处理* 处理可以检测到的异常，并尝试重新连接*/
function reconnect() {if (lockReconnect) {return;}console.log("reconnect");lockReconnect = true;// 没链接上会一直连接，设置延迟，避免过多请求wsCreateHandler && clearTimeout(wsCreateHandler);wsCreateHandler = setTimeout(function() {console.log("-----websoket异常-------");createWebSocket();lockReconnect = false;}, 1000);
}
export function websocketClose() {console.log('执行了关闭')websocket.close();    //手动关闭websocket
}

注意：系统退出后需要关闭websocket，尤其是平台需要单账号登陆的。

js中使用websocket相关推荐

js中的WebSocket
一.WebSocket定义: html5提供的单个TCP连接上进行全双工通信的协议.WebSocket允许服务端主动向客户端推送数据.在WebSocket API中,浏览器和服务器只需 ...
js ws 状态_node.js中ws模块创建服务端和客户端，网页WebSocket客户端
首先下载websocket模块,命令行输入 npm install ws 1.node.js中ws模块创建服务端 // 加载node上websocket模块 ws; var ws = require( ...
node.js中ws模块创建服务端和客户端，网页WebSocket客户端
首先下载websocket模块,命令行输入 npm install ws 1.node.js中ws模块创建服务端 // 加载node上websocket模块 ws; var ws = require( ...
js中简单的使用webSocket
js中简单的使用webSocket 创建websocket对象 websocket事件 websocket方法实现简单链接 <input type="text" place ...
HTML5中的websocket图片直播
HTML5中的websocket实现直播 1. videojs-contrib-hls 直播功能 github:https://github.com/videojs/videojs-c ...
java中websocket_Java中使用webSocket
Java中使用webSocket package com.yaoqi.controller.message; import javax.websocket.*; import javax.websoc ...
node.js中的框架
node.js中的框架载自: http://nodeframework.com/ MVC frameworks Sinatra-like These frameworks offer rich co ...
Tomcat中实现websocket和browser端访问
Tomcat中实现websocket和browser端访问简介: 在tomcat 7.0.27版本后,实现了对websocket的支持.在最新的tomcat7.0.72后,websocket的开发变 ...
vue全局安装jquery，vue使用bootstrap框架，vue中封装websocket通讯，vue引入element-ui 组件库，引入highcharts图表插件
vue安装jquery: 1.使用vue-cli创建好vue项目后,在项目文件夹下,使用命令npm install jquery --save-dev 引入jquery. 2.修改项目文件 build ...

js中使用websocket

js中使用websocket相关推荐

最新文章

热门文章