js中简单的使用webSocket

js中简单的使用webSocket

创建websocket对象

websocket事件

websocket方法

实现简单链接

    <input type="text" placeholder="请输入内容">
	<button>发送</button>
	<div></div>
	<script>
		let input = document.querySelector('input')
		let button  = document.querySelector('button')
		let div = document.querySelector('div')
		let  websocket = new WebSocket('ws://echo.websocket.org')
		// open:当前websocket服务器链接成功时候触发
		websocket.addEventListener('open',function(){
		  div.innerHTML = '链接服务成功了'
		})
</script>

浏览器显示

点击事件触发

// 点击事件主动发送websocke消息
button.addEventListener('click',function(){
	let value = input.value
	websocket.send(value)
})

浏览器截图

最后一步

仅供参考 谢谢