基于node.js的websocket 前后端交互小功能
一、node
var ws = require("nodejs-websocket");
console.log("开始建立连接...")
var server = ws.createServer(function(conn){
conn.on("text", function (str) {
console.log("收到的信息为:"+str)/*
conn.sendText(str)*/
//回调
var backStr = 'get the str'
conn.send(JSON.stringify(backStr))
console.log('发送回调信息')
})
conn.on("close", function (code, reason) {
console.log("关闭连接")
});
conn.on("error", function (code, reason) {
console.log("异常关闭")
});
}).listen(8001)
console.log("WebSocket建立完毕")
二、html
<!DOCTYPE html>
<html>
<head>
<title>massage</title>
</head>
<body>
<div>
<input id="msg" type="text" name="">
</div>
<button id="sendMessage">发送消息给服务器</button>
<div>
<span>来自server:</span>
<span id="serverMsg"></span>
</div>
<script type="text/javascript">
window.onload = function () {
var sendBtn = document.getElementById('sendMessage')
sendBtn.addEventListener('click', function () {
var msg = document.getElementById('msg')
sendMessageToServer(msg.value);
}) function sendMessageToServer (msg) {
msgJSON = JSON.stringify(msg)
var socket = new WebSocket("ws://localhost:8001")
console.log(socket)
setTimeout( function () {
if (socket.readyState == WebSocket.OPEN) {
socket.send(msgJSON)
}else {
console.log("the socket is not open")
}
//接收server返回内容
socket.onmessage = function (event) {
console.log(event)
var backMsg = JSON.parse(event.data)
if (backMsg) {
document.getElementById('serverMsg').innerHTML = backMsg
console.log(backMsg)
}
}
}, 500)
}
}
</script>
</body>
</html>
基于node.js的websocket 前后端交互小功能的更多相关文章
- Node之简单的前后端交互
node是前端必学的一门技能,我们都知道node是用的js做后端,在学习node之前我们有必要明白node是如何实现前后端交互的. 这里写了一个简单的通过原生ajax与node实现的一个交互,刚刚学n ...
- 基于node.js 的 websocket的移动端H5直播开发
这一篇介绍一下基于node.js 的 websocket的移动端H5直播开发, 下载文章底部的源码,我是用vscode打开, 首先在第一个终端运行 npm run http-server 这个指令是运 ...
- Node.js入门：前后端模块的异同
通常有一些模块可以同时适用于前后端,但是在浏览器端通过script标签的载入JavaScript文件的方式与Node.js不同.Node.js在载入到最终的执行中,进行了包装,使得每个文件中的 ...
- 基于Node.js的微信JS-SDK后端接口实现
做了一个网站,放到线上,用微信打开,点击分享,可是分享后发给朋友的链接卡片是微信默认自带的,如下: 这标题,描述以及图片是默认自带的,丑不说,分享给别人还以为是盗号网站呢,而接入微信的JSSDK后,分 ...
- 基于node.js的websocket上传小功能
一.node.js 在目录里新建index.js var ws = require("nodejs-websocket"); console.log("开始建立连接... ...
- 基于Node.js+MySQL开发的开源微信小程序B2C商城（页面高仿网易严选）
界面高仿网易严选商城(主要是2016年wap版) 测试数据采集自网易严选商城 功能和数据库参考ecshop 服务端api基于Node.js+ThinkJS+MySQL 计划添加基于Vue.js的后台管 ...
- 基于Node.js + WebSocket 的简易聊天室
代码地址如下:http://www.demodashi.com/demo/13282.html Node.js聊天室运行说明 Node.js的本质就是运行在服务端的JavaScript.Node.js ...
- 《基于Node.js实现简易聊天室系列之详细设计》
一个完整的项目基本分为三个部分:前端.后台和数据库.依照软件工程的理论知识,应该依次按照以下几个步骤:需求分析.概要设计.详细设计.编码.测试等.由于缺乏相关知识的储备,导致这个Demo系列的文章层次 ...
- Node.js实现前后端交互——用户注册
我之前写过一篇关于使用Node.js作为后端实现用户登陆的功能,现在再写一下node.js做后端实现简单的用户注册实例吧.另外需要说的是,上次有大佬提醒需要加密数据传输,不应该使用明文传输用户信息.在 ...
随机推荐
- 【LOJ】#3086. 「GXOI / GZOI2019」逼死强迫症
LOJ#3086. 「GXOI / GZOI2019」逼死强迫症 这个就是设状态为\(S,j\)表示轮廓线为\(S\),然后用的1×1个数为j 列出矩阵转移 这样会算重两个边相邻的,只要算出斐波那契数 ...
- python *****【异常处理】*****
try: val = input('请输入数字:') num = int(val) except Exception as e: print('操作异常') # import requests # # ...
- 计算广告CTR预估系列(七)--Facebook经典模型LR+GBDT理论与实践
计算广告CTR预估系列(七)--Facebook经典模型LR+GBDT理论与实践 2018年06月13日 16:38:11 轻春 阅读数 6004更多 分类专栏: 机器学习 机器学习荐货情报局 版 ...
- Collections 类和Arrays类常用方法详解
1:Collections类 max(Collection <? extends T> coll):根据元素的自然顺序,返回给定集合元素中的最大元素 min(Collection < ...
- 将磁盘从FAT格式转换为NTFS格式的方法
不需要进行格式化,只需在命令提示符中输入如下内容:CONVERT X:/FS:NTFS把X换成你需要的盘符,转一个盘需十几或几十秒不等..注意:此方法不可逆转,FAT32转到NTFS后不可转回,当然也 ...
- Spingboot+Mybatis+Oracle项目配置
配置过程参考: 项目创建:http://how2j.cn/k/springboot/springboot-eclipse/1640.html 集成Mybatis使用Oracle:https://www ...
- MVC进阶讲解+小技巧-乱七八糟
开发步骤 1.建立项目 2.建立文件夹 3.建立Controllers 4.生成页面 5.编写Html+Js 6.编写异步请求的Action的方法,返回部分页(用于分页) 7.Js中显示部分页 8.增 ...
- （三）创建基于maven的javaFX+springboot项目创建
创建基于maven的javaFx+springboot项目有两种方式,第一种为通过非编码的方式来设计UI集成springboot:第二种为分离用户界面(UI)和后端逻辑集成springboot,其中用 ...
- base64编码处理大文件
在做项目的时候遇到需要将文件转为base64编码,并存储在文件中. 在将文件转为base64编码是会将文件读入内存,进行base64编码,输出到文件中.代码入下: FileInputStream st ...
- Python学习笔记：利用爬虫自动保存图片
兴趣才是第一生产驱动力. Part 1 起先,源于对某些网站图片浏览只能一张一张的翻页,心生不满.某夜,冒出一个想法,为什么我不能利用爬虫技术把想看的图片给爬下来,然后在本地看个够. 由此经过一番初尝 ...