版权声明:本文为博主原创文章,未经博主同意不得转载。

https://blog.csdn.net/www19940501a/article/details/27585321

接着上一篇

我用的开发工具是sublime 

打开之前创建的工程。

打开www

改动并加入代码

#!/usr/bin/env node
var debug = require('debug')('my-application');
var app = require('../app');
var io=require("socket.io").listen(app.listen(app.get('port'))); app.set('port', process.env.PORT || 3000); io.sockets.on('connection',function(socket){
socket.emit('connected');
}); var server = app.listen(app.get('port'), function() {
debug('Express server listening on port ' + server.address().port);
});

同一时候改动index.ejs

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style.css' />
<script type="text/javascript" src="/socket.io/socket.io.js"></script>
</head>
<body>
<script type="text/javascript">
var socket=io.connect('/');
socket.on('connected',function(){
alert('connected to chattingRoom!');
});
</script>
<h1><%= title %></h1>
<p>Welcome to <%= title %></p>
</body>
</html>

解释一下,这里为了与服务端的socket服务通信,要引入socket.io.js,这个文件由socket.io提供服务。我们无须把这个文件加入到static文件夹中。

之后执行并訪问http://localhost:3000/

justhacker@justhacker-ThinkPad-Edge-E440:~/projects/nodejs/chattingnode$ node ./bin/www
GET / 304 11ms
GET /stylesheets/style.css 304 3ms
GET /socket.io/socket.io.js 404 7ms - 1.13kb

项目源代码地址:https://github.com/edagarli/chattingnode

可关注。之后会不断更新。

socket.io+angular.js+express.js做个聊天应用(二)的更多相关文章

  1. socket.io+angular.js+express.js做个聊天应用(三)

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/www19940501a/article/details/27590611 接着前面博客文章socke ...

  2. soket.io.js + angular.js + express.js(node.js)

    soket.io.js + angular.js + express.js(node.js) 今天搭建个soket.io.js + angular.js + express.js的环境, 采坑无数,特 ...

  3. Angular JS + Express JS入门搭建网站

    3月份开始,接到了新的任务,跟UI开发有关,用的是Angular JS,Express JS等技术.于是周末顺便学习下新技术. 组里产品UI架构如下: 其中前端,主要使用Angular JS框架,另外 ...

  4. socket.io+angular.js+express.js做个聊天应用(四)

    接着上一篇 使用angularjs构建聊天室的client <!doctype html> <html ng-app="justChatting"> < ...

  5. 【socket.io研究】3.手机网页间聊天核心问题

    前面我们已经说了服务器相关的一些内容,且又根据官网给出的一个例子写了一个可以聊天的小程序,但是这还远远不够呀,这只能算是应用前的准备工作.接下来,一起来考虑完善一个小的聊天程序吧. 首先,修改服务器的 ...

  6. Vue3 + Socket.io + Knex + TypeScript 实现可以私聊的聊天室

    前言 下文只在介绍实现的核心代码,没有涉及到具体的实现细节,如果感兴趣可以往下看,在文章最后贴上了仓库地址.项目采用前后端模式,前端使用 Vite + Vue3 + TS:后端使用 Knex + Ex ...

  7. socket.io+angular.js+express.js做个聊天应用(一)

    node,express开发环境等安装如果已经搞好了. justhacker@justhacker-ThinkPad-Edge-E440:~/projects/nodejs$ express -e c ...

  8. 基于 Sequelize.js + Express.js 开发一套 Web 后端服务器

    什么是 Sequelize 我们知道 Web 应用开发中的 Web 后端开发一般都是 Java.Python.ASP.NET 等语言.十年前,Node.js 的出现使得原本仅限于运行在浏览器中的 Ja ...

  9. 使用Node.js+Socket.IO搭建WebSocket实时应用

    Web领域的实时推送技术,也被称作Realtime技术.这种技术要达到的目的是让用户不需要刷新浏览器就可以获得实时更新.它有着广泛的应用场景,比如在线聊天室.在线客服系统.评论系统.WebIM等. W ...

随机推荐

  1. 【转】C#中continue、break和return用法

    continue和break的用法一样,直接写上这个单词,后面加一个分号就行 比如: continue; break; 我们先来谈continue 看代码 for (int i=0; i<10; ...

  2. MyEclipse中新建JSP页面编码设置(UTF-8)

    今天再次遭遇反人类的Eclipse,新建JSP页面编码竟然是不是UTF8,导致各种乱码.做下面的修改就能避免这个问题了.

  3. Java新建线程的两种方式

    Java新建线程有两种方式,一种是通过继承Thread类,一种是实现Runnable接口,下面是新建线程的两种方式. 我们假设有个竞赛,有一个选手A做俯卧撑,一个选手B做仰卧起坐.分别为两个线程: p ...

  4. Form表单中Post与Get方法的区别

    Form提供了两种数据传输的方式:get和post.虽然它们都是数据的提交方式,但是在实际传输时确有很大的不同,并且可能会对数据产生严重的影响. Form中的get和post方法,在数据传输过程中分别 ...

  5. sql or语法

    1.mysql中or语法的使用,在mysql语法中or使用注意点. 项目遇到坑,遍历发放奖励数据查询错误!!! $sql = 'SELECT * FROM `vvt_spread_doubleegg_ ...

  6. vue.js 开发环境配置

    1. node.js环境(npm包管理器) 下载: https://nodejs.org/en/download/current/ 下载解压版的方便 添加path环境后运行 npm包管理器,是集成在n ...

  7. Codeforces 750 F:New Year and Finding Roots

    传送门 首先如果一开始就找到了一个叶子,那么暴力去递归找它的父亲,每次随机一个方向(除了已知的儿子)走深度次,如果走到了一个叶子就不是这个方向 (设根的深度为 \(1\))这样子最后到达深度为 \(3 ...

  8. js-NodeList对象和HTMLCollection对象

    getElementsByName()和getElementsByTagName()都返回NodeList对象,而类似document.images和document.forms的属性为HTMLCol ...

  9. vue如何实现代码打包分离(按需加载)

    在vue中使用import()来代替require.ensure()实现代码打包分离 一.require.ensure() 方法来实现代码打包分离 require.ensure() 是 webpack ...

  10. PS改变图像颜色

    由于写的一个页面主色调变了,里面的一些图标颜色也要相应改变,自己难得重新去psd里面截图,就想着用ps,看能否直接能变换一下图标颜色.其实方法也很简单的. 1:用ps打开需要改变图标颜色的文件,然后选 ...