首页 web前端 H5教程 HTML5新增协议:WebSocket协议的实例

HTML5新增协议:WebSocket协议的实例

Aug 08, 2018 am 10:02 AM
websocket协议

本篇文章给大家带来的内容是关于HTML5新增协议:WebSocket协议的实例,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

WebSocket 是 HTML 5 新增的协议,基于 TCP 连接进行全双工通信

全双工通信:表示允许数据在两个方向上同时传输。

判断浏览器是否支持 WebSocket

// 判断浏览器是否支持 WebSocket
if (window.WebSocket != undefined)
 {    
    var Socket = new WebSocket('ws://localhost: 8080')
  }
登录后复制

ws 协议是 WebSocket 新增的协议,此外还有 wss 协议,表示加密的 WebSocket 协议。两者的关系如同 HTTP 协议对应 HTTPS 协议。

WebSocket 实例

// 创建 WebSocket 实例
var Socket = new WebSocket('ws://localhost:8080')
// 连接打开
Socket.addEventListener('open', function(event) {
    socket.send('Hello Server!')
})
// 建通数据传送,有数据到达时触发
Socket.addEventListener('message', function(event) {
    console.log('Message from Server', event.data)
})
// 当错误发生时,用于监听 error 事件的事件监听器
Socker.addEventListener('error', function(event) {
    console.log(event.data)
})
// 连接关闭
Socket.addEventListener('close', function(event){
    console.log(event.data)
})
登录后复制

相关文章推荐:

HTML5应用:离线的应用以及存储的应用

HTML标签:img标签的用法总结

以上是HTML5新增协议:WebSocket协议的实例的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门文章

两个点博物馆:邦格荒地地点指南
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章

两个点博物馆:邦格荒地地点指南
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章标签

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

如何将音频添加到我的HTML5网站上? 如何将音频添加到我的HTML5网站上? Mar 10, 2025 pm 03:01 PM

如何将音频添加到我的HTML5网站上?

如何使用HTML5页面可见性API检测页面何时可见? 如何使用HTML5页面可见性API检测页面何时可见? Mar 13, 2025 pm 07:51 PM

如何使用HTML5页面可见性API检测页面何时可见?

如何将HTML5表单用于用户输入? 如何将HTML5表单用于用户输入? Mar 10, 2025 pm 02:59 PM

如何将HTML5表单用于用户输入?

如何使用视口元标记来控制移动设备上的页面缩放? 如何使用视口元标记来控制移动设备上的页面缩放? Mar 13, 2025 pm 08:00 PM

如何使用视口元标记来控制移动设备上的页面缩放?

如何使用HTML5通知API显示桌面通知? 如何使用HTML5通知API显示桌面通知? Mar 13, 2025 pm 07:57 PM

如何使用HTML5通知API显示桌面通知?

如何使用地理位置API处理用户位置隐私和权限? 如何使用地理位置API处理用户位置隐私和权限? Mar 18, 2025 pm 02:16 PM

如何使用地理位置API处理用户位置隐私和权限?

如何将HTML5拖放API用于交互式用户界面? 如何将HTML5拖放API用于交互式用户界面? Mar 18, 2025 pm 02:17 PM

如何将HTML5拖放API用于交互式用户界面?

如何使用HTML5和JavaScript创建互动游戏? 如何使用HTML5和JavaScript创建互动游戏? Mar 10, 2025 pm 06:34 PM

如何使用HTML5和JavaScript创建互动游戏?

See all articles