广告
返回顶部
首页 > 资讯 > 前端开发 > VUE >WebSocket使用实例分析
  • 417
分享到

WebSocket使用实例分析

2024-04-02 19:04:59 417人浏览 八月长安
摘要

本文小编为大家详细介绍“websocket使用实例分析”,内容详细,步骤清晰,细节处理妥当,希望这篇“WEBSocket使用实例分析”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

本文小编为大家详细介绍“websocket使用实例分析”,内容详细,步骤清晰,细节处理妥当,希望这篇“WEBSocket使用实例分析”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

    WebSocket协议本质上是一个基于tcp的协议。

    为了建立一个WebSocket连接,客户端浏览器首先要向服务器发起一个Http请求,这个请求和通常的HTTP请求不同,包含了一些附加头信息,其中附加头信息"Upgrade:WebSocket"表明这是一个申请协议升级的HTTP请求,服务器端解析这些附加的头信息然后产生应答信息返回给客户端,客户端和服务器端的WebSocket连接就建立起来了,双方就可以通过这个连接通道自由的传递信息,并且这个连接会持续存在直到客户端或者服务器端的某一方主动的关闭连接。

    客户端的htmljavascript

    目前大部分浏览器支持WebSocket()接口,你可以在以下浏览器中尝试实例:Chrome,Mozilla,Opera和Safari。

    runoob_websocket.html文件内容

<!DOCTYPE HTML>

<html>

   <head>

   <meta charset="utf-8">

   <title>菜鸟教程(runoob.com)</title>

      <script type="text/javascript">

         function WebSocketTest()

         {

            if ("WebSocket" in window)

            {

               alert("您的浏览器支持 WebSocket!");

               // 打开一个 web socket

               var ws = new WebSocket("ws://localhost:9998/echo");

               ws.onopen = function()

               {

                  // Web Socket 已连接上,使用 send() 方法发送数据

                  ws.send("发送数据");

                  alert("数据发送中...");

               };

               ws.onmessage = function (evt) 

               { 

                  var received_msg = evt.data;

                  alert("数据已接收...");

               };

               ws.onclose = function()

               { 

                  // 关闭 websocket

                  alert("连接已关闭..."); 

               };

            }

            else

            {

               // 浏览器不支持 WebSocket

               alert("您的浏览器不支持 WebSocket!");

            }

         }

      </script>

   </head>

   <body>

      <div id="sse">

         <a href="javascript:WebSocketTest()">运行 WebSocket</a>

      </div>

   </body>

</html>

读到这里,这篇“WebSocket使用实例分析”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注编程网VUE频道。

--结束END--

本文标题: WebSocket使用实例分析

本文链接: https://www.lsjlt.com/news/91074.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • WebSocket使用实例分析
    本文小编为大家详细介绍“WebSocket使用实例分析”,内容详细,步骤清晰,细节处理妥当,希望这篇“WebSocket使用实例分析”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。...
    99+
    2022-10-19
  • WebSocket的示例分析
    这篇文章主要介绍WebSocket的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!一、Socket简介Socket又称"套接字",应用程序通常通过"套接字"向网络发出请...
    99+
    2023-06-22
  • golang中vue使用websocket的示例分析
    小编给大家分享一下golang中vue使用websocket的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!一. 编写golang服务端导入必要的webs...
    99+
    2023-06-15
  • WebSocket与实时通信的应用案例分析
    随着互联网的发展和技术的进步,实时通信在各种应用中变得越来越重要。而传统的基于HTTP的请求-响应模式往往无法满足实时通信的需求,因此WebSocket作为一种新的协议应运而生。WebSocket协议基于TCP,允许在客户端和服务器之间建立...
    99+
    2023-10-21
    WebSocket:WebSocket是一种协议 支持实时通信。关键词:WebSocket
  • websocket+sockjs+stompjs的示例分析
    这篇文章主要介绍了websocket+sockjs+stompjs的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。1.http与websockethttp超文本传输协...
    99+
    2023-06-09
  • golang基于websocket通信tcp keepalive实例分析
    本文小编为大家详细介绍“golang基于websocket通信tcp keepalive实例分析”,内容详细,步骤清晰,细节处理妥当,希望这篇“golang基于websocket通信tcp keepalive实例分析”文...
    99+
    2023-06-30
  • SAP使用实例分析
    这篇文章主要介绍了SAP使用实例分析的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇SAP使用实例分析文章都会有所收获,下面我们一起来看看吧。大家知道采购业务里,有一种特殊的采购形式,就是按单采购,意思是所采购的...
    99+
    2023-06-05
  • SpringMVC使用实例分析
    这篇文章主要介绍了SpringMVC使用实例分析的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇SpringMVC使用实例分析文章都会有所收获,下面我们一起来看看吧。一丶SpringMVC概述Spring 为展现...
    99+
    2023-06-27
  • Proxy使用实例分析
    这篇文章主要讲解了“Proxy使用实例分析”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Proxy使用实例分析”吧!了解代理模式一个例子作为一个单身钢铁直男程序员,小王最近逐渐喜欢上了前端小...
    99+
    2023-06-27
  • Yum使用实例分析
    这篇文章主要讲解了“Yum使用实例分析”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Yum使用实例分析”吧!Yum是一个在Fedora和RedHat以及CentOS中的Shell前端软件包管...
    99+
    2023-06-27
  • CSS3使用实例分析
    这篇文章主要介绍“CSS3使用实例分析”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“CSS3使用实例分析”文章能帮助大家解决问题。 1、前缀-webkit-(ch...
    99+
    2022-10-19
  • HTML使用实例分析
    本篇内容介绍了“HTML使用实例分析”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成! HTML 标题 ...
    99+
    2022-10-19
  • class使用实例分析
    这篇文章主要介绍“class使用实例分析”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“class使用实例分析”文章能帮助大家解决问题。 看到class实际都是使用...
    99+
    2022-10-19
  • slot使用实例分析
    这篇文章主要介绍“slot使用实例分析”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“slot使用实例分析”文章能帮助大家解决问题。   使用slot场景一:  ...
    99+
    2022-10-19
  • react使用实例分析
    这篇文章主要介绍“react使用实例分析”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“react使用实例分析”文章能帮助大家解决问题。为什么要引入 React在写 React 的时候,你可能会写类似...
    99+
    2023-06-27
  • Docker使用实例分析
    今天小编给大家分享一下Docker使用实例分析的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。1、进入存放自己项目war的目录...
    99+
    2023-06-27
  • ADO.NET使用实例分析
    本篇内容主要讲解“ADO.NET使用实例分析”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“ADO.NET使用实例分析”吧!用ADO.NET实例中的数据,不管是不是原创,都能够通过双面编程模型进行...
    99+
    2023-06-17
  • awk使用实例分析
    本篇内容主要讲解“awk使用实例分析”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“awk使用实例分析”吧!awk是一个强大的文本分析工具,相对于grep的查找,sed的编辑,awk在其对数据分析...
    99+
    2023-06-27
  • 使用Vue3.0实例分析
    本篇内容介绍了“使用Vue3.0实例分析”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!初始化环境在前面的文章中,我们通过vite搭建了一个开...
    99+
    2023-06-27
  • WebSocket中通信过程的示例分析
    小编给大家分享一下WebSocket中通信过程的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!什么是 WebSocket...
    99+
    2022-10-19
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作