Vue项目中链接websocket，做一个全局通知信息

矫情吗；* 2022-02-25 15:06 799阅读 0赞

# 首先在index.html中加上下面一段代码 #

<script>
        var websocket = null
        var localHref = window.location.host === 'localhost:9528' ? '线上服务器地址' : window.location.host
        if ('WebSocket' in window) {
          // websocket = new WebSocket('ws://线上服务器地址/webSocket')
          websocket = new WebSocket('ws://线上服务器地址/webSocket')
          // websocket = new WebSocket('ws://' + localHref + '/webSocket')
        } else {
          alert('该浏览器不支持websocket!')
        }
        websocket.onopen = function(event) {
          console.log('建立连接')
        }
        websocket.onmessage = function(event) {
          console.log('socket收到消息', event)
          console.log('收到消息:' + event.data)
          // alert('收到消息:' + event.data)
        }
        websocket.onerror = function() {
          console.log('websocket通信发生错误！')
        }
        window.onbeforeunload = function() {
          websocket.close()
        }
        websocket.onclose = function(event) {
          console.log('连接关闭')
        }
      </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，799人围观）

还没有评论，来说两句吧...

相关阅读

相关 websocket链接使用方法

是在vue中的使用，JQ也可以使用，只需要修改成JQ语法就行 initWebSocket()\{ //初始化weosocket 　　　　　　　let userID ...

谁践踏了优雅/ 2024年04月18日 20:45/ 0 赞/ 79 阅读

相关 nginx代理webSocket链接，webSocket频繁断开重连

目录一、场景二、nginx代理配置三、原因四、解决 -------------------- 一、场景

电玩女神/ 2023年10月15日 08:07/ 0 赞/ 142 阅读

相关 nginx代理webSocket链接响应403

目录一、场景 1、nginx访问日志响应403 2、浏览器链接失败二、nginx配置

╰+哭是因爲堅強的太久メ/ 2023年10月14日 22:23/ 0 赞/ 4 阅读

相关 vue4 跳转外部链接_vue项目跳转到外部链接

vue项目中遇到一个打印的功能。思考之后决定点击按钮，跳转到一个HTML页面(后台写的)，利用window.print()方法调用浏览器的打印的功能。所以，现在的问题是，怎

桃扇骨/ 2022年10月26日 14:09/ 0 赞/ 37 阅读

相关 vue项目全局中引入scss

一、概述有一个scss文件，需要应用到每一个vue文件。如果每一个vue文件写重复代码，浪费精力。关于scss的安装，请参考链接：[https://www.cnbl

朴灿烈づ我的快乐病毒、/ 2022年10月15日 11:52/ 0 赞/ 275 阅读

相关用Vue.extend()来做一个全局提示组件

相信很多人用vuejs构建单页应用时都会用到一些全局方法，比如发ajax请求时喜欢用axios挂载到vue原型上，如下： // 1 引入vue和axios i

忘是亡心i/ 2022年10月11日 00:58/ 0 赞/ 1 阅读

相关 Vue项目中链接websocket，做一个全局通知信息

首先在index.html中加上下面一段代码 <script> var websocket = null var localHre

矫情吗；*/ 2022年02月25日 15:06/ 0 赞/ 800 阅读

相关过年了，基于Vue做一个消息通知组件

前言今天除夕，在这里祝大家新年快乐！！！今天在这个特别的日子里我们做一个消息通知组件，好，我们开始行动起来吧！！！项目一览效果很简单，就是这种的小卡片似的效

红太狼/ 2021年09月07日 06:10/ 0 赞/ 337 阅读

相关 nodejs（npm）——创建全局链接

我们都知道，在使用 npm 安装包的时候，有两种模式：本地模式和全局模式。它们的区别是前者将包安装到了当前目录的node\_modules下，后者把包安装到

亦凉/ 2021年06月24日 14:00/ 0 赞/ 734 阅读

相关 HTML超链接怎么做

页超链接怎么做？html怎么加超链接？我们在阅读文章的时候，会看到文字加了一个链接，点击之后，跳到另外一个页面，很多人好奇，下面我们来讲解一下超链接怎么做？ ![for...

灰太狼/ 2021年02月01日 17:33/ 0 赞/ 806 阅读